Android中的Material Design组件芯片与示例

Material Design组件芯片是从Android 5.0（API级别21）开始引入的，在设计中旨在提供一个紧凑且令人愉悦的方式来显示小块内容。芯片是一个可交互的元素，可以展示文本、图像和操作，可以用于标识实体（如联系人）和选项（如过滤器）。

芯片可以作为文本，图像和操作的容器。它们可以作为单个元素，也可以作为组合显示，以帮助用户对类似实体的对象进行排序、过滤和搜索。

Material Design组件芯片的类型：

1. 可取消芯片

可取消芯片的右侧有个删除按钮，可以删除该芯片。比如标签，可以使用可取消芯片。

示例代码：

<com.google.android.material.chip.Chip
    android:id="@+id/chip1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="标签一"
    app:chipEndPadding="8dp"
    app:chipStartPadding="8dp"
    app:closeIcon="@drawable/ic_close"
    app:closeIconEnabled="true"
    app:closeIconTint="@color/colorPrimary"
    app:chipIcon="@drawable/ic_tag"
    app:chipIconEnabled="true"
    app:chipIconTint="@color/colorPrimary"
    app:chipBackgroundColor="@color/colorAccent"
    app:chipStrokeWidth="2dp"
    app:chipStrokeColor="@color/colorPrimary" />

2. 输入芯片

输入芯片可以展示用户输入的文本，可以在其中添加文本。

示例代码：

<com.google.android.material.chip.Chip
    android:id="@+id/chip2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="输入标签"
    app:chipEndPadding="8dp"
    app:chipStartPadding="8dp"
    app:chipIcon="@drawable/ic_tag"
    app:chipIconEnabled="true"
    app:chipIconTint="@color/colorPrimary"
    app:chipBackgroundColor="@android:color/white"
    app:chipStrokeWidth="2dp"
    app:chipStrokeColor="@color/colorPrimary" />

3. 选择芯片

选择芯片具有单选和多选功能，用户可以通过单击芯片来选择该项。适用于显示过滤选项。

示例代码：

<com.google.android.material.chip.Chip
    android:id="@+id/chip3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="单选芯片"
    android:checked="true"
    app:chipEndPadding="8dp"
    app:chipStartPadding="8dp"
    app:chipIconEnabled="true"
    app:chipIconTint="@color/colorPrimary"
    app:chipBackgroundColor="@android:color/white"
    app:chipStrokeWidth="2dp"
    app:chipStrokeColor="@color/colorPrimary"
    style="@style/Widget.MaterialComponents.Chip.Choice" />

<com.google.android.material.chip.Chip
    android:id="@+id/chip4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="多选芯片"
    android:checked="true"
    app:chipEndPadding="8dp"
    app:chipStartPadding="8dp"
    app:chipIconEnabled="true"
    app:chipIconTint="@color/colorPrimary"
    app:chipBackgroundColor="@android:color/white"
    app:chipStrokeWidth="2dp"
    app:chipStrokeColor="@color/colorPrimary"
    style="@style/Widget.MaterialComponents.Chip.Choice" />

Material Design组件芯片的属性：

以下是Material Design组件芯片的一些属性：

• app:chipBackgroundColor：指定芯片的背景颜色。
• app:chipIconTint：指定芯片上的图标的着色。
• app:chipStrokeWidth：指定芯片的边框宽度。
• app:chipStrokeColor：指定芯片的边框颜色。
• app:chipEndPadding：指定芯片的右侧内边距。
• app:chipStartPadding：指定芯片的左侧内边距。
• app:chipIconEnabled：指定是否启用芯片上的图标。
• app:chipIcon：指定芯片上的图标。
• app:closeIconEnabled：指定是否启用芯片取消按钮。
• app:closeIcon：指定芯片取消按钮的图标。
• app:checkedIconEnabled：指定是否启用选择芯片的选中图标。
• app:checkedIcon：指定选择芯片的选中图标。

总结

Material Design组件芯片提供了一种简单而强大的方式，可以在应用程序中显示小块内容。芯片可以作为文本、图像和操作的容器，可以作为单个元素，也可以作为组合显示，以帮助用户对类似实体的对象进行排序、过滤和搜索。同时，我们也可以根据需求来选择不同类型的芯片。