LoginSignup
4
4

More than 5 years have passed since last update.

Fabを上下2つに表示する

Last updated at Posted at 2016-12-06

こんな簡単なことができず、意外とハマってしまいました。とりあえず動いたのでメモ。

test.png

Basic Activityを選択してプロジェクト作成

Create_New_Project.png

activity_main.xmlを開く

view(id=space)のandroid:layout_height="150dp"
この150dpの部分がFAB間のスペースになる。

activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="jp.co.test.doublefab.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

    </android.support.design.widget.AppBarLayout>

    <include layout="@layout/content_main" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/bottom"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end|bottom"
        android:layout_margin="@dimen/fab_margin"
        android:src="@android:drawable/ic_dialog_email" />

    <View
        android:id="@+id/space"
        android:layout_width="1dp"
        android:layout_height="150dp"
        app:layout_anchor="@id/bottom"
        app:layout_anchorGravity="top|right|end" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/top"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        app:layout_anchor="@id/space"
        app:layout_anchorGravity="top|right|end"
        android:layout_margin="@dimen/fab_margin"
        app:srcCompat="@android:drawable/ic_dialog_email" />

</android.support.design.widget.CoordinatorLayout>

MainActivity.java

   FloatingActionButton topFab = (FloatingActionButton) findViewById(R.id.top);
        FloatingActionButton bottomFab = (FloatingActionButton) findViewById(R.id.bottom);

        topFab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Snackbar.make(view, "上のFABがクリックされた", Snackbar.LENGTH_LONG)
                        .setAction("Action", null).show();
            }
        });

        bottomFab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Snackbar.make(view, "下のFABがクリックされた", Snackbar.LENGTH_LONG)
                        .setAction("Action", null).show();
            }
        });

4
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
4