Skip to content

Commit

Permalink
[Docs] Cross-reference m.io and DAC in Github docs
Browse files Browse the repository at this point in the history
PiperOrigin-RevId: 546035020
  • Loading branch information
imhappi authored and paulfthomas committed Jul 7, 2023
1 parent 9f2e686 commit 1785bbf
Show file tree
Hide file tree
Showing 28 changed files with 277 additions and 217 deletions.
18 changes: 13 additions & 5 deletions docs/components/BadgeDrawable.md
Expand Up @@ -9,6 +9,11 @@ path: /catalog/badging/

# `BadgeDrawable`

## Design & API Documentation

* [Google Material3 Spec](https://material.io/components/badges/overview)
* [API reference](https://developer.android.com/reference/com/google/android/material/badge/package-summary)

## Using badges

Badge | Badge with number | Badge with a maximum character count
Expand All @@ -23,13 +28,16 @@ A `BadgeDrawable` represents dynamic information such as a number of pending
requests in a [`BottomNavigationView`](BottomNavigation.md) or
[`TabLayout`](Tabs.md).

## Design & API Documentation
## Usage

- [Material Design guidelines: Bottom Navigation](https://material.io/design/components/bottom-navigation.html#behavior)
- [Class definition](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/badge/BadgeDrawable.java)
- [Class overview](https://developer.android.com/reference/com/google/android/material/badge/BadgeDrawable)
API and source code:

## Usage
* `BadgeDrawable`
* [Class definition](https://developer.android.com/reference/com/google/android/material/badge/BadgeDrawable)
* [Class source](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/badge/BadgeDrawable.java)
* `BadgeUtils`
* [Class definition](https://developer.android.com/reference/com/google/android/material/badge/BadgeUtils)
* [Class source](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/badge/BadgeUtils.java)

Create an instance of `BadgeDrawable` by calling `create(Context)` or
`createFromAttributes(Context, AttributeSet, int, int)}`.
Expand Down
6 changes: 6 additions & 0 deletions docs/components/BottomAppBar.md
Expand Up @@ -20,10 +20,16 @@ revert back to the previous style.

**Contents**

* [Design & API documentation](#design-api-documentation)
* [Using bottom app bars](#using-bottom-app-bars)
* [Bottom app bar](#bottom-app-bar)
* [Theming bottom app bars](#theming-bottom-app-bars)

## Design & API Documentation

* [Google Material3 Spec](https://material.io/components/bottom-app-bar/overview)
* [API Reference](https://developer.android.com/reference/com/google/android/material/bottomappbar/package-summary)

## Using bottom app bars

Before you can use Material bottom app bars, you need to add a dependency to the
Expand Down
30 changes: 18 additions & 12 deletions docs/components/BottomNavigation.md
Expand Up @@ -16,10 +16,16 @@ allow movement between primary destinations in an app.

**Contents**

* [Design & API documentation](#design-api-documentation)
* [Using bottom navigation](#using-bottom-navigation)
* [Bottom navigation bar](#bottom-navigation-bar)
* [Theming](#theming-a-bottom-navigation-bar)

## Design & API Documentation

* [Google Material3 Spec](https://material.io/components/navigation-bar/overview)
* [API Reference](https://developer.android.com/reference/com/google/android/material/bottomnavigation/package-summary)

## Using bottom navigation

Before you can use the Material bottom navigation, you need to add a dependency
Expand Down Expand Up @@ -267,8 +273,8 @@ The following is an anatomy diagram for the bottom navigation bar:
**Element** | **Attribute** | **Related methods** | **Default value**
------------------------- | ------------------------- | ----------------------------------------------------- | -----------------
**Menu resource** | `app:menu` | `inflateMenu`<br/>`getMenu` | N/A
**Ripple (inactive)** | `app:itemRippleColor` | `setItemRippleColor`<br/>`getItemRippleColor` | Variations of `?attr/colorPrimary` and `?attr/colorOnSurfaceVariant` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/navigation/res/color/m3_navigation_bar_ripple_color_selector.xml))
**Ripple (active)** | " | " | Variations of `?attr/colorPrimary` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/navigation/res/color/m3_navigation_bar_ripple_color_selector.xml))
**Ripple (inactive)** | `app:itemRippleColor` | `setItemRippleColor`<br/>`getItemRippleColor` | Variations of `?attr/colorPrimary` and `?attr/colorOnSurfaceVariant` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/bottomnavigation/res/color/m3_navigation_bar_ripple_color_selector.xml))
**Ripple (active)** | " | " | Variations of `?attr/colorPrimary` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/bottomnavigation/res/color/m3_navigation_bar_ripple_color_selector.xml))
**Label visibility mode** | `app:labelVisibilityMode` | `setLabelVisibilityMode`<br/>`getLabelVisibilityMode` | `LABEL_VISIBILITY_AUTO`

#### Icon attributes
Expand All @@ -277,19 +283,19 @@ The following is an anatomy diagram for the bottom navigation bar:
-------------------- | ------------------------------------- | ---------------------------------------------------------------- | -----------------
**Icon** | `android:icon` in the `menu` resource | N/A | N/A
**Size** | `app:itemIconSize` | `setItemIconSize`<br/>`setItemIconSizeRes`<br/>`getItemIconSize` | `24dp`
**Color (inactive)** | `app:itemIconTint` | `setItemIconTintList`<br/>`getItemIconTintList` | `?attr/colorOnSurfaceVariant` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/navigation/res/color/m3_navigation_bar_item_with_indicator_icon_tint.xml))
**Color (active)** | " | " | `?attr/colorOnSecondaryContainer` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/navigation/res/color/m3_navigation_bar_item_with_indicator_icon_tint.xml))
**Color (inactive)** | `app:itemIconTint` | `setItemIconTintList`<br/>`getItemIconTintList` | `?attr/colorOnSurfaceVariant` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/bottomnavigation/res/color/m3_navigation_bar_item_with_indicator_icon_tint.xml))
**Color (active)** | " | " | `?attr/colorOnSecondaryContainer` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/bottomnavigation/res/color/m3_navigation_bar_item_with_indicator_icon_tint.xml))

#### Text label attributes

| **Element** | **Attribute** | **Related methods** | **Default value** |
|---------------------------|-------------------------------------------|---------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| **Text label** | `android:title` in the `menu` resource | N/A | N/A |
| **Color (inactive)** | `app:itemTextColor` | `setItemTextColor`<br/>`getItemTextColor` | `?attr/colorOnSurfaceVariant` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/navigation/res/color/m3_navigation_bar_item_with_indicator_label_tint.xml)) |
| **Color (active)** | " | " | `?attr/colorOnSurface` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/navigation/res/color/m3_navigation_bar_item_with_indicator_label_tint.xml)) |
| **Typography (inactive)** | `app:itemTextAppearanceInactive` | `setItemTextAppearanceInactive`<br/>`getItemTextAppearanceInactive` | `?attr/textAppearanceTitleSmall` |
| **Typography (active)** | `app:itemTextAppearanceActive` | `setItemTextAppearanceActive`<br/>`getItemTextAppearanceActive` | `?attr/textAppearanceTitleSmall` |
| **Typography (active)** | `app:itemTextAppearanceActiveBoldEnabled` | `setItemTextAppearanceActiveBoldEnabled` | `true` |
**Element** | **Attribute** | **Related methods** | **Default value**
------------------------- | ----------------------------------------- | ------------------------------------------------------------------- | -----------------
**Text label** | `android:title` in the `menu` resource | N/A | N/A
**Color (inactive)** | `app:itemTextColor` | `setItemTextColor`<br/>`getItemTextColor` | `?attr/colorOnSurfaceVariant` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/bottomnavigation/res/color/m3_navigation_bar_item_with_indicator_label_tint.xml))
**Color (active)** | " | " | `?attr/colorOnSurface` (see all [states](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/bottomnavigation/res/color/m3_navigation_bar_item_with_indicator_label_tint.xml))
**Typography (inactive)** | `app:itemTextAppearanceInactive` | `setItemTextAppearanceInactive`<br/>`getItemTextAppearanceInactive` | `?attr/textAppearanceTitleSmall`
**Typography (active)** | `app:itemTextAppearanceActive` | `setItemTextAppearanceActive`<br/>`getItemTextAppearanceActive` | `?attr/textAppearanceTitleSmall`
**Typography (active)** | `app:itemTextAppearanceActiveBoldEnabled` | `setItemTextAppearanceActiveBoldEnabled` | `true`

#### Styles

Expand Down
15 changes: 11 additions & 4 deletions docs/components/BottomSheet.md
Expand Up @@ -16,13 +16,19 @@ containing supplementary content that are anchored to the bottom of the screen.

**Contents**

* [Design & API Documentation](#design-api-documentation)
* [Using bottom sheets](#using-bottom-sheets)
* [Standard bottom sheet](#standard-bottom-sheet)
* [Modal bottom sheet](#modal-bottom-sheet)
* [Anatomy and key properties](#anatomy-and-key-properties)
* [Predictive Back](#predictive-back)
* [Theming](#theming-bottom-sheets)

## Design & API Documentation

* [Google Material3 Spec](https://material.io/components/bottom-sheets/overview)
* [API Reference](https://developer.android.com/reference/com/google/android/material/bottomsheet/package-summary)

## Using bottom sheets

Before you can use Material bottom sheets, you need to add a dependency to the
Expand Down Expand Up @@ -246,7 +252,8 @@ simultaneously viewing and interacting with both regions. They are commonly used
to keep a feature or secondary content visible on screen when content in the
main UI region is frequently scrolled or panned.

`BottomSheetBehavior` is applied to a child of
[`BottomSheetBehavior`](https://developer.android.com/reference/com/google/android/material/bottomsheet/BottomSheetBehavior)
is applied to a child of
[CoordinatorLayout](https://developer.android.com/reference/androidx/coordinatorlayout/widget/CoordinatorLayout)
to make that child a **persistent bottom sheet**, which is a view that comes up
from the bottom of the screen, elevated over the main content. It can be dragged
Expand Down Expand Up @@ -341,9 +348,9 @@ rest of the screen. They are an alternative to inline menus and simple dialogs
on mobile devices, providing additional room for content, iconography, and
actions.

`BottomSheetDialogFragment` is a thin layer on top of the regular support
library Fragment that renders your fragment as a **modal bottom sheet**,
fundamentally acting as a dialog.
[`BottomSheetDialogFragment`](https://developer.android.com/reference/com/google/android/material/bottomsheet/BottomSheetDialogFragment)
is a thin layer on top of the regular support library Fragment that renders your
fragment as a **modal bottom sheet**, fundamentally acting as a dialog.

Modal bottom sheets render a shadow on the content below them, to indicate that
they are modal. If the content outside of the dialog is tapped, the bottom sheet
Expand Down
6 changes: 6 additions & 0 deletions docs/components/Button.md
Expand Up @@ -16,6 +16,7 @@ and make choices, with a single tap.

**Contents**

* [Design & API Documentation](#design-api-documentation)
* [Using buttons](#using-buttons)
* [Elevated button](#elevated-button)
* [Filled button](#filled-button)
Expand All @@ -26,6 +27,11 @@ and make choices, with a single tap.
* [Icon button](#icon-button)
* [Theming](#theming-buttons)

## Design & API Documentation

* [Google Material3 Spec](https://material.io/components/buttons/overview)
* [API Reference](https://developer.android.com/reference/com/google/android/material/button/package-summary)

## Using buttons

Before you can use Material buttons, you need to add a dependency to the
Expand Down
6 changes: 6 additions & 0 deletions docs/components/Card.md
Expand Up @@ -16,10 +16,16 @@ a single subject.

**Contents**

* [Design & API Documentation](#design-api-documentation)
* [Using cards](#using-cards)
* [Card](#card)
* [Theming](#theming-cards)

## Design & API Documentation

* [Google Material3 Spec](https://material.io/components/cards/overview)
* [API reference](https://developer.android.com/reference/com/google/android/material/card/package-summary)

## Using cards

Before you can use a Material card, you need to add a dependency to the Material
Expand Down
32 changes: 31 additions & 1 deletion docs/components/Carousel.md
Expand Up @@ -15,12 +15,32 @@ Carousels contain a collection of items that can move into or out of view

**Contents**

* [Design & API documentation](#design-api-documentation)
* [Using carousel](#using-carousel)
* [Multi-browse carousels](#multi-browse-carousels)
* [Customizing carousel](#customizing-carousel)

## Design & API Documentation

* [Google Material3 Spec](https://material.io/components/carousel/overview)
* [API reference](https://developer.android.com/reference/com/google/android/material/carousel/package-summary)

## Using carousel

API and source code:

* `RecyclerView`
* [Class definition](https://developer.android.com/reference/androidx/recyclerview/widget/RecyclerView)
* `CarouselLayoutManager`
* [Class definition](https://developer.android.com/reference/com/google/android/material/carousel/CarouselLayoutManager)
* [Class source](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/carousel/CarouselLayoutManager.java)
* `CarouselStrategy`
* [Class definition](https://developer.android.com/reference/com/google/android/material/carousel/CarouselStrategy)
* [Class source](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/carousel/CarouselStrategy.java)
* `MaskableFrameLayout`
* [Class definition](https://developer.android.com/reference/com/google/android/material/carousel/MaskableFrameLayout)
* [Class source](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/carousel/MaskableFrameLayout.java)

Before you can use Material carousels, you need to add a dependency on the
Material Components for Android library. For more information, go to the
[Getting started](https://github.com/material-components/material-components-android/tree/master/docs/getting-started.md)
Expand Down Expand Up @@ -76,6 +96,12 @@ on which carousel strategy you are using; you can have a

![A contained, multi-browse Carousel](assets/carousel/multibrowse.png)

API and source code:

* `MultiBrowseCarouselStrategy`
* [Class definition](https://developer.android.com/reference/com/google/android/material/carousel/MultiBrowseCarouselStrategy)
* [Class source](https://github.com/material-components/material-components-android/tree/master/lib/java/com/google/android/material/carousel/MultiBrowseCarouselStrategy.java)

A multi-browse strategy allows quick browsing of many small items, like a photo
thumbnail gallery. A start-aligned, multi-browse strategy is the default
strategy for the carousel.
Expand Down Expand Up @@ -130,7 +156,11 @@ The main means of changing the look of carousel is by setting the height of your

### Reacting to changes in item mask size

If your `RecyclerView`'s item layout contains text or other content that needs to react to changes in the item's mask, you can listen for changes in mask size by setting an `onMaskChangedListener` on your `MaskableFrameLayout` inside your `RecyclerView.ViewHolder`.
If your `RecyclerView`'s item layout contains text or other content that needs
to react to changes in the item's mask, you can listen for changes in mask size
by setting an
[`onMaskChangedListener`](https://developer.android.com/reference/com/google/android/material/carousel/OnMaskChangedListener)
on your `MaskableFrameLayout` inside your `RecyclerView.ViewHolder`.

```kotlin
(viewHolder.itemView as MaskableFrameLayout).setOnMaskChangedListener(
Expand Down
6 changes: 6 additions & 0 deletions docs/components/Checkbox.md
Expand Up @@ -24,10 +24,16 @@ checked](assets/checkbox/checkbox_hero.png)

**Contents**

* [Design & API Documentation](#design-api-documentation)
* [Using checkboxes](#using-checkboxes)
* [Checkbox](#checkbox)
* [Theming checkboxes](#theming-checkboxes)

## Design & API Documentation

* [Google Material3 Spec](https://material.io/components/checkbox/overview)
* [API reference](https://developer.android.com/reference/com/google/android/material/checkbox/package-summary)

## Using checkboxes

Before you can use Material checkboxes, you need to add a dependency to the
Expand Down

0 comments on commit 1785bbf

Please sign in to comment.