Make Lists Magical with RecyclerView's ItemTouchHelper

Make Lists Magical with RecyclerView's ItemTouchHelper

https://youtu.be/6Dw3KbQznhY
ItemTouchHelper was added to RecyclerView back in 22.2 and adds a lot of power to responding to touch events in RecyclerViews.

627ce26ea490d993a49d6b263768ca67?s=128

Eric Cochran

March 17, 2016
Tweet

Transcript

  1. ERIC COCHRAN MAKE LISTS MAGICAL WITH RECYCLERVIEW'S ITEMTOUCHHELPER @ERIC_COCHRAN DROIDCON

    SF MARCH 17, 2016
  2. None
  3. LISTVIEW ANIMATION FUN ViewTreeObserver, setTransientState, …

  4. RECYCLERVIEW: THE SAVIOR

  5. OnItemTouchListener public boolean onInterceptTouchEvent(RecyclerView rv, MotionEvent e); public void onDrawOver(Canvas

    c, RecyclerView parent, RecyclerView.State state) ItemDecoration public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state)
  6. ItemTouchHelper • SUPPLY CALLBACK • ATTACH TO RECYCLERVIEW

  7. ItemTouchHelper.Callback public int getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) public boolean onMove(RecyclerView

    recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction)
  8. ItemTouchHelper.Callback public int getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) int makeMovementFlags(int dragFlags,

    int swipeFlags) • COMPOSES DRAG AND SWIPE FLAGS. • AS SIMPLE AS: @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);
 }
  9. ItemTouchHelper.Callback • DRAG AND DROP! • REMEMBER TO UPDATE DATA

    AND NOTIFY ADAPTER. • AS SIMPLE AS: @Override public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
 // update data here!
 adapter.notifyItemMoved(viewHolder.getAdapterPosition(),
 target.getAdapterPosition()); // notify adapter.
 return true;
 } public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target)
  10. ItemTouchHelper.Callback SUPPORTING DRAGGING @Override public boolean isLongPressDragEnabled() {
 return true;


    } OR itemTouchHelper.startDrag(myDraggingViewHolder); public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target)
  11. ItemTouchHelper.Callback SUPPORTING DRAGGING AND DROPPING: QUICK TIP @Override
 public boolean

    canDropOver(RecyclerView recyclerView, RecyclerView.ViewHolder current,
 RecyclerView.ViewHolder target) {
 return true; // maybe a header View or other circumstance to be false.
 } public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target)
  12. ItemTouchHelper.Callback • SWIPE! • REMEMBER TO UPDATE DATA AND NOTIFY

    ADAPTER. • DIRECTION IS VERY USEFUL. • AS SIMPLE AS: @Override public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction) {
 // update data here!
 adapter.notifyItemRemoved(viewHolder.getAdapterPosition()); // notify adapter.
 } public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction)
  13. ItemTouchHelper.Callback SUPPORTING SWIPING @Override public boolean isItemViewSwipeEnabled() {
 return super.isItemViewSwipeEnabled();


    } OR itemTouchHelper.startSwipe(mySwipingViewHolder); public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction)
  14. Easiest common custom animations • THESE TWO METHODS ARE NIFTY.

    • ACTIONSTATE: IDLE, SWIPE, OR DRAG @Override public void onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState) {
 super.onSelectedChanged(viewHolder, actionState);
 // Fun with viewHolder's Views!
 // Example:
 viewHolder.itemView.animate()
 .scaleX(1.5f)
 .scaleY(1.5f)
 .setDuration(250L)
 .start();
 }
 
 @Override
 public void clearView(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
 super.clearView(recyclerView, viewHolder);
 // Example:
 viewHolder.itemView.animate()
 .scaleX(1f)
 .scaleY(1f)
 .setDuration(250L)
 .start();
 }
  15. Customize More public long getAnimationDuration(RecyclerView recyclerView, int animationType, float animateDx,

    float animateDy);
 
 public float getSwipeThreshold(RecyclerView.ViewHolder viewHolder)
 
 public float getMoveThreshold(RecyclerView.ViewHolder viewHolder);
 
 public float getSwipeEscapeVelocity(float defaultValue);
 
 public float getSwipeVelocityThreshold(float defaultValue);
 
 public int getBoundingBoxMargin();
  16. ITEMTOUCHHELPER IS AN ITEMDECORATION public void onChildDraw(Canvas c, RecyclerView recyclerView,


    RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState,
 boolean isCurrentlyActive);
 
 public void onChildDrawOver(Canvas c, RecyclerView recyclerView,
 RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState,
 boolean isCurrentlyActive); WITH SOME MORE HELP
  17. ITEMTOUCHHELPER IS AN ITEMDECORATION @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) {
 int width = viewHolder.itemView.getWidth();
 float alpha = 1.0f - Math.abs(dX) / width;
 viewHolder.itemView.setAlpha(alpha);
 }
 super.onChildDraw(c, recyclerView, viewHolder, dX, dY, actionState, isCurrentlyActive);
 } WITH SOME MORE HELP SIMPLE FADING EXAMPLE:
  18. FOR CUSTOM LAYOUTMANAGERS Implement ViewDropHandler, and ItemTouchHelper will give you

    prepareForDrop calls automatically from onMoved!
  19. MAKE MAGICAL EXPERIENCES TTThanks