如何为带有图像的列表视图设置选择模式单一 [英] how to set choice mode single for listview with images

问题描述

我有一个带有图像的列表视图.当我选择每个项目时，图像会更改为单击的图像.但是当我选择另一个项目时，两个图像都会更改.我只希望所选项目更改图像.它必须像单选按钮一样起作用单选模式.请帮助.

I have a listview with image.When i select each item the image changes to clicked image.But when i select another item both images changes.I want only the selected item to change the image.it has to function like radio button with single choice mode.pls help.

public class ProvierActivity extends Activity {
    private String text[] = { "BroadStripe-Cable (Seattle)", "BroadStripe-Digital (Seattle)",
        "BroadStripe-Cable (Seattle)", "Comcast king county south)", "BroadStripe-Cable (Seattle)",
        "Comcast king county south", "BroadStripe-Digital (Seattle)", "BroadStripe-Digital (Seattle)",
        "BroadStripe-Cable (Seattle)", "Comcast king county south" };

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        final ListView list = (ListView) findViewById(R.id.listview_id);

        list.setAdapter(new ArrayAdapter<String>(this, R.layout.list,
            R.id.title, text));

        list.setOnItemClickListener(new OnItemClickListener() {

        @Override
            public void onItemClick(AdapterView<?> arg0, View view,
                int position, long arg3) {
                // TODO Auto-generated method stub

                if (view.findViewById(R.id.img).getVisibility() == ImageView.VISIBLE) {
                    ImageView icon = (ImageView) view.findViewById(R.id.img);

                    icon.setImageResource(R.drawable.checked);
                }
            }
        });
    }
}

推荐答案

这里推荐的解决方案是依靠内置的 ListView 的选择支持为其指定单选模式:

The recommended solution here is to rely on built-in ListView's selection support specifying single-choice mode for it:

list.setChoiceMode(ListView.CHOICE_MODE_SINGLE);

然后你应该让你的列表项实现Checkable界面;这需要对布局的根视图进行一些自定义.假设它以 LinearLayout 作为根，实现可能如下所示:

Then you should let your list item to implement to implement Checkable interface; that requires some customization of the root view of your layout. Assuming that it has LinearLayout as a root, an implementation may look like:

public class MyListItem extends LinearLayout implements Checkable {

    public MyListItem(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public MyListItem(Context context) {
        super(context);
    }

    private boolean checked = false;

    private ImageView icon;

    @Override
    protected void onFinishInflate() {
        super.onFinishInflate();
        icon = (ImageView)findViewById(R.id.img); // optimisation - you don't need to search for image view every time you want to reference it
    }
    @Override
    public boolean isChecked() {
        return checked;
    }

    @Override
    public void setChecked(boolean checked) {
        this.checked = checked;
        if (icon.getVisibility() == View.VISIBLE) {
            icon.setImageResource((checked) ? R.drawable.checked : R.drawable.unchecked);
        }
    }

    @Override
    public void toggle() {
        setChecked(!checked);
    }
}

当然，您的布局文件也应该更新为引用 MyListItem 类而不是 LinearLayout.

Your layout file should be updated to reference MyListItem class instead of LinearLayout too, of course.

这可能是一个有点困难的方法，但它的好处是在重新创建活动时自动恢复选中的项目.

This may be a somewhat difficult approach, but it has benefits like restoring checked item automatically when activity is recreated.

另一种选择是再次使用列表的选择模式并覆盖适配器的 getView 以了解该项目是否被选中并相应地更新图像:

Another option is to use the list's choice mode again and override adapter's getView to know if the item is checked and update image accordingly:

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    final ListView list = getListView();
    list.setChoiceMode(ListView.CHOICE_MODE_SINGLE);
    list.setAdapter(new ArrayAdapter<String>(this, R.layout.list_item,
            R.id.title, text) {
        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            View v = super.getView(position, convertView, parent);
            ImageView icon = (ImageView) v.findViewById(R.id.img);
            if (list.isItemChecked(position)) {
                icon.setImageResource(R.drawable.checked);
            } else {
                icon.setImageResource(R.drawable.unchecked);
            }
            return v;
        }
    });
}

但是这个版本有一些性能问题 - findViewById 和 setImageResource 是相对耗时的操作，所以你应该考虑使用一些缓存.我建议观看 ListView 世界"视频 了解有关此小部件的一些非常有用的提示.

However this version has some performance issues - findViewById and setImageResource are relatively time-consuming operations so you should consider using some caching. I recommend to watch "The world of ListView" video to learn some very useful tips about this widget.

后一种方法还将适配器绑定到列表视图，从而引入了不必要的耦合.

The latter approach also ties adapter to the listview which introduces unnecessary coupling.

这篇关于如何为带有图像的列表视图设置选择模式单一的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！