RecyclerView在其下方的视图中滑动

时间:2015-08-26 13:05:41

标签: android android-recyclerview

我一直在做一些研究,我还没有找到一个示例或实现,允许您在刷卡时将视图(下面的示例图像)放在RecyclerView下面。有没有人有任何关于如何使用库实现没有的示例或想法。

以下是我如何实施轻扫以解雇。

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

    @Override
    public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
        return false;
    }

    @Override
    public int getSwipeDirs(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
        return super.getSwipeDirs(recyclerView, viewHolder);
    }

    @Override
    public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction) {
        if (viewHolder instanceof ViewDividers) {
            Log.e("DIRECTION", direction + "");
        }
    }
};
new ItemTouchHelper(simpleItemTouchCallback).attachToRecyclerView(recycler);

以下是Google收件箱的示例: enter image description here

6 个答案:

答案 0 :(得分:24)

我对如何做到这一点的理解是,人们会在xml中放置两个视图,这些视图将在您的recyclerview中每行显示。

例如,这将是我的适配器:

public class MyAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
    public static class ExampleViewHolder extends RecyclerView.ViewHolder {
        public TextView background;
        public TextView foreground;

        public ExampleViewHolder(View v) {
            super(v);
            background = (TextView) v.findViewById(R.id.background);
            foreground = (TextView) v.findViewById(R.id.foreground);
        }

        @Override
        public void onBindViewHolder(final RecyclerView.ViewHolder holder, final int position) {
            if (holder instanceof ExampleViewHolder) {
                ((ExampleViewHolder) holder).background.setBackgroundColor(); // do your manipulation of background and foreground here.
            }
        }

        @Override
        public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent,
                                                          int viewType) {

            View v = LayoutInflater.from(parent.getContext())
                    .inflate(R.layout.example, parent, false);
            return new ExampleViewHolder(v);
        }


    }
}

recyclerview中的每一行都是从R.layout.example中提取xml布局。因此,要在下面创建视图,您可以使用relativelayout或framelayout在彼此之上创建视图:

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

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/background"
        />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/foreground"/>
</RelativeLayout>

然后,如果您不想使用库进行滑动,可以从google复制此类,然后由Bruno Romeu Nunes修改:

https://github.com/heruoxin/Clip-Stack/blob/master/app/src/main/java/com/catchingnow/tinyclipboardmanager/SwipeableRecyclerViewTouchListener.java

该课程将要求您创建一个滑动侦听器:

swipeTouchListener =
        new SwipeableRecyclerViewTouchListener(mRecyclerView,
                new SwipeableRecyclerViewTouchListener.SwipeListener() {
                    @Override
                    public boolean canSwipe(int position) {
                        if (position == totalPost.size() - 1 && !connected) {
                            return false;
                        }
                        return true;
                    }

                    @Override
                    public void onDismissedBySwipeLeft(RecyclerView recyclerView, int[] reverseSortedPositions) {
                        for (int position : reverseSortedPositions) {
                            //change some data if you swipe left
                        }
                        myAdapter.notifyDataSetChanged();
                    }

                    @Override
                    public void onDismissedBySwipeRight(RecyclerView recyclerView, int[] reverseSortedPositions) {
                        for (int position : reverseSortedPositions) {
                            //change some data if you swipe right
                        }
                        myAdapter.notifyDataSetChanged();
                    }
                });

然后只需将其与您的Recyclerview链接:

    mRecyclerView.addOnItemTouchListener(swipeTouchListener);

答案 1 :(得分:11)

我正在研究同样的问题 我最终做的是,在包含recyclerView的布局中,我添加了一个名为&#39; swipe_bg&#39;的简单FrameLayout。与我的RecyclerView.ViewHolder项之一相同的高度。我将其可见性设置为&#34;已消失&#34;,并将其置于RecyclerView

之下

然后在我设置ItemTouchHelper的活动中,我像这样重写onChildDraw ..

ItemTouchHelper.SimpleCallback swipeCallback = new ItemTouchHelper.SimpleCallback(0, ItemTouchHelper.LEFT|ItemTouchHelper.RIGHT) {

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

不知道这是否是最好的方式,但似乎是最简单的方法。

答案 2 :(得分:5)

我喜欢@erik方法,但我建议通过Canvas将你想要的东西绘制到onChildDraw()函数中。例如项目背景或图标。

@Override 
public void onChildDraw(Canvas c, RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState, boolean isCurrentlyActive) {
    final ColorDrawable background = new ColorDrawable(Color.RED);
    background.setBounds(0, itemView.getTop(),   itemView.getLeft() + dX, itemView.getBottom());
    background.draw(c);

    super.onChildDraw(c, recyclerView, viewHolder, dX, dY, actionState, isCurrentlyActive);
}

在这种方法中,您将根据需要绘制所需内容,而无需夸大未使用的视图

答案 3 :(得分:1)

简单的解决方案,无需在画布上分配或绘图。 SomeAdapter.SomeVH应包含上部视图和视图下方。使用这种方法,我们将只能刷上方视图(容器),在视图下公开(带标签,图标,无论你想要什么)

class SomeTouchHelper extends ItemTouchHelper.Callback {
...
    @Override
    public void onChildDraw(Canvas c, RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder,
            float dX, float dY, int actionState, boolean isCurrentlyActive) {
        if (actionState == ItemTouchHelper.ACTION_STATE_SWIPE) {
            if (viewHolder instanceof SomeAdapter.SomeVH) {
                SomeAdapter.SomeVH someViewHolder
                        = (SomeAdapter.SomeVH) viewHolder;
                ViewCompat.setTranslationX(someViewHolder.mContainer, dX);
            }
        } else {
            super.onChildDraw(c, recyclerView, viewHolder, dX, dY, actionState, isCurrentlyActive);
        }
    }
...
}
不要忘记在适配器onViewRecycled()恢复SomeVH的初始视图状态

答案 4 :(得分:0)

您可以使用RvTools Library。它将帮助您轻松实现您想要的功能。

只需创建具有所需外观的SwipeContextMenuDrawer

public class YourSwipeContextMenuDrawer extends SwipeContextMenuDrawer {

private final Paint mRightPaint;
private final Paint mIconPaint;
private final Bitmap mRightIconBitmap;

public YourSwipeContextMenuDrawer(@NonNull Context context) {
    mRightPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    mRightPaint.setColor(ContextCompat.getColor(context, R.color.deep_orange_400));
    mRightIconBitmap = GraphicUtils.getBitmap(context, R.drawable.ic_delete, 100, 100);
    mIconPaint = new Paint();
    mIconPaint.setColorFilter(new PorterDuffColorFilter(ContextCompat.getColor(context, R.color.backgroundColor), PorterDuff.Mode.SRC_IN));
}

@Override
public void drawRight(@NonNull Canvas canvas, @NonNull View view) {
    canvas.drawRect(view.getLeft(), view.getTop(), view.getRight(), view.getBottom(), mRightPaint);
    canvas.drawBitmap(mRightIconBitmap, view.getLeft() + mRightIconBitmap.getWidth() - 20, (view.getBottom() + view.getTop() - mRightIconBitmap.getHeight()) >> 1, mIconPaint);
}

@Override
public void drawLeft(@NonNull Canvas canvas, @NonNull View view) {
}
}

使用滑动操作和滑动上下文菜单抽屉创建RvTools实例,如下所示

 new RvTools.Builder(recyclerView)
            .withSwipeRightAction(this)
            .withSwipeContextMenuDrawer(new YourSwipeContextMenuDrawer(getContext()))
            .buildAndApplyToRecyclerView();

答案 5 :(得分:0)

更改elevation对我来说可以使一项高于另一项。