如何在android中突出显示所选列表项?

时间:2013-02-01 11:26:36

标签: android android-listview android-fragments android-ui

在我的Android应用程序中,我有每个列表项的列表视图和详细信息视图。对于平板电脑,我已经显示了项目列表视图和所选项目的详细视图,如下所示。

enter image description here

所以我的问题是如何在用户点击列表项后突出显示所选项目。

我正在使用BaseAdapter加载列表视图。我怎么能这样做?

修改

是的,正如chintan khetiya所提到的,我使用了以下xml文件作为列表项的背景,但它不会对所选项目感到满意。我错过了什么?

    <?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item 
 android:state_selected="false"
    android:state_pressed="false" 
    android:drawable="@color/abs__background_holo_light" />
<item android:state_pressed="true" 
    android:drawable="@color/action_bar_blue" />
<item android:state_selected="true"
 android:state_pressed="false" 
    android:drawable="@color/action_bar_blue" />
</selector>

3 个答案:

答案 0 :(得分:2)

您的查询:

  

我的问题是如何在用户点击列表项后突出显示所选项目。

我想你在询问选择器。意味着如果列表行处于焦点状态,那么它应该与所有其他行看起来不同。按或触摸行时也是如此。

为此你必须在Drawable文件夹中创建Selector.xml文件并将该选择器文件放在列表行中

该文件应具有不同的标记,如Focus-Click-Press,并根据状态更改Drawable。

更新:

只需替换您的图标并保存在Drawable文件夹中。

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- Pressed -->
    <item android:drawable="@drawable/p_paly_press" android:state_pressed="true"/>

    <!-- selected -->
    <item android:drawable="@drawable/p_play" android:state_selected="true"/>

    <!-- focused -->
    <item android:drawable="@drawable/p_paly_press" android:state_focused="true"/>

    <!-- default -->
    <item android:drawable="@drawable/p_play"/>

</selector>

答案 1 :(得分:2)

以下代码中的代码可用于突出显示所选项目,以确定是否有其他方法无法满足您的需求:

class Adapter extends ArrayAdapter<String> {

    private int selectedPos = -1;
    Drawable selectedBackground;

    public MainSelectAdapter(Context context, int textViewResourceId,
            List<String> objects) {
        super(context, textViewResourceId, objects);
        selectedBackground =
              context.getResources().getDrawable(R.color.selecteditembackground);
    }
    public void setSelectedPosition(int pos){
        selectedPos = pos;
        notifyDataSetChanged();
    }
    public View getView(int position, View convertView, ViewGroup parent) {
        View v = super.getView(position, convertView, parent);
        if (selectedPos == position) {
            v.setBackgroundDrawable(selectedBackground);
        } else {
            v.setBackgroundDrawable(null);
        }
        return v;
    }
}

主要活动

  Adapter adapter = new Adapter(this, android.R.layout.simple_list_item_1,
    myItemsToShow);

  list = (ListView) findViewById(R.id.flows);
  list.setItemsCanFocus(true);
  list.setChoiceMode(ListView.CHOICE_MODE_SINGLE);
  list.setOnItemClickListener(new AdapterView.OnItemClickListener() {
    public void onItemClick(AdapterView<?> adapter, View view,
                int pos, long id) {
                adapter.setSelectedPosition(pos);
    }
  });

使用这种方法,您可以对所选项目突出显示进行控制,您可以使用侦听器捕获选择事件,并为自己设置所需的Drawable。

答案 2 :(得分:1)

您可以在styles.xml中定义

    <style name="Theme.Base" parent="...">
        <item name="activatableItemBackground">@drawable/activatable_item_background</item>
    </style>

   <style name="ListItemContainerBase">
        <item name="android:background">?activatableItemBackground</item>
    </style>

在res / drawable中定义activatable_item_background.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/item_pressed" android:state_pressed="true" />
    <item android:drawable="@drawable/item_focused" android:state_focused="true" />
    <item android:drawable="@drawable/item_focused" android:state_selected="true" />
    <item android:drawable="@drawable/item_activated" android:state_activated="true" />
    <item android:drawable="@drawable/item_checked" android:state_checked="true" />
    <item android:drawable="@android:color/transparent" />
</selector>

item_pressed,item_focused .....是res / drawable-xxx中的图像

为视图中的每个项目定义如下布局:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    style="@style/ListItemContainerBase">