Android ListView 分割线设置 Material Design 风格-JavaScript中文网-JavaScript教程资源分享门户

在 Android 开发中，ListView 是经常使用的控件之一，它可以展示大量的数据，并且支持快速滑动浏览。ListView 具备丰富的参数和方法，可以轻松地实现各种需求。本文将重点介绍如何为 ListView 设置 Material Design 风格的分割线。

Material Design 风格的分割线

Material Design 是 Google 推出的一种视觉设计风格，其特点是平面化、色彩鲜明、动画效果多样等。在 Material Design 风格中，分割线是一种常用的元素，用于区分不同的数据项。与传统的细线分割线不同，Material Design 风格的分割线通常比较粗，具有明显的高度和填充效果，可以让用户更加直观地感受到不同数据项之间的距离。

下图展示了 Material Design 风格的 ListView 分割线效果：

实现步骤

在 ListView 的 item 布局文件中添加一个高度为 1dp 的 View，用于显示分割线，代码如下：
```
<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#BDBDBD" />
```
注意：分割线的高度应该根据实际情况适当调整，一般不应该设置过高或过低。
在 ListView 的布局文件中，通过设置 android:divider 属性为 null 来隐藏系统默认的分割线，代码如下：
```
<ListView
    android:id="@+id/list_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:divider="@null" />
```
注意：如果不设置 android:divider 属性为 null，系统会默认使用一条细线作为分割线，无法达到 Material Design 风格的效果。

在 ListView 的 Activity 或 Fragment 中，通过设置 android:listSelector 属性来设置选中项的背景色和点击效果，代码如下：

listView.setSelector(R.drawable.list_item_selector);

其中，list_item_selector 是一个 XML 文件，用于设置选中项的背景色和点击效果，代码如下：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:color="#EEEEEE" />
    <item android:state_focused="true" android:color="#EEEEEE" />
    <item android:state_activated="true" android:color="#EEEEEE" />
    <item android:color="@android:color/transparent" />
</selector>

注意：选中项的背景色应该根据实际情况适当调整。

在 ListView 的 Activity 或 Fragment 中，通过设置 android:dividerHeight 属性来设置分割线的高度，代码如下：
```
listView.setDividerHeight(getResources().getDimensionPixelSize(R.dimen.list_divider_height));
```
其中，list_divider_height 是一个 dimen 文件，用于设置分割线的高度，代码如下：
```
<dimen name="list_divider_height">1dp</dimen>
```
注意：分割线的高度应该与 item 布局文件中的 View 高度相对应。

至此，Material Design 风格的 ListView 分割线设置完成。

示例代码

下面是完整的示例代码，供参考：

item_layout.xml

// javascriptcn.com 代码示例
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="48dp"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:gravity="center_vertical">

    <TextView
        android:id="@+id/text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#000000"
        android:textSize="18sp"
        android:text="item" />

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="#BDBDBD" />

</LinearLayout>

list_view.xml

<ListView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/list_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:divider="@null"
    android:listSelector="@drawable/list_item_selector"
    android:dividerHeight="@dimen/list_divider_height" />

list_item_selector.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:color="#EEEEEE" />
    <item android:state_focused="true" android:color="#EEEEEE" />
    <item android:state_activated="true" android:color="#EEEEEE" />
    <item android:color="@android:color/transparent" />
</selector>

MainActivity.java

// javascriptcn.com 代码示例
public class MainActivity extends Activity {

    private ListView listView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.list_view);

        listView = (ListView) findViewById(R.id.list_view);
        listView.setAdapter(new ArrayAdapter<String>(this, R.layout.item_layout, getData()));
        listView.setSelector(R.drawable.list_item_selector);
        listView.setDividerHeight(getResources().getDimensionPixelSize(R.dimen.list_divider_height));
    }

    private List<String> getData() {
        List<String> data = new ArrayList<String>();
        for (int i = 0; i < 20; i++) {
            data.add("Item " + i);
        }
        return data;
    }
}

总结

通过本文的介绍，你学会了如何为 ListView 设置 Material Design 风格的分割线。在实际开发中，为 ListView 设置合适的分割线不仅可以美化界面，还可以提高用户体验。希望本文能够对 Android 开发者有所帮助。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/654c803e7d4982a6eb5fbd20