Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[CollapsingToolbarLayout] Title breaks after collapsing/expanding

See original GitHub issue

Description: The title in the CollapsingToolbarLayout is sometimes laid out in a single line, but after collapsing and expanding the toolbar, it is then laid out in 2 lines and the bottom is cut off.

https://user-images.githubusercontent.com/2743419/140773080-81620071-9738-4c8d-92b4-8c32653544e0.mp4

While the above video shows the issue with app:titleCollapseMode="scale", it is also reproducible with fade.

Expected behavior: The expanded title should be either laid out to single line or to multiple lines. Number of lines should not change after collapsing and expanding and whole title should stay visible.

Source code: The issue can be reproduced in the catalog app in https://github.com/ghus-raba/material-components-android/tree/fnagy/collapsible_toolbar_bug

Android API version: I reproduced this on multiple versions, 28 and 30 in my case.

Material Library version: Reproduced this on 1.4.0 and also from source on current master: https://github.com/material-components/material-components-android/commit/a3694498096bc60059784ddd31023a9e90894ced

Device: Above video was taken on an emulator with:

Target: google_apis_playstore [Google Play] (API level 30)
hw.device.name: pixel_3
hw.lcd.density: 440
hw.lcd.height: 2160
hw.lcd.width: 1080

Font size was set to Largest and Display size was set to Larger in the Settings app.

Let me know if I can provide any additional info.

Issue Analytics

State:
Created 2 years ago
Comments:5 (5 by maintainers)

Top GitHub Comments

1reaction

drchencommented, Nov 11, 2021

Ah yes you are right. My fix doesn’t include that situation. I’ll create another fix for that. Thanks for the reminder!!

0reactions

ferinagycommented, Nov 11, 2021

Hi, unfortunately, the issue with setLinearText() from https://github.com/material-components/material-components-android/issues/2463#issuecomment-964026714 still persists. I updated the repro case (https://github.com/ghus-raba/material-components-android/commit/750df2837c8efa580c1ea6df8a7c7d3f88291796) with custom fonts and it is still reproducible after merging the latest fixes.

Forcing constant value to textPaint.setLinearText(true) or textPaint.setLinearText(false) seems to fix it for me.

Top Results From Across the Web

CollapsingToolbarLayout showing broken title when collapsed

1 Answer 1 ... android:fitsSystemWindows="true" typically adds the appropriate padding in some cases to make sure that views are not layered under ...

CollapsingToolbarLayout setTitle not working anymore: title is ...

It is working sporadically, sometimes works when expanded, nearly never when collapsed: I can't see the title, it is not set or not...

App bars: top - Material Design

The following example shows a top app bar with a page title, a navigation icon, two action icons ... Expanded. CollapsingToolbarLayout collapsed title...

Collapsing Toolbar made easy with Compose - Coding Troops

We saw the following collapsing effect: as the user scrolls down the list of dishes, our header shrinks. More precisely, the profile picture...

Design Support Library (IV): Collapsing Toolbar Layout

I'll be changing this programmatically and use palette to decide its color. We can also specify the margins for the title when it's...