Android material chips

早过忘川 提交于 2019-11-30 17:20:07

The new Material Components for Android contains the component Chip.

You can add the chip to your layout file with:

<com.google.android.material.chip.Chip
    android:id="@+id/some_chip"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="This is a chip" />

With the classic Design Support Library 28.0.0 you can use the package:

<android.support.design.chip.Chip
../>

You can customize the component using these attributes:

  • android:checkable: If true, the chip can be toggled. If false, the chip acts like a button
  • app:chipIcon: Used to display an icon within the chip
  • app:closeIcon: Used to display a close icon within the chip

You can find the official documentation here.

I actually ended up using this library. The autocomplete view and chips that this library provides are not "materially" styled, but you can do it yourself with no great effort. After great research I realized that this library gives you the most easy way of implementing your own sets of data into the logic. All the other libraries were customized for using Android contact or emails, and it was not so trivial to change the code and query your own sets of data. So if someone wants to implement chips, but with custom data querying I'd say this is the right way to go.

there is also a new library for material chips!

Latest so far.. This library looks super and easy. You need

implementation "com.hootsuite.android:nachos:1.1.1"

and

<com.hootsuite.nachos.NachoTextView
    android:id="@+id/nacho_text_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:chipHorizontalSpacing="2dp"
    app:chipBackground="@color/chip_background"
    app:chipTextColor="@color/cheddar"
    app:chipTextSize="16dp"
    app:chipHeight="30dp"
    app:chipVerticalSpacing="3dp"/>

and

val suggestions = arrayOf("Tortilla Chips", "Melted Cheese", "Salsa", "Guacamole", "Mexico", "Jalapeno")
val adapter = ArrayAdapter(context, android.R.layout.simple_dropdown_item_1line, suggestions)
nachoTextView.setAdapter(adapter)

Play with the customization!

This links might help

The Chip widget provides a complete implementation of Material Design’s chip component. Example code of how to include the widget in your layout:

<com.google.android.material.chip.Chip
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/hello_world"/>

https://material.io/develop/android/components/chip/

Another 3rd party libraries

Nachos is a library for Android that provides a custom TextView allowing users to enter text and create material chips in the text field. https://github.com/hootsuite/nachos

MaterialChipsInput Implementation of Material Design Chips component for Android. The library provides two views: ChipsInput and ChipView. https://github.com/pchmn/MaterialChipsInput

Material Chip view. Can be used as tags for categories, contacts or creating text clouds https://github.com/robertlevonyan/materialChipView

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!