Android Master/Detail - 将 FAB 锚定在单窗格或多窗格上

Question

我希望像 Gmail 应用程序那样在平板电脑上显示两个窗格时将浮动操作按钮 (FAB) 锚定到主窗格（参见附图），但无法使用 Master/Detail Android Studio 中的模板。

默认行为是在单窗格或多窗格模式下将 FAB 显示在屏幕的 bottom/right 上。

我尝试将 FAB 从 activity_item_list.xml 移动到包含 RecyclerView 的布局，但这会导致详细信息窗格无法在多窗格模式下显示。

是否可以使用主从模板中的布局将 FAB 也显示锚定到主模板，或者是否有必要从头开始并可能使用多个片段和活动？

下面是 item_list 的更改布局，现在包含 FAB。我在模板中原来的内容上添加了一个 RelativeLayout 和 FAB。

<LinearLayout 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:layout_marginLeft="16dp"
    android:layout_marginRight="16dp"
    android:baselineAligned="false"
    android:divider="?android:attr/dividerHorizontal"
    android:orientation="horizontal"
    android:showDividers="middle"
    tools:context=".ItemListActivity">

    <!-- This layout is a two-pane layout for the Items master/detail flow.-->

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.v7.widget.RecyclerView xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:tools="http://schemas.android.com/tools"
            android:id="@+id/item_list"
            android:name=".ItemListFragment"
            android:layout_width="@dimen/item_width"
            android:layout_height="match_parent"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            app:layoutManager="LinearLayoutManager"
            tools:context=".ItemListActivity"
            tools:listitem="@layout/item_list_content" />

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

    <FrameLayout
        android:id="@+id/item_detail_container"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="3" />

</LinearLayout>

Answer 1

问题出在布局上。添加第二个相对布局并将细节放置在母版右侧解决了这个问题。

<LinearLayout 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:layout_marginLeft="16dp"
    android:layout_marginRight="16dp"
    android:baselineAligned="false"
    android:divider="?android:attr/dividerHorizontal"
    android:orientation="horizontal"
    android:showDividers="middle"
    tools:context=".ItemListActivity">

    <!--This layout is a two-pane layout for the Items master/detail flow.-->
    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent">

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:id="@+id/item_list_master">

        <android.support.v7.widget.RecyclerView xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:tools="http://schemas.android.com/tools"
            android:id="@+id/item_list"
            android:name=".ItemListFragment"
            android:layout_width="@dimen/item_width"
            android:layout_height="match_parent"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            app:layoutManager="LinearLayoutManager"
            tools:context=".ItemListActivity"
            tools:listitem="@layout/item_list_content" />

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_margin="@dimen/fab_margin"
            android:layout_alignRight="@id/item_list"
            android:src="@android:drawable/ic_dialog_email" />

    </RelativeLayout>
        <FrameLayout
            android:id="@+id/item_detail_container"
            android:layout_width="400dp"
            android:layout_height="match_parent"
            android:layout_toRightOf="@+id/item_list_master"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true" />

    </RelativeLayout>
</LinearLayout>

Android Master/Detail - 将 FAB 锚定在单窗格或多窗格上

Android Master/Detail - have FAB anchored to master on single or multi pane

android

master-detail

android-layout

floating-action-button