Skip to content

hanggrian/collapsingtoolbarlayout-subtitle

Repository files navigation

Travis CI Codecov Maven Central Nexus Snapshot Android SDK

SubtitleCollapsingToolbarLayout

Material preview. Material You preview.

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

Material3 medium style. Material3 large style.

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"/>