2015-10-21 8 views
6

Ho una vista di riciclaggio in cui voglio mostrare un altro layout sulla vista scorrente dell'oggetto che è nascosta dietro il layout corrente. In breve voglio realizzare qualcosa come l'immagine qui sotto.Scorri per mostrare un altro layout nascosto nella vista recycler. Android

enter image description here

Il problema con il mio codice è che la tutta la visione è fregato, ma voglio strisciare solo per la larghezza del layout di nascosto.

Codice in attività

final ItemTouchHelper.Callback simpleItemTouchCallback = new ItemTouchHelper.Callback() { 
      @Override 
      public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) { 
       if (viewHolder.getAdapterPosition() < target.getAdapterPosition()) { 
        for (int i = viewHolder.getAdapterPosition(); i < target.getAdapterPosition(); i++) { 
         Collections.swap(myDataset, i, i + 1); 
        } 
       } else { 
        for (int i = viewHolder.getAdapterPosition(); i > target.getAdapterPosition(); i--) { 
         Collections.swap(myDataset, i, i - 1); 
        } 
       } 
       mAdapter.notifyItemMoved(viewHolder.getAdapterPosition(), target.getAdapterPosition()); 
       return true; 
      } 

      @Override 
      public boolean isLongPressDragEnabled() { 
       return true; 
      } 
      @Override 
      public boolean isItemViewSwipeEnabled() { 
       return true; 
      } 
      @Override 
      public void onSwiped(final RecyclerView.ViewHolder viewHolder, final int swipeDir) { 

      } 

      @Override 
      public void onChildDraw(Canvas c, RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState, boolean isCurrentlyActive) { 
       View itemView = viewHolder.itemView; 
       ImageView delete_image=(ImageView) itemView.findViewById(R.id.delete_image); 
       delete_image.setY(itemView.getTop()); 
       if(isCurrentlyActive) { 
        delete_image.setVisibility(View.VISIBLE); 
       }else{ 
        delete_image.setVisibility(View.GONE); 
       } 
       super.onChildDraw(c, recyclerView, viewHolder, dX, dY, actionState, isCurrentlyActive); 
      } 

      @Override 
      public int getMovementFlags(RecyclerView recyclerView, 
             RecyclerView.ViewHolder viewHolder) { 
       int dragFlags = ItemTouchHelper.UP | ItemTouchHelper.DOWN; 
       int swipeFlags = ItemTouchHelper.START | ItemTouchHelper.END; 
       return makeMovementFlags(dragFlags, swipeFlags); 
      } 
     }; 


ItemTouchHelper itemTouchHelper = new ItemTouchHelper(simpleItemTouchCallback); 
     itemTouchHelper.attachToRecyclerView(mRecyclerView); 

layout personalizzato per la voce recylerview

<?xml version="1.0" encoding="utf-8"?> 
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:fresco="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal" 

    android:paddingBottom="@dimen/padding_xsmall"> 

    <LinearLayout 
     android:id="@+id/top_layout" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center_vertical" 
     android:background="@color/very_light_grey" 
     android:orientation="horizontal" 
     android:paddingBottom="@dimen/padding_xlarge" 
     android:paddingEnd="@dimen/padding_small" 
     android:paddingLeft="@dimen/padding_xlarge" 
     android:paddingRight="@dimen/padding_small" 
     android:paddingStart="@dimen/padding_xlarge" 
     android:paddingTop="@dimen/padding_xlarge"> 

     <com.facebook.drawee.view.SimpleDraweeView 
      android:id="@+id/friend_image" 
      android:layout_width="50dp" 
      android:layout_height="50dp" 
      android:layout_gravity="center_vertical" 
      fresco:placeholderImage="@drawable/user_placeholder" 
      fresco:roundAsCircle="true" 
      fresco:roundedCornerRadius="50dp" 
      fresco:roundingBorderColor="@android:color/white" 
      fresco:roundingBorderWidth="2dp" /> 

     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center_vertical" 
      android:layout_marginEnd="@dimen/margin_small" 
      android:layout_marginLeft="@dimen/margin_small" 
      android:layout_marginRight="@dimen/margin_small" 
      android:layout_marginStart="@dimen/margin_small" 
      android:orientation="vertical"> 

      <RelativeLayout 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content"> 

       <bi.it.com.bio.textview.CustomTextView 
        android:id="@+id/friend_name" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:layout_alignParentLeft="true" 
        android:layout_alignParentStart="true" 
        android:layout_toLeftOf="@+id/badge_text" 
        android:text="John" 
        android:textSize="@dimen/text_size_medium" /> 

       <bi.it.com.bio.textview.CustomTextView 
        android:id="@+id/badge_text" 
        android:layout_width="16dp" 
        android:layout_height="16dp" 
        android:layout_alignParentRight="true" 
        android:background="@drawable/badgeicon" 
        android:gravity="center" 
        android:text="24" 
        android:textColor="@android:color/white" 
        android:textSize="@dimen/text_size_xxsmall" /> 
      </RelativeLayout> 

      <bi.it.com.bio.textview.CustomTextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="this is message from john" 
       android:textSize="@dimen/text_size_xsmall" /> 

     </LinearLayout> 

    </LinearLayout> 

    <ImageView 
     android:id="@+id/delete_image" 
     android:paddingLeft="@dimen/padding_large" 
     android:paddingStart="@dimen/padding_large" 
     android:paddingEnd="@dimen/padding_large" 
     android:paddingRight="@dimen/padding_large" 
     android:paddingTop="@dimen/padding_small" 
     android:paddingBottom="@dimen/padding_small" 
     android:layout_width="wrap_content" 
     android:layout_height="match_parent" 
     android:background="@color/red_color_list" 
     android:src="@drawable/ic_delete_frd" 
     android:layout_gravity="end|right" 
     android:visibility="gone"/> 

</FrameLayout> 

Non voglio usare qualsiasi libreria. Qualsiasi aiuto è molto apprezzato. Grazie in anticipo.

risposta

2

È possibile farlo con un ViewPager e un PagerAdapter. Il tuo PagerAdapter avrà due pagine: la tua vista "main" a tutta larghezza e una seconda vista con i tuoi pulsanti operativi.

La chiave è di ignorare getPageWidth() nell'adattatore e restituire 1.0 per la vista principale e alcune frazione per la seconda vista. La frazione viene calcolata dividendo la larghezza desiderata della vista per la larghezza dello ViewPager.

Quando l'utente scorre, la seconda vista non può occupare l'intero schermo, quindi la prima vista è ancora parzialmente visualizzata, come nella tua immagine animata.

Con la ViewHolder riferimento al ViewPager e la ViewPager riferimento al PagerAdapter, si può anche riciclare gli adattatori a destra lungo con i ViewPager s.

+0

Con un rep di 2K, sembri perfettamente in grado di codificarlo dalla descrizione, ma nel caso tu * fai * tu ho bisogno di aiuto con il codice, fammi sapere. –

+0

grazie ci proverò di sicuro, ma non c'è un modo più semplice di quello? Inoltre hai implementato il metodo che hai menzionato. – Aakash

+0

Hai detto che non eri interessato ad usare una libreria esterna, ma probabilmente è l'unica cosa che sarebbe più semplice. Non considero più semplice scrivere il proprio codice con 'onTouchEvent()' e 'fling()'. Se ci fosse un modo più semplice di non-libreria per farlo, qualcun altro avrebbe già fornito una risposta. Ho testato l'aspetto di paging parziale della soluzione con un codice demo 'ViewPager' che avevo, quindi so che il comportamento funziona. –

Problemi correlati