読者です 読者をやめる 読者になる 読者になる

kojiko-android’s blog

開発中にハマった時の解決策や、忘れがちなことを残しておきます。

FloatingActionButtonを、Snackbarと連動して動かす方法

Android Studio

Snackbarの表示に合わせてFloatingActionButtonを上下させる方法です

 スナックバーを表示したときに、ボトムに配置したフローティングアクションボタン(以下、FAB)と重ならないように、これらを連動させて動かすには、CoordinatorLayout内にFABを配置して、Snackbarのmakeメソッドの第一引数にCoordinatorLayoutを指定することで実現できます。

1.CoordinatorLayoutの子のビューとして、FABを配置します。
 <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <view
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            class="android.support.design.widget.CoordinatorLayout"
            android:id="@+id/coordinator" >
        <view
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            class="android.support.design.widget.FloatingActionButton"
            android:id="@+id/fab"
            android:layout_gravity="bottom|right"/>
        </view>
</FrameLayout>

 レイアウトエディター上で、ビューをコーディネーターレイアウトにドロップしても入れ子にできないようなので、xmlに記述します。

2.コードからスナックバーを呼び出すときの第一引数に、コーディネーターレイアウトを指定します。
CoordinatorLayout coordinatorLayout = (CoordinatorLayout)findViewById(R.id.coordinator);

Snackbar.make(coordinatorLayout,"TEXT",Snackbar.LENGTH_LONG).show(); 

 Android 4.xでも問題なく動作します。
 
 マテリアルデザインのガイドラインでは、より柔軟に、各コンポーネントにアニメーションを持たせるように案内されていますが、
とりあえずスナックバーとFABの連動は上記の方法で実装できます。