How to Change Material Chip Text Size, Text Style and Font

Chips in Android is a Material Design Component used primarily for actions or choice or during filters or as an input.

The attributes like textColor, textStyle and fontFamily are ignored when added to the Material Chips directly. We need to modify these values using textAppearance.

<com.google.android.material.chip.Chip
    android:id="@+id/maleChip"
    style="@style/Widget.MaterialComponents.Chip.Choice"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:checkable="true"
    android:layoutDirection="locale"
    android:text="@string/chip_text_male"
    android:textAppearance="@style/AppTheme.GenderChip"
    android:textColor="@color/colorWhiteText"
    app:chipBackgroundColor="@drawable/select_chip"
    app:chipEndPadding="@dimen/chip_horizontal_margin"
    app:chipStartPadding="@dimen/chip_horizontal_margin" />

The text appearance style for the Android Chip is set as AppTheme.GenderChip. We will define the required attributes in the styles.xml file as shown below.

<style name="AppTheme.GenderChip" parent="TextAppearance.MaterialComponents.Chip">
    <item name="android:textSize">18sp</item>
    <item name="android:textStyle">bold</item>
    <item name="fontFamily">sans-serif-condensed-light</item>
</style>

These attributes are now applied to the Material Chip changing the text size, style and font family.

Popular posts from this blog

Add Spacing to Recycler View Linear Layout Manager Using Item Decoration

Bottom App Bar for Android - A Material Design Component

Perform a Post Request Using Volley

How to Set an Android App as a Default Dialer