diff --git a/docs/components/Chip.md b/docs/components/Chip.md index 0f3ba7caea9..a166757fed9 100644 --- a/docs/components/Chip.md +++ b/docs/components/Chip.md @@ -418,85 +418,85 @@ The following is an anatomy diagram of a chip: #### Container attributes -Element | Attribute | Related method(s) | Default value --------------------- | --------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------- | ------------- -**Color** | `app:chipBackgroundColor` | `setChipBackgroundColor`
`setChipBackgroundColorResource`
`getChipBackgroundColor` | `?attr/colorOnSurface` -**Ripple color** | `app:rippleColor` | `setRippleColor`
`setRippleColorResource`
`getRippleColor` | `?attr/colorOnSecondaryContainer` at 12% -**Stroke width** | `app:chipStrokeWidth` | `setStrokeWidth`
`setChipStrokeWidthResource`
`getChipStrokeWidth` | `1dp` -**Stroke color** | `app:chipStrokeColor` | `setStrokeColor`
`setChipStrokeColorResource`
`getChipStrokeColor` | `?attr/colorOnSurface` -**Min height** | `app:chipMinHeight` | `setChipMinHeight`
`setChipMinHeightResource`
`getChipMinHeight` | `32dp` -**Padding** | `app:chipStartPadding`
`app:chipEndPadding` | `setChip*Padding`
`setChip*PaddingResource`
`getChip*Padding` | `4dp` (start)
`6dp` (end) -**Shape** | `app:shapeAppearance`
`shapeAppearanceOverlay` | `setShapeAppearanceModel`
`getShapeAppearanceModel` | `?attr/shapeAppearanceSmallComponent` with 8dp `cornerSize` -**Min touch target** | `app:chipMinTouchTargetSize`
`app:ensureMinTouchTargetSize` | `ensureAccessibleTouchTarget`
`setEnsureAccessibleTouchTarget`
`shouldEnsureAccessibleTouchTarget` | `48dp`
`true` -**Checkable** | `android:checkable` | `setCheckable`
`setCheckableResource`
`isCheckable` | `true` (input, suggestion, filter) +| Element | Attribute | Related method(s) | Default value | +|----------------------|-----------------------------------------------------------------|------------------------------------------------------------------------------------------------------------|-------------------------------------------------------------| +| **Color** | `app:chipBackgroundColor` | `setChipBackgroundColor`
`setChipBackgroundColorResource`
`getChipBackgroundColor` | `?attr/colorOnSurface` | +| **Ripple color** | `app:rippleColor` | `setRippleColor`
`setRippleColorResource`
`getRippleColor` | `?attr/colorOnSecondaryContainer` at 12% | +| **Stroke width** | `app:chipStrokeWidth` | `setStrokeWidth`
`setChipStrokeWidthResource`
`getChipStrokeWidth` | `1dp` | +| **Stroke color** | `app:chipStrokeColor` | `setStrokeColor`
`setChipStrokeColorResource`
`getChipStrokeColor` | `?attr/colorOnSurface` | +| **Min height** | `app:chipMinHeight` | `setChipMinHeight`
`setChipMinHeightResource`
`getChipMinHeight` | `32dp` | +| **Padding** | `app:chipStartPadding`
`app:chipEndPadding` | `setChip*Padding`
`setChip*PaddingResource`
`getChip*Padding` | `4dp` (start)
`6dp` (end) | +| **Shape** | `app:shapeAppearance`
`shapeAppearanceOverlay` | `setShapeAppearanceModel`
`getShapeAppearanceModel` | `?attr/shapeAppearanceSmallComponent` with 8dp `cornerSize` | +| **Min touch target** | `app:chipMinTouchTargetSize`
`app:ensureMinTouchTargetSize` | `ensureAccessibleTouchTarget`
`setEnsureAccessibleTouchTarget`
`shouldEnsureAccessibleTouchTarget` | `48dp`
`true` | +| **Checkable** | `android:checkable` | `setCheckable`
`setCheckableResource`
`isCheckable` | `true` (input, suggestion, filter) | #### Thumbnail attributes **Chip icon** -Element | Attribute | Related method(s) | Default value --------------- | ----------------------------------------------- | --------------------------------------------------------------------- | ------------- -**Icon** | `app:chipIcon` | `setChipIconVisible`
`isChipIconVisible` | `null` -**Visibility** | `app:chipIconVisible` | `setChipIcon`
`setChipIconResource`
`getChipIcon` | `true` (input and assist) -**Color** | `app:chipIconTint` | `setChipIconTint`
`setChipIconTintResource`
`getChipIconTint` | `null` -**Size** | `app:chipIconSize` | `setChipIconSize`
`setChipIconSizeResource`
`getChipIconSize` | `18dp` -**Padding** | `app:iconStartPadding`
`app:iconEndPadding` | `setIcon*Padding`
`setIcon*PaddingResource`
`getIcon*Padding` | `0dp`, `-2dp` (filter end padding) +| Element | Attribute | Related method(s) | Default value | +|----------------|-------------------------------------------------|-----------------------------------------------------------------------|------------------------------------| +| **Icon** | `app:chipIcon` | `setChipIcon`
`setChipIconResource`
`getChipIcon` | `null` | +| **Visibility** | `app:chipIconVisible` | `setChipIconVisible`
`isChipIconVisible` | `true` (input and assist) | +| **Color** | `app:chipIconTint` | `setChipIconTint`
`setChipIconTintResource`
`getChipIconTint` | `null` | +| **Size** | `app:chipIconSize` | `setChipIconSize`
`setChipIconSizeResource`
`getChipIconSize` | `18dp` | +| **Padding** | `app:iconStartPadding`
`app:iconEndPadding` | `setIcon*Padding`
`setIcon*PaddingResource`
`getIcon*Padding` | `0dp`, `-2dp` (filter end padding) | **Checked icon** If visible, the checked icon overlays the chip icon. -Element | Attribute | Related method(s) | Default value --------------- | ------------------------ | ------------------------------------------------------------------------------ | ------------- -**Icon** | `app:checkedIcon` | `setCheckedIconVisible`
`isCheckedIconVisible` | `@drawable/ic_m3_chip_checked_circle` -**Visibility** | `app:checkedIconVisible` | `setCheckedIcon`
`setCheckedIconResource`
`getCheckedIcon` | `true` (input, filter) -**Color** | `app:checkedIconTint` | `setCheckedIconTint`
`setCheckedIconTintResource`
`getCheckedIconTint` | `null` +| Element | Attribute | Related method(s) | Default value | +|----------------|--------------------------|--------------------------------------------------------------------------------|---------------------------------------| +| **Icon** | `app:checkedIcon` | `setCheckedIcon`
`setCheckedIconResource`
`getCheckedIcon` | `@drawable/ic_m3_chip_checked_circle` | +| **Visibility** | `app:checkedIconVisible` | `setCheckedIconVisible`
`isCheckedIconVisible` | `true` (input, filter) | +| **Color** | `app:checkedIconTint` | `setCheckedIconTint`
`setCheckedIconTintResource`
`getCheckedIconTint` | `null` | #### Text attributes -Element | Attribute | Related method(s) | Default value --------------- | ----------------------------------------------- | --------------------------------------------------------------------------- | ------------- -**Text label** | `android:text` | `setChipText`
`setChipTextResource`
`getChipText` | `null` -**Color** | `android:textColor` | `setTextColor`
`getTextColors` | `?attr/colorOnSurfaceVariant` -**Typography** | `android:textAppearance` | `setTextAppearance`
`setTextAppearanceResource`
`getTextAppearance` | `?attr/textAppearanceLabelLarge` -**Padding** | `app:textStartPadding`
`app:textEndPadding` | `setText*Padding`
`setText*PaddingResource`
`getText*Padding` | `8dp` (start)
`6dp` (end) +| Element | Attribute | Related method(s) | Default value | +|----------------|-------------------------------------------------|-----------------------------------------------------------------------------|----------------------------------| +| **Text label** | `android:text` | `setChipText`
`setChipTextResource`
`getChipText` | `null` | +| **Color** | `android:textColor` | `setTextColor`
`getTextColors` | `?attr/colorOnSurfaceVariant` | +| **Typography** | `android:textAppearance` | `setTextAppearance`
`setTextAppearanceResource`
`getTextAppearance` | `?attr/textAppearanceLabelLarge` | +| **Padding** | `app:textStartPadding`
`app:textEndPadding` | `setText*Padding`
`setText*PaddingResource`
`getText*Padding` | `8dp` (start)
`6dp` (end) | #### Remove (close) icon attributes -Element | Attribute | Related method(s) | Default value ------------------------ | --------------------------------------------------------- | ------------------------------------------------------------------------------------ | ------------- -**Icon** | `app:closeIcon` | `setCloseIcon`
`setCloseIconResource`
`getCloseIcon` | `@drawable/ic_mtrl_chip_close_circle` -**Visibility** | `app:closeIconVisible` | `setCloseIconVisible`
`isCloseIconVisible` | `true` for input -**Color** | `app:closeIconTint` | `setCloseIconTint`
`setCloseIconTintResource`
`getCloseIconTint` | `?attr/colorOnSurfaceVariant` -**Size** | `app:closeIconSize` | `setCloseIconSize`
`setCloseIconSizeResource`
`getCloseIconSize` | `18dp` -**Padding** | `app:closeIconStartPadding`
`app:closeIconEndPadding` | `setCloseIcon*Padding`
`setCloseIcon*PaddingResource`
`getCloseIcon*Padding` | `4dp` input end padding -**Content description** | N/A | `setCloseIconContentDescription`
`getCloseIconContentDescription` | `@string/mtrl_chip_close_icon_content_description` +| Element | Attribute | Related method(s) | Default value | +|-------------------------|-----------------------------------------------------------|--------------------------------------------------------------------------------------|----------------------------------------------------| +| **Icon** | `app:closeIcon` | `setCloseIcon`
`setCloseIconResource`
`getCloseIcon` | `@drawable/ic_mtrl_chip_close_circle` | +| **Visibility** | `app:closeIconVisible` | `setCloseIconVisible`
`isCloseIconVisible` | `true` for input | +| **Color** | `app:closeIconTint` | `setCloseIconTint`
`setCloseIconTintResource`
`getCloseIconTint` | `?attr/colorOnSurfaceVariant` | +| **Size** | `app:closeIconSize` | `setCloseIconSize`
`setCloseIconSizeResource`
`getCloseIconSize` | `18dp` | +| **Padding** | `app:closeIconStartPadding`
`app:closeIconEndPadding` | `setCloseIcon*Padding`
`setCloseIcon*PaddingResource`
`getCloseIcon*Padding` | `4dp` input end padding | +| **Content description** | N/A | `setCloseIconContentDescription`
`getCloseIconContentDescription` | `@string/mtrl_chip_close_icon_content_description` | #### `ChipGroup` attributes -Element | Attribute | Related method(s) | Default value -------------- | --------------------------------------------------------------------------- | ------------------------------------------------------------- | ------------- -**Layout** | `app:singleLine` | `setSingleLine`
`isSingleLine` | `false` -**Selection** | `app:singleSelection`
`app:selectionRequired` | `setSingleSelection*`
`isSingleSelection*` | `false`
`false` -**Spacing** | `app:chipSpacing`
`app:chipSpacingHorizontal`
`chipSpacingVertical` | `setSpacing*`
`setChipSpacing*Resource`
`getSpacing*` | `8dp` +| Element | Attribute | Related method(s) | Default value | +|---------------|-----------------------------------------------------------------------------|---------------------------------------------------------------|---------------------| +| **Layout** | `app:singleLine` | `setSingleLine`
`isSingleLine` | `false` | +| **Selection** | `app:singleSelection`
`app:selectionRequired` | `setSingleSelection*`
`isSingleSelection*` | `false`
`false` | +| **Spacing** | `app:chipSpacing`
`app:chipSpacingHorizontal`
`chipSpacingVertical` | `setSpacing*`
`setChipSpacing*Resource`
`getSpacing*` | `8dp` | #### Styles -Element | Style -------------------------------- | ---------------------------------- -**Default style (assist chip)** | `Widget.Material3.Chip.Assist` -**Input chip** | `Widget.Material3.Chip.Input` -**Suggestion chip** | `Widget.Material3.Chip.Suggestion` -**Filter chip** | `Widget.Material3.Chip.Filter` -**`ChipGroup` style** | `Widget.Material3.ChipGroup` +| Element | Style | +|---------------------------------|------------------------------------| +| **Default style (assist chip)** | `Widget.Material3.Chip.Assist` | +| **Input chip** | `Widget.Material3.Chip.Input` | +| **Suggestion chip** | `Widget.Material3.Chip.Suggestion` | +| **Filter chip** | `Widget.Material3.Chip.Filter` | +| **`ChipGroup` style** | `Widget.Material3.ChipGroup` | #### Theme attributes -Element | Theme attribute | Default style ------------------- | --------------------------- | ------------- -**`Chip`** | `?attr/chipStyle` | `Widget.Material3.Chip.Assist` -**`ChipGroup`** | `?attr/chipGroupStyle` | `Widget.Material3.ChipGroup` -**`ChipDrawable`** | `?attr/chipStandaloneStyle` | `Widget.Material3.Chip.Input` +| Element | Theme attribute | Default style | +|--------------------|-----------------------------|--------------------------------| +| **`Chip`** | `?attr/chipStyle` | `Widget.Material3.Chip.Assist` | +| **`ChipGroup`** | `?attr/chipGroupStyle` | `Widget.Material3.ChipGroup` | +| **`ChipDrawable`** | `?attr/chipStandaloneStyle` | `Widget.Material3.Chip.Input` | See the full list of [styles](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/chip/res/values/styles.xml)