[Android] Chip 사용하기

Chip 사용하기

 

---

build.gradle - dependencies 추가

implementation 'com.android.support:design:28.0.0'

 

xml에 chip 추가

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

 

 

이렇게만 해서 실행하면 앱이 정상적으로 실행이 안될 수 있습니다.

values - style.xml에서 style태그 내에 parent를 Theme.MaterialComponents로 시작하는거로 변경해줘야 합니다.

<style name="AppTheme" parent="Theme.MaterialComponents.Light.Bridge">

여기까지는 기초!

 

 

Chipgroup

Chip만 사용할 경우 줄이 가득차면 다음 줄로 넘어가지 않고 계속해서 옆으로 생성된다.

Chipgroup 안에 Chip을 생성하면 알아서 다음 줄에 Chip을 생성한다.

<com.google.android.material.chip.ChipGroup
	android:id="@+id/chipgroup"
	android:layout_width="match_parent"
	android:layout_height="match_parent">
    
    <!-- 코드 작성 -->
    
</com.google.android.material.chip.ChipGroup>

 

 

Chip 테마

Chip에는 4가지 테마가 있습니다.

왼쪽부터 차례로 Action, Entry, Filter, Choice 입니다.

아래와 같이 style을 추가시켜주시면 됩니다.

<com.google.android.material.chip.Chip
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	style="@style/Widget.MaterialComponents.Chip.Action"
	android:text="Banana"/>
<com.google.android.material.chip.Chip
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	style="@style/Widget.MaterialComponents.Chip.Entry"
	android:text="Banana"/>
<com.google.android.material.chip.Chip
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	style="@style/Widget.MaterialComponents.Chip.Filter"
	android:text="Banana"/>
<com.google.android.material.chip.Chip
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	style="@style/Widget.MaterialComponents.Chip.Choice"
	android:text="Banana"/>

 

기타 추가 속성들은 링크를 통해서 확인하실 수 있습니다.

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

Chips - Material Components for Android