2017-02-01 5 views
2

Ich habe drei lineare Layouts mit horizontaler Ausrichtung. Innerhalb dieser drei Ansichten ist seine Art von 3X3 Raster der Ansicht platziert. Layout XML ist wie folgtSo verschieben Sie eine Ansicht von einer Ansicht zur anderen

<?xml version="1.0" encoding="utf-8"?> 
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:id="@+id/activity_main" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 

<LinearLayout 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_centerInParent="true" 
    android:background="@android:color/darker_gray" 
    android:gravity="center" 
    android:orientation="vertical"> 

    <LinearLayout 
     android:id="@+id/ll_h1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal"> 

     <View 
      android:id="@+id/view_00" 
      android:layout_width="40dp" 
      android:layout_height="40dp" 
      android:layout_margin="5dp" 
      android:background="@drawable/round_rectangle_bg" /> 

     <View 
      android:id="@+id/view_01" 
      android:layout_width="40dp" 
      android:layout_height="40dp" 
      android:layout_margin="5dp" 
      android:background="@drawable/round_rectangle_bg" /> 

     <View 
      android:id="@+id/view_02" 
      android:layout_width="40dp" 
      android:layout_height="40dp" 
      android:layout_margin="5dp" 
      android:background="@drawable/round_rectangle_bg" /> 
    </LinearLayout> 

    <LinearLayout 
     android:id="@+id/ll_h2" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal"> 

     <View 
      android:id="@+id/view_10" 
      android:layout_width="40dp" 
      android:layout_height="40dp" 
      android:layout_margin="5dp" 
      android:background="@drawable/round_rectangle_bg_filled" /> 

     <View 
      android:id="@+id/view_11" 
      android:layout_width="40dp" 
      android:layout_height="40dp" 
      android:layout_margin="5dp" 
      android:background="@drawable/round_rectangle_bg" /> 

     <View 
      android:id="@+id/view_12" 
      android:layout_width="40dp" 
      android:layout_height="40dp" 
      android:layout_margin="5dp" 
      android:background="@drawable/round_rectangle_bg" /> 
    </LinearLayout> 

    <LinearLayout 
     android:id="@+id/ll_h3" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal"> 

     <View 
      android:id="@+id/view_20" 
      android:layout_width="40dp" 
      android:layout_height="40dp" 
      android:layout_margin="5dp" 
      android:background="@drawable/round_rectangle_bg" /> 

     <View 
      android:id="@+id/view_21" 
      android:layout_width="40dp" 
      android:layout_height="40dp" 
      android:layout_margin="5dp" 
      android:background="@drawable/round_rectangle_bg" /> 

     <View 
      android:id="@+id/view_22" 
      android:layout_width="40dp" 
      android:layout_height="40dp" 
      android:layout_margin="5dp" 
      android:background="@drawable/round_rectangle_bg" /> 
    </LinearLayout> 
</LinearLayout> 

ich will view_10 bewegen, um view_12, wie das erreichen ?? Grundsätzlich müssen Sie jede Ansicht vertikal und horizontal verschieben und den gefüllten Ansichtszustand beibehalten.

+0

teilen Sie Ihre erwartete Ausgabe –

+0

Warum nicht ein ['View Pager'] (https://developer.android.com/reference/android/support/v4/view/ViewPager.html) für die horizontale Folie verwenden. –

Antwort

1

Diese Antwort kann Ihnen helfen. Ich denke, es ist besser, diese Aufgabe mit Recyclerview mit Grid Layout Manager durchzuführen. Von der Recyclingansicht aus können Sie Ansichten wischen und diese austauschen.

zunächst alles in Abhängigkeit für die die Recycling-Ansicht und Karte im Hinblick auf Ihre Build gradle

compile 'com.android.support:recyclerview-v7:25+' 
compile 'com.android.support:cardview-v7:25+' 

Abhängigkeit hinzufügen nach dem Projekt SDK-Version, habe ich 25, so dass ich added25 habe +

Erstellen Sie jetzt die Aktivität,

öffentliche Klasse MainActivity erweitert AppCompatActivity { privaten Kontext mContext;

RelativeLayout mRelativeLayout; 
private RecyclerView mRecyclerView; 

private RecyclerView.Adapter mAdapter; 
private RecyclerView.LayoutManager mLayoutManager; 

@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 

    // Get the application context 
    mContext = getApplicationContext(); 

    // Get the widgets reference from XML layout 
    mRelativeLayout = (RelativeLayout) findViewById(R.id.activity_main); 
    mRecyclerView = (RecyclerView) findViewById(R.id.recycler_view); 

    // Initialize a new String array 
    String[] animals = { 
      "Aardvark", 
      "Albatross", 
      "Alligator", 
      "Alpaca", 
      "Ant", 
      "Anteater", 
      "Antelope", 
      "Ape", 
      "Armadillo", 
      "Donkey", 
      "Baboon", 
      "Badger", 
      "Barracuda", 
      "Bear", 
      "Beaver", 
      "Bee" 
    }; 

    /* 
     GridLayoutManager 
      A RecyclerView.LayoutManager implementations that lays out items in a grid. 
      By default, each item occupies 1 span. You can change it by providing a custom 
      GridLayoutManager.SpanSizeLookup instance via setSpanSizeLookup(SpanSizeLookup). 
    */ 
    /* 
     public GridLayoutManager (Context context, int spanCount) 
      Creates a vertical GridLayoutManager 

     Parameters 
      context : Current context, will be used to access resources. 
      spanCount : The number of columns in the grid 
    */ 
    // Define a layout for RecyclerView 
    mLayoutManager = new GridLayoutManager(mContext,3); 
    mRecyclerView.setLayoutManager(mLayoutManager); 

    // Initialize a new instance of RecyclerView Adapter instance 
    mAdapter = new AnimalsAdapter(mContext,animals); 

    // Set the adapter for RecyclerView 
    mRecyclerView.setAdapter(mAdapter); 

    setUpItemTouchHelper(); // this method is use to swipe views 
} 

Erstellen Sie die Layouts für die Klasse. In recyclerview in das Hauptlayout

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/activity_main" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:paddingBottom="@dimen/activity_vertical_margin" 
    android:paddingLeft="@dimen/activity_horizontal_margin" 
    android:paddingRight="@dimen/activity_horizontal_margin" 
    android:paddingTop="@dimen/activity_vertical_margin" 
    tools:context="com.example.crowderia.myapplication.MainActivity"> 

    <android.support.v7.widget.RecyclerView 
     android:id="@+id/recycler_view" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:scrollbars="vertical" 
     > 
    </android.support.v7.widget.RecyclerView> 
</RelativeLayout> 

Dann Carview für das Gitter custom_view.xml hinzufügen, erhalten diese Karte Ansicht wirkt als ein Element des Gitters.

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v7.widget.CardView 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/card_view" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    card_view:cardCornerRadius="4dp" 
    card_view:cardMaxElevation="4dp" 
    card_view:cardElevation="2dp" 
    card_view:contentPadding="5dp" 
    > 
    <LinearLayout 
     android:id="@+id/ll" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:padding="3dp" 
     > 
     <TextView 
      android:id="@+id/tv" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:textColor="#000" 
      android:textSize="25dp" 
      android:textStyle="bold" 
      android:layout_margin="2dp" 
      android:padding="10dp" 
      android:layout_gravity="center" 
      android:gravity="center" 
      /> 
    </LinearLayout> 
</android.support.v7.widget.CardView> 

Erstellen Sie den Adapter für das Rasterlayout.

public class AnimalsAdapter extends RecyclerView.Adapter<AnimalsAdapter.ViewHolder>{ 

private String[] mDataSet; 
private Context mContext; 
private Random mRandom = new Random(); 

public AnimalsAdapter(Context context, String[] DataSet){ 
    mDataSet = DataSet; 
    mContext = context; 
} 

@Override 
public AnimalsAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType){ 
    // Create a new View 
    View v = LayoutInflater.from(mContext).inflate(R.layout.custom_view,parent,false); 
    ViewHolder vh = new ViewHolder(v); 
    return vh; 
} 

@Override 
public void onBindViewHolder(ViewHolder holder, int position){ 
    holder.mTextView.setText(mDataSet[position]); 

// generiert ein zufälliges Farbe int color = getRandomHSVColor();

// Set a random color for TextView background 
    holder.mTextView.setBackgroundColor(getLighterColor(color)); 

    // Set a text color for TextView 
    holder.mTextView.setTextColor(getReverseColor(color)); 

    // Set a gradient background for LinearLayout 
    holder.mLinearLayout.setBackground(getGradientDrawable()); 

    // Emboss the TextView text 
    applyEmbossMaskFilter(holder.mTextView); 
} 

@Override 
public int getItemCount(){ 
    return mDataSet.length; 
} 

public static class ViewHolder extends RecyclerView.ViewHolder{ 
    public TextView mTextView; 
    public LinearLayout mLinearLayout; 
    public ViewHolder(View v){ 
     super(v); 
     mTextView = (TextView) v.findViewById(R.id.tv); 
     mLinearLayout = (LinearLayout) v.findViewById(R.id.ll); 
    } 
} 

// Custom method to apply emboss mask filter to TextView 
protected void applyEmbossMaskFilter(TextView tv){ 
    EmbossMaskFilter embossFilter = new EmbossMaskFilter(
      new float[]{1f, 5f, 1f}, // direction of the light source 
      0.8f, // ambient light between 0 to 1 
      8, // specular highlights 
      7f // blur before applying lighting 
    ); 
    tv.setLayerType(View.LAYER_TYPE_SOFTWARE,null); 
    tv.getPaint().setMaskFilter(embossFilter); 
} 

// Custom method to generate random HSV color 
protected int getRandomHSVColor(){ 
    // Generate a random hue value between 0 to 360 
    int hue = mRandom.nextInt(361); 
    // We make the color depth full 
    float saturation = 1.0f; 
    // We make a full bright color 
    float value = 1.0f; 
    // We avoid color transparency 
    int alpha = 255; 
    // Finally, generate the color 
    int color = Color.HSVToColor(alpha, new float[]{hue, saturation, value}); 
    // Return the color 
    return color; 
} 

// Custom method to create a GradientDrawable object 
protected GradientDrawable getGradientDrawable(){ 
    GradientDrawable gradient = new GradientDrawable(); 
    gradient.setGradientType(GradientDrawable.SWEEP_GRADIENT); 
    gradient.setColors(new int[]{getRandomHSVColor(), getRandomHSVColor(),getRandomHSVColor()}); 
    return gradient; 
} 

// Custom method to get a darker color 
protected int getDarkerColor(int color){ 
    float[] hsv = new float[3]; 
    Color.colorToHSV(color, hsv); 
    hsv[2] = 0.8f *hsv[2]; 
    return Color.HSVToColor(hsv); 
} 

// Custom method to get a lighter color 
protected int getLighterColor(int color){ 
    float[] hsv = new float[3]; 
    Color.colorToHSV(color,hsv); 
    hsv[2] = 0.2f + 0.8f * hsv[2]; 
    return Color.HSVToColor(hsv); 
} 

// Custom method to get reverse color 
protected int getReverseColor(int color){ 
    float[] hsv = new float[3]; 
    Color.RGBToHSV(
      Color.red(color), // Red value 
      Color.green(color), // Green value 
      Color.blue(color), // Blue value 
      hsv 
    ); 
    hsv[0] = (hsv[0] + 180) % 360; 
    return Color.HSVToColor(hsv); 
} 

Und der wichtigste Teil ist die OnItemTouchHelper-Methode. Erstellen Sie eine Methode in der Hauptaktivität und kopieren Sie diesen Code hinein.

ItemTouchHelper.SimpleCallback simpleItemTouchCallback = new ItemTouchHelper.SimpleCallback(0, ItemTouchHelper.LEFT|ItemTouchHelper.RIGHT|ItemTouchHelper.UP|ItemTouchHelper.DOWN) { 

      // not important, we don't want drag & drop 
      @Override 
      public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) { 
       return false; 
      } 


      @Override 
      public int getSwipeDirs(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) { 
       int position = viewHolder.getAdapterPosition(); 
       AnimalsAdapter mAdapter = (AnimalsAdapter) recyclerView.getAdapter(); 
       return super.getSwipeDirs(recyclerView, viewHolder); 
      } 

      @Override 
      public void onSwiped(RecyclerView.ViewHolder viewHolder, int swipeDir) { 
       int swipedPosition = viewHolder.getAdapterPosition(); 
       AnimalsAdapter mAdapter = (AnimalsAdapter) mRecyclerView.getAdapter(); 
       if (swipeDir == ItemTouchHelper.LEFT){ 
//     mAdapter.pendingRemoval(swipedPosition); 
       } else if (swipeDir == ItemTouchHelper.UP){ 
//     mAdapter.pendingAccept(swipedPosition); 
       } 
      } 

      @Override 
      public void onChildDraw(Canvas c, RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState, boolean isCurrentlyActive) { 
       View itemView = viewHolder.itemView; 

       // not sure why, but this method get's called for viewholder that are already swiped away 
       if (viewHolder.getAdapterPosition() == -1) { 
        // not interested in those 
        return; 
       } 



       super.onChildDraw(c, recyclerView, viewHolder, dX, dY, actionState, isCurrentlyActive); 
      } 
     }; 
     ItemTouchHelper mItemTouchHelper = new ItemTouchHelper(simpleItemTouchCallback); 
     mItemTouchHelper.attachToRecyclerView(mRecyclerView); 

können Sie die Swipe-Aktion in onSwiped Methode fangen und Aktion ausführen, Schreiben von Code, um dort die Carview Position zu ändern, können Sie auf dieser Postition an Adapter aufrufen und die Adapterkarten ändern, benachrichtigen Verwenden .. Methoden Refurche den Adapter. Für weitere Details lesen Sie die Dokumentation RecylerView und RecylerView adaptor Dokumentationen.

Prost !!!

Verwandte Themen