2015-10-21 137 views
6

我有一個回收器視圖,其中我想在隱藏在當前佈局背後的swiping項目視圖中顯示另一個佈局。總之我想實現像下面的圖像。在回收視圖中滑動以顯示另一個隱藏的佈局android

enter image description here

我的代碼的問題是,整個視圖刷卡,但我想刷卡只隱藏佈局的寬度。

在活動

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); 

自定義佈局代碼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> 

我不想使用任何庫。任何幫助真的很感激。 在此先感謝。

回答

2

您可以使用ViewPagerPagerAdapter執行此操作。你的PagerAdapter將有兩個頁面:你的「主」全角視圖和第二個視圖,它有你的操作按鈕。

關鍵是在您的適配器中覆蓋getPageWidth(),並返回1.0爲您的主視圖和一些分數爲您的第二個視圖。通過將視圖的期望寬度除以ViewPager的寬度來計算分數。

當用戶滑動時,第二個視圖無法佔據整個屏幕,所以第一個視圖仍然部分顯示,如在動畫圖像中。

隨着ViewHolder引用ViewPagerViewPager引用PagerAdapter,你甚至可以回收適配器權隨着ViewPager秒。

+0

與2K代表,你似乎完全有能力從描述編碼,但如果你*做*你需要幫助代碼,讓我知道。 –

+0

謝謝我一定會嘗試,但是沒有比這更簡單的方法嗎?還有你用你提到的方法實現。 – Aakash

+0

你提到你對使用外部庫不感興趣,但這可能是唯一更容易的事情。我不認爲用'onTouchEvent()'和'fling()'更容易編寫自己的代碼。如果有一種更容易的非圖書館方式來做到這一點,其他人就已經提供了答案。我用一些'ViewPager'演示代碼測試瞭解決方案的部分分頁方面,所以我知道這種行爲是有效的。 –

相關問題