material-components / material-components/material-components-android

[TopAppBar] elevation (on scroll) of top app bar

Open
#2,664 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug Widget: TopAppBar
Dominant language
Java
Stars
17.4k
Forks
3.2k
PR merge metrics
No merged PRs in 30d

Description

**Description:**
https://m3.material.io/components/top-app-bar/specs:
The elevation (on scroll) of top app bar is **3dp**.
```
Element | Design attribute | Role | Token
1. Container | Color | Surface | md.sys.color.surface
| Surface tint color | Surface tint | md.sys.color.surface-tint
| Elevation | Level 0 | md.sys.elevation.level0
| Elevation (on scroll) | Level 2 | md.sys.elevation.level2
```
https://github.com/material-components/material-components-android/blob/master/docs/components/TopAppBar.md:
The elevation of AppBarLayout is 0dp to **4dp**.
The default value of elevation of MaterialToolbar is **not 4dp but 0dp**.
```
Element | Attribute | Related method(s) | Default value
MaterialToolbar elevation | android:elevation | setElevation |
| | getElevation | 4dp
AppBarLayout elevation | android:stateListAnimator | setStateListAnimator |
| | getStateListAnimator | 0dp to 4dp (see all states)
```
Catalog app:
The elevation (on scroll) of top app bar is **4dp**.

Is it a document bug, a catalog bug, or an AppBarLayout bug?

**Source code:**
https://github.com/material-components/material-components-android/blob/master/catalog/java/io/material/catalog/topappbar/res/layout/cat_topappbar_fragment.xml#L25-L38
https://github.com/material-components/material-components-android/blob/master/catalog/java/io/material/catalog/topappbar/res/layout/cat_topappbar_collapsing_medium_fragment.xml#L24-L46
...
https://github.com/material-components/material-components-android/blob/master/lib/java/com/google/android/material/appbar/AppBarLayout.java#L305-L306
https://github.com/material-components/material-components-android/blob/master/lib/java/com/google/android/material/appbar/res/values/dimens.xml#L19
https://github.com/material-components/material-components-android/commit/c587dd12597ee52086c3f637f03d6913e56e03cc

(TopAppBar on Scroll)
![Screenshot_20220422_212333](https://user-images.githubusercontent.com/71050561/165013121-397e4b25-b09a-429a-b9ba-7dff09056752.png)
(TopAppBar)
![Screenshot_20220422_212308](https://user-images.githubusercontent.com/71050561/165013146-c52999b2-b1f6-4354-983d-f6c6e41105b7.png)

**Android API version:** 32

**Material Library version:** 1.5.0, 1.6.0-rc01, 1.7.0-alpha01

**Device:** Emulator 31.2.10

P.S. design_appbar_elevation appears:
https://github.com/material-components/material-components-android/blob/master/lib/java/com/google/android/material/appbar/CollapsingToolbarLayout.java#L793
https://github.com/material-components/material-components-android/blob/master/lib/java/com/google/android/material/appbar/res/animator-v21/design_appbar_state_list_animator.xml#L34
https://github.com/material-components/material-components-android/blob/master/lib/java/com/google/android/material/appbar/res/values/styles.xml#L61
https://github.com/material-components/material-components-android/blob/master/lib/java/com/google/android/material/appbar/res/values/styles.xml#L113

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the catalog layouts, AppBarLayout.java, its dimens.xml, and the referenced state-list animator and styles files. Compare the documented, catalog, and library elevation values and check relevant existing tests or rendering behavior. Done means the project has one confirmed, consistent elevation behavior or documentation decision, with coverage or updated references where appropriate.

Written by the indexing model from the issue text.

Assessment

Tech stack
android, java
Domain
design, mobile
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.