Search code examples
androidhorizontalscrollviewandroid-chips

Android chips which are horizontally scrollable

I need to implement a solution using android chips in a horizontally scrollable view. All the libraries I found use a multiline solution when having many chips to filter with. However I wish mine to be in a single line and scroll through its container.

I know that apps such as Pinterest already use this and concept, however I have no way how to go around it.

enter image description here enter image description here

Solution

  • Try placing your ChipGroup inside of a HorizontalScrollView layout.

    <HorizontalScrollView
  android:layout_width="wrap_content"
  android:layout_height="wrap_content">

  <android.support.design.chip.ChipGroup
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <android.support.design.chip.Chip
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:chipText="This" />

    <android.support.design.chip.Chip
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:chipText="is" />

    // more chips...

  </android.support.design.chip.ChipGroup>
</HorizontalScrollView>