拖拽排序-列表布局

/*
 * @Author: 大柒
 * @QQ: 531310591@qq.com
 * @Date: 2021-04-15 18:27:53
 * @Version: Auto.Js Pro
 * @Description: 参考文章:https://www.jb51.net/article/141459.htm
 * @LastEditors: 大柒
 * @LastEditTime: 2021-04-15 19:40:53
 */
'ui';
//导入依赖包;
importClass("androidx.recyclerview.widget.RecyclerView");
importClass("androidx.recyclerview.widget.ItemTouchHelper");
importClass("androidx.recyclerview.widget.GridLayoutManager");
ui.layout(
    <vertical bg='#F4F4F4'>
        <appbar>
            <toolbar id='toolbar' title='拖拽排序-列表布局' />
        </appbar>
        <list id='list' w='*' h='*'>
            <relative w='*' bg='#FFFFFF' padding='10' margin='10 5'>
                <horizontal w='*' layout_toLiftOf='delete'>
                    <img w='28' h='28' layout_gravity='center'
                        src='http://www.autojs.org/assets/uploads/profile/3-profileavatar.png' />
                    <text text='{{this}}' w='auto' h='auto' layout_gravity='center_vertical' paddingLeft='10' />
                </horizontal>
                <img id='delete' w='20' h='20' margin='4' background='@drawable/ic_close_white_24dp' backgroundTint='#FF0000'
                    layout_alignParentRight='true' layout_verticalCenter='true' clickable='true' />
            </relative>
        </list>
    </vertical>
);
/**
 * 显示 toolbar 返回按钮
 */
activity.setSupportActionBar(ui.toolbar);
//要在 setSupportActionBar 之后开启
activity.getSupportActionBar().setDisplayHomeAsUpEnabled(true);
//监听返回键点击
ui.toolbar.setNavigationOnClickListener({
    onClick: function () {
        ui.finish();//关闭界面
    }
});
importClass(android.view.MenuItem);
//在toolbar添加按钮
ui.emitter.on('create_options_menu', menu => {
    let item = menu.add(0, 17, 0, '添加数据');
    item.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM | MenuItem.SHOW_AS_ACTION_WITH_TEXT);
});
//监听菜单选项点击
ui.emitter.on('options_item_selected', (e, item) => {
    if (item.getTitle() == '添加数据') {
        dialogs.rawInput("请输入", "", function (str) {
            if (str == '') {
                dialogs.alert('没有输入信息');
                return;
            }
            items.push(str);
            //通知最后一项数据更新
            ui.list.adapter.notifyItemChanged(items.length);
        });
    }
    e.consumed = true;
});
var items = [];
for (let i = 1; i <= 10; i++) {
    items.push('条目' + i);
}
ui.list.setDataSource(items);
ui.list.on('item_bind', (itemView, itemHolder) => {
    //删除数据 
    itemView.delete.on('click', () => {
        items.splice(itemHolder.position, 1);
    });
});
/**
 * RecyclerView手势器：
 * 参考文章: https://www.jb51.net/article/141459.htm
 */
let helper = new ItemTouchHelper(new ItemTouchHelper.Callback({
    getMovementFlags: function (recyclerView, viewHolder) {
        //指定支持的拖放方向为上下
        let dragFrlg = ItemTouchHelper.UP | ItemTouchHelper.DOWN;
        return this.makeMovementFlags(dragFrlg, 0);
    },
    onMove: function (recyclerView, viewHolder, target) {
        //得到当拖拽的viewHolder的Position 
        let fromPosition = viewHolder.getAdapterPosition();
        let toPosition = target.getAdapterPosition();
        if (fromPosition < toPosition) {
            for (let i = fromPosition; i < toPosition; i++) {
                //数组指定元素交换位置
                swapArray(ary, i, i + 1);
            }
        } else {
            for (let i = fromPosition; i > toPosition; i--) {
                swapArray(ary, i, i - 1);
            }
        }
        //通知适配器移动Item的位置
        recyclerView.adapter.notifyItemMoved(fromPosition, toPosition);
        return true;
    },
    isLongPressDragEnabled: function () {
        return true;
    },
    /** 
     * 长按选中Item的时候开始调用 
     * 长按高亮 
     * @param viewHolder 
     * @param actionState 
     */
    onSelectedChanged: function (viewHolder, actionState) {
        this.super$onSelectedChanged(viewHolder, actionState);
        if (actionState != ItemTouchHelper.ACTION_STATE_IDLE) {
            //改变选中Item的背景色
            viewHolder.itemView.attr("backgroundTint", "#7AFFFFFF");
            //震动7毫秒 
            device.vibrate(7);
            ary = new Array();
            for (let i in items) ary.push(items[i]);
        }
    },
    /** 
     * 手指松开的时候还原高亮 
     * @param recyclerView 
     * @param viewHolder 
     */
    clearView: function (recyclerView, viewHolder) {
        this.super$clearView(recyclerView, viewHolder);
        viewHolder.itemView.attr("backgroundTint", "#FFFFFF");
        items = ary;
        recyclerView.setDataSource(items);
        recyclerView.adapter.notifyDataSetChanged(); //完成拖动后刷新适配器，这样拖动后删除就不会错乱 
    }
}));
//设置手势器附着到对应的RecyclerView对象。
helper.attachToRecyclerView(ui.list);
/**
* 数组元素交换位置
* @param {array} arr 数组
* @param {number} index1 添加项目的位置
* @param {number} index2 删除项目的位置
* index1和index2分别是两个数组的索引值，即是两个要交换元素位置的索引值，如1，5就是数组中下标为1和5的两个元素交换位置
*/
function swapArray(arr, index1, index2) {
    arr[index1] = arr.splice(index2, 1, arr[index1])[0];
    return arr;
}