在Scrollview上浮动操作按钮?

时间:2017-04-14 16:34:37

标签: java android xml string algorithm

我正在修改我的应用程序,以便更多地关注" Material Design-ey",但是在FAB遇到了麻烦。我有一个带有两个浮动操作按钮的滚动视图:

当我滚动到底部时,FAB会覆盖我的内容。我希望能够在底部滚动一点,这样FAB可以align_parent_bottom而不会重叠:

Picture speaks a thousand words :)(应该能够滚动一点FAB以便在下面对齐)

enter image description here(向下滚动之前)

如何在向下滚动到最大后让我的应用底部创建额外空间让FAB休息?

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#68d9cc">

    <ScrollView

        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fillViewport="true">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#68d9cc">



    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorPrimary"
        android:elevation="20dp"
        android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

        <ImageView
            android:layout_height="match_parent"
            android:layout_width="wrap_content"
            android:id="@+id/back"

            android:onClick="cancel"

            android:src="@drawable/ic_arrow_back_black_24dp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Test example"
            android:textSize="22sp"
            android:id="@+id/header"
            android:textColor="@color/textColorPrimary"
            android:layout_gravity="center"
            android:paddingRight="10dp"
            />


    </android.support.v7.widget.Toolbar>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:id="@+id/linear"
        android:layout_marginBottom="55dp"
        android:layout_below="@+id/textView12"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="20sp"
            android:textColor="@android:color/black"
            android:layout_below="@+id/textView12"

            android:text="textview:"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true" />

        <EditText
            android:id="@+id/editText"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/textView4"
            android:layout_alignBottom="@+id/textView4"

            android:layout_toEndOf="@+id/textView4"
            android:layout_toRightOf="@+id/textView4"
            android:imeOptions="actionDone"
            android:inputType="text" />
    </LinearLayout>

    <ListView
        android:id="@+id/listview"
        android:layout_width="wrap_content"
        android:choiceMode="singleChoice"
        android:layout_height="300dp"
        android:layout_below="@+id/toolbar"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:elevation="9dp">

    </ListView>

    <TextView
        android:id="@+id/textView12"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="78dp"
        android:gravity="center_horizontal"
        android:text="textview"
        android:textColor="#000000"
        android:textSize="18sp"
        android:layout_below="@+id/listview"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

</RelativeLayout>

</ScrollView>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/cancel"
        android:onClick="cancel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:clickable="true"
        app:fabSize="normal"
        app:srcCompat="@drawable/ic_close_black_24dp"
        />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/done"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:clickable="true"
        app:fabSize="normal"
        app:srcCompat="@drawable/ic_done_black_24dp"
        />

    </RelativeLayout>

1 个答案:

答案 0 :(得分:0)

如果你正如你所提到的那样瞄准Material Design,那么不鼓励那样放置那些浮动动作按钮。在右侧将它们叠放在一起,或者在点击时打开多个迷你FAB。

我可以想到一个简单的修复方法是将paddingBottom添加到你的布局中,这样就会有更多的“内容”,它会向上滚动更多。

如果您还没有,我会阅读本节。

https://material.io/guidelines/components/buttons-floating-action-button.html#