CollapseMode
是 Android 中用于定義折疊面板(如 CollapsingToolbarLayout
)的展開和折疊狀態的屬性。要實現 CollapseMode
的動畫效果,你可以使用以下方法:
CollapseMode
首先,在 XML 布局文件中為 CollapsingToolbarLayout
設置 CollapseMode
。例如,將其設置為 PIN
或 PARALLAX
:
<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"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="200dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
app:srcCompat="@drawable/your_image" />
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin"/>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
在上面的示例中,app:layout_collapseMode="pin"
將 Toolbar
固定在頂部,即使內容折疊也不會移動。
2. 使用代碼控制動畫
如果你想要更復雜的動畫效果,可以使用代碼來控制 CollapsingToolbarLayout
的展開和折疊。例如,你可以使用 animate()
方法來添加一個平滑的過渡效果:
CollapsingToolbarLayout collapsingToolbar = findViewById(R.id.collapsing_toolbar);
// 展開動畫
collapsingToolbar.animate()
.translationY(0) // 從當前位置移動到頂部
.setDuration(500) // 動畫持續時間(毫秒)
.start();
// 折疊動畫
collapsingToolbar.animate()
.translationY(-collapsingToolbar.getHeight()) // 從頂部移動到底部
.setDuration(500) // 動畫持續時間(毫秒)
.start();
請注意,上述代碼示例假設你已經將 CollapsingToolbarLayout
的 layout_height
設置為大于其內容的值,以便在展開和折疊時能看到動畫效果。
通過結合 XML 布局和代碼控制,你可以實現各種 CollapseMode
動畫效果,以滿足你的應用需求。