Android-Bottom Sheet 動畫特效(R.style)

如果常在使用手機因該有看過以下特效
此範例最大關鍵在於入場動畫、離場動畫與位置

首先在 res 底下建立 anim
入場動畫 popup_show.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromYDelta="100%p"
        android:toYDelta="0"
        android:duration="300"
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"/>
</set>

離場動畫 popup_hide.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromYDelta="0"
        android:toYDelta="100%p"
        android:duration="300"
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"/>
</set>

動畫設置
參考資料 : Android的Activity屏幕切换动画(二)-左右滑动深入与实战

風格設置

<!-- BottomSheetDialog 風格修改 -->
<style name="MaterialDialogSheet" parent="@android:style/Theme.Dialog">
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:backgroundDimEnabled">true</item>
    <item name="android:windowIsFloating">false</item>
    <item name="android:windowAnimationStyle">@style/MaterialDialogSheetAnimation</item>
</style>

<!-- 出入場動畫 -->
<style name="MaterialDialogSheetAnimation">
    <item name="android:windowEnterAnimation">@anim/popup_show</item>
    <item name="android:windowExitAnimation">@anim/popup_hide</item>
</style>

將 Dialog 套此風格就可以完成我們的主題

Dialog dialog = new Dialog(mContext, R.style.MaterialDialogSheet);

參考資料 : BottomSheet
參考資料 : Android How to implement Bottom Sheet from Material Design docs


參考資料 : MaterialDialogBottomSheet
( 簡易型 )

歡迎轉載，請註明出處。