将Collapsing Toolbar从MaterialComponents迁移至Material3遇问题求助

问题现象 #

切换到Material3主题后，原有的Collapsing Toolbar布局出现两个异常：

• 未折叠状态下无法显示标题
• 向上滚动时整个Toolbar完全消失

解决方案 #

1. 替换Toolbar组件并更新主题引用 #

将布局中的androidx.appcompat.widget.Toolbar替换为Material3适配的MaterialToolbar，同时把AppBarLayout和Toolbar的主题切换为Material3的Overlay样式，避免AppCompat与Material3主题冲突：

修改后的布局关键部分：

<com.google.android.material.appbar.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="@dimen/detail_backdrop_height"
    android:fitsSystemWindows="true"
    android:theme="@style/ThemeOverlay.Material3.Dark.ActionBar">

    <com.google.android.material.appbar.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        app:contentScrim="?attr/colorPrimary"
        app:expandedTitleMarginEnd="64dp"
        app:expandedTitleMarginStart="48dp"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <!-- ImageView部分保持不变 -->

        <com.google.android.material.appbar.MaterialToolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin"
            app:popupTheme="@style/ThemeOverlay.Material3.Light" />

    </com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>

2. 修正主题属性适配Material3规范 #

Material3废弃了colorPrimaryVariant和colorPrimaryDark属性，需要替换为对应的Material3属性：

• colorPrimaryVariant → colorPrimaryContainer
• colorPrimaryDark → 若用于状态栏，可使用colorSurfaceVariant或根据设计需求调整

修改后的styles.xml：

<style name="Theme.DesignDemo" parent="Base.Theme.DesignDemo"></style>

<style name="Base.Theme.DesignDemo" parent="Theme.Material3.DayNight.NoActionBar">
    <item name="colorPrimaryContainer">#ff0000</item>
    <item name="colorSurfaceVariant">#00ffff</item>
    <!-- 其他颜色属性保持不变 -->
</style>

3. 调整标题设置逻辑 #

确保CollapsingToolbarLayout的标题设置在setSupportActionBar之后，无需直接给Toolbar设置标题，让CollapsingToolbarLayout接管标题显示：

修改后的Activity onCreate代码：

setContentView(R.layout.activity_detail)

val intent = intent
val cheeseName = intent.getStringExtra(EXTRA_NAME)
val toolbar: com.google.android.material.appbar.MaterialToolbar = findViewById(R.id.toolbar)

setSupportActionBar(toolbar)
supportActionBar?.setDisplayHomeAsUpEnabled(true)

val collapsingToolbar: CollapsingToolbarLayout = findViewById(R.id.collapsing_toolbar)
collapsingToolbar.title = cheeseName
// 确保标题功能启用（默认已启用，可显式设置避免异常）
collapsingToolbar.isTitleEnabled = true

4. 验证滚动行为配置 #

确认CollapsingToolbarLayout的layout_scrollFlags为scroll|exitUntilCollapsed，NestedScrollView的layout_behavior为@string/appbar_scrolling_view_behavior，这两个配置是保证滚动时Toolbar固定的关键，原代码已正确配置，无需修改。

内容的提问来源于stack exchange，提问作者Philipp