将浮动动作按钮水平放置在彼此旁边

时间:2016-02-23 19:04:04

标签: android xml floating-action-button

我目前有2个浮动动作按钮,看起来像这样......

enter image description here

我希望按钮之间有一个小空间,但我似乎无法实现这一点......

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"
    tools:context=".MainActivity">

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#7c7c7c"
        android:focusable="true"
        android:focusableInTouchMode="true">

        <android.support.v7.widget.RecyclerView
            android:id="@+id/recycler_view"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_alignParentLeft="true"
            android:layout_below="@+id/relContainer"
            android:background="@drawable/bordershadow2"
            android:paddingBottom="17dp"
            android:paddingLeft="@dimen/activity_horizontal_margin"
            android:paddingRight="@dimen/activity_horizontal_margin"
            android:paddingTop="10dp" />

        <RelativeLayout
            android:id="@+id/relContainer"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/bordershadow"
            android:paddingLeft="@dimen/activity_horizontal_margin"
            android:paddingRight="@dimen/activity_horizontal_margin"
            android:paddingTop="@dimen/activity_vertical_margin">

            <TableLayout
                android:id="@+id/purchaseTableLayout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:paddingBottom="7dp"
                android:paddingTop="7dp"
                android:stretchColumns="0,1,2">

                <TableRow
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:weightSum="2">

                    <TextView
                        android:id="@+id/textView1"
                        android:layout_width="0dp"
                        android:layout_height="match_parent"
                        android:layout_weight="1"
                        android:gravity="center_vertical"
                        android:paddingLeft="2dp"
                        android:singleLine="true"
                        android:text="@string/purchaseText"
                        android:textColor="#000"
                        android:textSize="24sp"
                        android:textStyle="bold" />

                    <TextView
                        android:id="@+id/textView2"
                        android:layout_width="0dp"
                        android:layout_height="match_parent"
                        android:layout_weight="1"
                        android:gravity="center_vertical"
                        android:paddingLeft="2dp"
                        android:singleLine="true"
                        android:textColor="#000"
                        android:textSize="@dimen/title_size"
                        android:textStyle="bold" />


                </TableRow>
            </TableLayout>

            <EditText
                android:id="@+id/searchEditText"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/purchaseTableLayout"
                android:layout_centerHorizontal="true"
                android:digits="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ'() "
                android:hint="Search"
                android:imeOptions="actionDone"
                android:singleLine="true" />

            <TableLayout
                android:id="@+id/tableLayout"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/searchEditText"
                android:paddingBottom="7dp"
                android:paddingTop="7dp"
                android:stretchColumns="0,1,2">

                <TableRow
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:weightSum="3.0">

                    <Spinner
                        android:id="@+id/sortRaceSpinner"
                        style="@style/SortSpinner"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1.0"
                        android:entries="@array/sort_race_array"
                        android:textSize="@dimen/title_size" />

                    <Spinner
                        android:id="@+id/sortAffinitySpinner"
                        style="@style/SortSpinner"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1.0"
                        android:entries="@array/sort_affinity_array"
                        android:textSize="@dimen/title_size" />

                    <Spinner
                        android:id="@+id/sortSpinner"
                        style="@style/SortSpinner"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1.0"
                        android:entries="@array/sort_array"
                        android:textSize="@dimen/title_size" />
                </TableRow>
            </TableLayout>
        </RelativeLayout>


    </RelativeLayout>



    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="top|right"
        android:layout_margin="@dimen/fab_margin"
        android:src="@drawable/ic_payment" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="top"
        android:layout_margin="@dimen/fab_margin"
        android:src="@android:drawable/ic_dialog_info"
        app:backgroundTint="#F44336"
        app:layout_anchor="@id/fab"
        app:layout_anchorGravity="top" />

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

我不确定,但它可能与我正在使用的RelativeLayouts有关。

修改

预览看起来不错

enter image description here

然而,我手机上仍然不合适......

enter image description here

1 个答案:

答案 0 :(得分:3)

您可以在LinearLayout

中移动它们
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="@dimen/fab_margin"
            android:layout_gravity="top|right">

            <android.support.design.widget.FloatingActionButton
                 android:id="@+id/fabPayment"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_marginRight="10dp"
                 android:src="@drawable/ic_payment" />

            <android.support.design.widget.FloatingActionButton
                 android:id="@+id/fabInfo"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:src="@drawable/ic_info_outline"
                 app:backgroundTint="#F44336" />  

       </LinearLayout>