Awesome
SubtitleCollapsingToolbarLayout
A carbon copy of CollapsingToolbarLayout
with subtitle support. During collapsed state, the subtitle would still appear
as Toolbar's. There should be no learning curve because it works just like
CollapsingToolbarLayout
. Supports Material Design 3 styling.
But because this library uses restricted APIs and private resources from Material Components, there are a few caveats:
- Only safe to use with the same version of material components.
- Deceptive package name.
Also...
It is detabable if we even need this library. If the material guidelines says it's ok to have a subtitle in toolbar layout, then they surely would've already implemented such feature. If it doesn't say anything about subtitle (which is odds because Toolbar has it), then we probably shouldn't use it out of respect to the guidelines.
Download
This library's versioning follows Material Components releases. Which in turn, follows AndroidX releases.
repositories {
mavenCentral()
google()
}
dependencies {
implementation "com.hendraanggrian.material:collapsingtoolbarlayout-subtitle:$version"
}
Usage
Treat SubtitleCollapsingToolbarLayout
just like a regular
CollapsingToolbarLayout
.
<androidx.coordinatorlayout.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.appbar.SubtitleCollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentScrim="?colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:subtitle="Papua, Indonesia"
app:title="Raja Ampat">
<!-- collapsing toolbar content goes here -->
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
app:layout_collapseMode="pin"/>
</android.support.design.widget.SubtitleCollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<!-- content goes here -->
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Material Design 3
SubtitleCollapsingToolbarLayout
will automatically switch to Material Design 3
style by using Theme.Material3.*
in your app, no configuration needed.
By default, medium style is applied. To use large style, reference an attribute
subtitleCollapsingToolbarLayoutLargeStyle
in your XML.
<com.google.android.material.appbar.SubtitleCollapsingToolbarLayout
style="?attr/subtitleCollapsingToolbarLayoutLargeStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>