2015-10-21 68 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'演示代码测试了解决方案的部分分页方面,所以我知道这种行为是有效的。 –

相关问题