Android Master / Detail - 让FAB在单个或多个窗格

时间:2016-04-14 06:02:10

标签: android android-layout floating-action-button master-detail

我想在平板电脑上显示两个窗格(例如Gmail应用程序)时将浮动操作按钮(FAB)锚定到主窗格,但是无法使用主/详细信息对此功能进行编码Android Studio中的模板。

默认行为是在单窗格或多窗格模式下将FAB显示在屏幕的右下角。

我已尝试将FAB从activity_item_list.xml移至包含RecyclerView的布局,但这会导致详细信息窗格无法以多窗格模式显示。

是否可以使用主 - 详细信息模板中的布局将FAB显示锚定到主控制器,还是必须从头开始并且可能使用多个片段和活动?

Showing FAB moving to be anchored to the list pane

下面是现在包含FAB的item_list的更改布局。我在模板中最初添加了一个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>

1 个答案:

答案 0 :(得分:0)

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

<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>