iT邦幫忙

2021 iThome 鐵人賽

DAY 17
0
Mobile Development

android studio 30天初學筆記系列 第 17

Android Studio初學筆記-Day17-ItemTouchHelper

  • 分享至 

  • xImage
  •  

ItemTouchHelper

接續昨天的RecyclerView,今天來讓RecyclerView的功能變得更完善,今天要講的是ItemTouchHelper。ItemTouchHelper可以讓使用者和在RecyclerView的資料互動,今天要來做的是移動資料和實現左滑刪除的功能,話不多說,首先最基本的RecyclerView和昨天相同,包括引用套件和設定Adapter,這裡我就不多做講解,有需要的可以參考前一篇。直接在昨天的MainActivity中加入以下函數。

程式碼

private void recyclerViewAction(RecyclerView recyclerView, 
                                final ArrayList<String> choose,final MyAdapter adapter){
    ItemTouchHelper helper = new ItemTouchHelper(new ItemTouchHelper.Callback() {
        @Override
        public int getMovementFlags(@NonNull RecyclerView recyclerView, @NonNull 
                                             RecyclerView.ViewHolder viewHolder) {
            //加入需要移動的方向,有分dragFlags和swipeFlags
         return makeMovementFlags(ItemTouchHelper.UP | ItemTouchHelper.DOWN , 
                                  ItemTouchHelper.LEFT | ItemTouchHelper.RIGHT);
        }
           
        @Override
        //對資料移動作設定
        public boolean onMove(@NonNull RecyclerView recyclerView, @NonNull 
            RecyclerView.ViewHolder viewHolder, @NonNull RecyclerView.ViewHolder target) {
            int position_dragged = viewHolder.getAdapterPosition();       //選取的位置
            int position_target = target.getAdapterPosition();            //放置的位置
            //交換陣列中兩資料位置,choose為陣列
            Collections.swap(choose,position_dragged,position_target);  
            //告知配適器資料有更換
            adapter.notifyItemMoved(position_dragged,position_target);  
            return false;
        }

        @Override
        //對滑動做功能設定
        public void onSwiped(@NonNull RecyclerView.ViewHolder viewHolder, int direction) {
            int position = viewHolder.getAdapterPosition();
            switch(direction){
                case ItemTouchHelper.LEFT:                  //資料左滑
                case ItemTouchHelper.RIGHT:
                     choose.remove(position);               //移除資料
                     adapter.notifyItemRemoved(position);   //告知配適器資料有更換
                     if(position!=choose.size()){
                     //開始改變的位置和總共被影響的位置數量,相當重要否則資料的position不會更改
                     //刮號內是(改變的位置,受影響的數量)
                         adapter.notifyItemRangeChanged(position,choose.size()-position);  
                     }
                     break;
            }
        }
            @Override
            //如果希望加上圖片則需要以下
            public void onChildDraw(@NonNull Canvas c, @NonNull RecyclerView recyclerView, 
               @NonNull RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState, 
               boolean isCurrentlyActive) {
                  new RecyclerViewSwipeDecorator.Builder(c,recyclerView,viewHolder,dX,dY 
                                                          ,actionState,isCurrentlyActive)
                        //設定圖的背景顏色,也可使用getResourses.getColor(id)
                        .addBackgroundColor(ContextCompat.getColor(MainActivity.this,
                                            android.R.color.holo_red_dark))    
                        //設定圖片
                        .addActionIcon(R.drawable.ic_baseline_delete_24)
                        .create()
                        .decorate();
                //拖曳狀態下不做改變需要呼叫父類別的方法
                super.onChildDraw(c, recyclerView, viewHolder, dX, dY, actionState, 
                                  isCurrentlyActive);
            }
        });
        helper.attachToRecyclerView(recyclerView);                //綁上recyclerView
    }
}
  • 其中包括各種手勢,包括左滑、上移,可以依自己所需增加變更,以及設定各手勢的功能有區分為Move和Swipe,其中這兩個在更新資料時都需要告知adapter資料有移除或著移動,其中有比較重要的程式麻煩注意一下,不然在之後可是會有嚴重的bug的。

成果

https://ithelp.ithome.com.tw/upload/images/20210908/20139136GI0bXYhepS.png
今天ItemTouchHelper就講到這邊,謝謝大家~/images/emoticon/emoticon41.gif


上一篇
Android Studio初學筆記-Day16-RecyclerView
下一篇
Android Studio初學筆記-Day18-Intent+Bundle
系列文
android studio 30天初學筆記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言