Flutter：如何实现选中条目自动选上方所有、取消条目连带取消其及上方条目

核心思路 #

基于数据源驱动视图的原则，给每个列表项绑定选中状态字段，通过点击事件批量更新对应条目的状态，再刷新列表视图，完全匹配你提出的需求：选中某条时自动选中其上方所有条目，取消某条时自动取消其及上方所有条目。

步骤实现 #

1. 定义列表项实体类

给每个条目添加isSelected字段，用于记录选中状态：

public class ListItem {
    private String content;
    private boolean isSelected;

    public ListItem(String content) {
        this.content = content;
        this.isSelected = false;
    }

    // Getter & Setter
    public String getContent() { return content; }
    public boolean isSelected() { return isSelected; }
    public void setSelected(boolean selected) { isSelected = selected; }
}

2. 编写列表适配器

在getView方法中根据isSelected字段渲染条目选中/未选中样式：

public class MyListAdapter extends BaseAdapter {
    private final ArrayList<ListItem> mItemList;
    private final LayoutInflater mInflater;

    public MyListAdapter(Context context, ArrayList<ListItem> itemList) {
        mItemList = itemList;
        mInflater = LayoutInflater.from(context);
    }

    @Override
    public int getCount() { return mItemList.size(); }
    @Override
    public Object getItem(int position) { return mItemList.get(position); }
    @Override
    public long getItemId(int position) { return position; }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder;
        if (convertView == null) {
            convertView = mInflater.inflate(R.layout.list_item_layout, parent, false);
            holder = new ViewHolder();
            holder.contentTv = convertView.findViewById(R.id.tv_content);
            holder.checkBox = convertView.findViewById(R.id.cb_select);
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }

        ListItem item = mItemList.get(position);
        holder.contentTv.setText(item.getContent());
        holder.checkBox.setChecked(item.isSelected());

        // 设置选中样式（示例为灰色背景）
        convertView.setBackgroundColor(item.isSelected() ? 
            Color.parseColor("#E5E5E5") : Color.WHITE);

        return convertView;
    }

    private static class ViewHolder {
        TextView contentTv;
        CheckBox checkBox;
    }
}

3. 处理ListView点击事件

实现核心的选中/取消逻辑：

// 初始化数据源
ArrayList<ListItem> itemList = new ArrayList<>();
for (int i = 0; i < 10; i++) {
    itemList.add(new ListItem("条目 " + (i + 1)));
}

// 绑定适配器
MyListAdapter adapter = new MyListAdapter(this, itemList);
ListView listView = findViewById(R.id.list_view);
listView.setAdapter(adapter);

// 处理点击事件
listView.setOnItemClickListener((parent, view, position, id) -> {
    ListItem clickedItem = itemList.get(position);
    boolean newState = !clickedItem.isSelected();
    
    // 批量更新0到当前position的所有条目状态
    for (int i = 0; i <= position; i++) {
        itemList.get(i).setSelected(newState);
    }
    
    // 刷新视图
    adapter.notifyDataSetChanged();
});

4. 性能优化（可选）

如果列表条目较多，可通过记录当前最大选中位置，减少遍历次数：

int currentMaxSelected = -1;
// 初始化时获取已选中的最大位置
for (int i = 0; i < itemList.size(); i++) {
    if (itemList.get(i).isSelected()) {
        currentMaxSelected = i;
    }
}

listView.setOnItemClickListener((parent, view, position, id) -> {
    ListItem clickedItem = itemList.get(position);
    if (!clickedItem.isSelected()) {
        // 只更新从当前最大选中位置到目标位置的条目
        for (int i = currentMaxSelected + 1; i <= position; i++) {
            itemList.get(i).setSelected(true);
        }
        currentMaxSelected = position;
    } else {
        // 取消0到当前位置的所有条目
        for (int i = 0; i <= position; i++) {
            itemList.get(i).setSelected(false);
        }
        // 更新最大选中位置（查找剩余选中条目的最大索引）
        currentMaxSelected = -1;
        for (int i = position + 1; i < itemList.size(); i++) {
            if (itemList.get(i).isSelected()) {
                currentMaxSelected = i;
            }
        }
    }
    adapter.notifyDataSetChanged();
});

关键说明 #

• 所有选中状态都绑定到数据源，避免视图状态和数据状态不一致的问题
• 若你的自定义ListView已实现选中逻辑，需确保其setItemChecked方法同步更新数据源的isSelected字段
• 可根据需求调整选中样式（比如替换背景色、添加勾选图标等）

内容的提问来源于stack exchange，提问作者Rosh Suresh