DEV/material-components_material-components-android
1
0
Fork 0
mirror of https://github.com/material-components/material-components-android.git synced 2026-02-20 08:39:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

[M3][Checkbox] Update checkbox dev docs with M3 themes/styles

Browse Source 
PiperOrigin-RevId: 395968902
This commit is contained in:
pfthomas 2021-09-10 11:21:02 -07:00 committed by Hunter Stich
parent e509cb4a6a
commit 3feb52af8a
3 changed files with 31 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
docs/components/Checkbox.md
View File

@ -37,8 +37,8 @@ page.
_**Note:** `<CheckBox>` is auto-inflated as
`<com.google.android.material.button.MaterialCheckBox>` via
`MaterialComponentsViewInflater` when using a non-Bridge
`Theme.MaterialComponents.*` theme._
`MaterialComponentsViewInflater` when using a `Theme.Material3.*`
theme._
### Making checkboxes accessible
@ -116,11 +116,11 @@ checkbox.setOnCheckedChangeListener { buttonView, isChecked
Element | Attribute | Related method(s) | Default value
-------------------------- | ------------------------------------------ | ---------------------------------------------------------- | -------------
**To use material colors** | `app:useMaterialThemeColors` | `setUseMaterialThemeColors`<br/>`isUseMaterialThemeColors` | `true` (ignored if `app:buttonTint` is set)
**Color** | `app:buttonTint` | `setButtonTintList`<br/>`getButtonTintList` | `null`
**Color** | `app:buttonTint` | `setButtonTintList`<br/>`getButtonTintList` | `?attr/colorOnSurface` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/color/res/color/m3_selection_control_button_tint.xml))
**Min size** | `android:minWidth`<br/>`android:minHeight` | `(set/get)MinWidth`<br/>`(set/get)MinHeight` | `?attr/minTouchTargetSize`
The color of the checkbox defaults to `?attr/colorOnSurface` (unchecked) and
`?attr/colorSecondary` (checked) defined in your app theme. If you want to
`?attr/colorPrimary` (checked) defined in your app theme. If you want to
override this behavior, as you might with a custom drawable that should not be
tinted, set `app:useMaterialThemeColors` to `false`:
@ -137,7 +137,7 @@ Element | Attribute | Related method(s) |
-------------- | ------------------------ | ---------------------------------- | -------------
**Text label** | `android:text` | `setText`<br/>`getText` | `null`
**Color** | `android:textColor` | `setTextColor`<br/>`getTextColors` | inherits from `AppCompatCheckBox`
**Typography** | `android:textAppearance` | `setTextAppearance` | inherits from `AppCompatCheckBox`
**Typography** | `android:textAppearance` | `setTextAppearance` | `?attr/textAppearanceBodyMedium`
### Checkbox states
@ -155,7 +155,7 @@ selected and unselected states are supported._
Element | Style
----------------- | ---------------------------------------------------
**Default style** | `Widget.MaterialComponents.CompoundButton.CheckBox`
**Default style** | `Widget.Material3.CompoundButton.CheckBox`
Default style theme attribute: `?attr/checkboxStyle`
@ -189,7 +189,7 @@ Using theme attributes in `res/values/styles.xml` (themes all checkboxes and
affects other components):
```xml
<style name="Theme.App" parent="Theme.MaterialComponents.*">
<style name="Theme.App" parent="Theme.Material3.*">
...
<item name="colorOnSurface">@color/shrine_pink_900</item>
<item name="colorSecondary">@color/shrine_pink_100</item>
@ -201,12 +201,12 @@ or using default style theme attributes, styles and theme overlays (themes all
checkboxes but does not affect other components):
```xml
<style name="Theme.App" parent="Theme.MaterialComponents.*">
<style name="Theme.App" parent="Theme.Material3.*">
...
<item name="checkboxStyle">@style/Widget.App.CheckBox</item>
</style>
<style name="Widget.App.CheckBox" parent="Widget.MaterialComponents.CompoundButton.CheckBox">
<style name="Widget.App.CheckBox" parent="Widget.Material3.CompoundButton.CheckBox">
<item name="materialThemeOverlay">@style/ThemeOverlay.App.CheckBox</item>
</style>
@ -219,7 +219,7 @@ checkboxes but does not affect other components):
you can also change the checkbox colors via the `?attr/buttonTint` attribute:
```xml
<style name="Widget.App.CheckBox" parent="Widget.MaterialComponents.CompoundButton.CheckBox">
<style name="Widget.App.CheckBox" parent="Widget.Material3.CompoundButton.CheckBox">
<item name="buttonTint">@color/button_tint</item>
</style>
```

BIN
docs/components/assets/checkbox/checkbox_example.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 15 KiB

21
lib/java/com/google/android/material/checkbox/res-public/values/public.xml Normal file
View File

@ -0,0 +1,21 @@
<?xml version="1.0" encoding="utf-8"?>
<!--
~ Copyright (C) 2021 The Android Open Source Project
~
~ Licensed under the Apache License, Version 2.0 (the "License");
~ you may not use this file except in compliance with the License.
~ You may obtain a copy of the License at
~
~ http://www.apache.org/licenses/LICENSE-2.0
~
~ Unless required by applicable law or agreed to in writing, software
~ distributed under the License is distributed on an "AS IS" BASIS,
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
<!-- Definitions of attributes to be exposed as public -->
<resources>
<public name="Widget.Material3.CompoundButton.CheckBox" type="style"/>
</resources>