如何在滚动视图顶部添加浮动操作按钮
How to add floating action button on top of scrollview
我有一个浮动操作按钮,我想将其添加到滚动视图的顶部,这样即使您滚动,该按钮也会保留。我希望它位于滚动视图的顶部和屏幕的右下角。我需要使用什么视图组合来完成此操作?
这是 xml 文件:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:fab="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.nhscoding.safe2tell.STORIES"
android:background="@color/stor_back">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
>
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/pink_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_icon="@drawable/ic_add"
fab:fab_colorNormal="@color/fab_back"
fab:fab_colorPressed="@color/fab_pressed_back"
android:layout_gravity="end"
android:layout_marginBottom="16dp"
android:layout_marginRight="16dp"/>
</LinearLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card1_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title1"
/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view2"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
android:layout_below="@id/card_view1">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card2_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
/>
<TextView
android:id="@+id/info_text2"
android:layout_marginTop="16dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view3"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
android:layout_below="@id/card_view2">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card3_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
/>
<TextView
android:id="@+id/info_text3"
android:layout_marginTop="16dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="wrap_content"
android:layout_height="match_parent"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card4_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title4"
/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="16dp"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card5_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title5"
/>
</android.support.v7.widget.CardView>
</LinearLayout>
</ScrollView>
</RelativeLayout>
试试这个:
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:fab="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.nhscoding.safe2tell.STORIES"
android:background="@color/stor_back">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card1_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title1" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view2"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
android:layout_below="@id/card_view1">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card2_title"
android:textSize="@dimen/card_title_size"
android:gravity="top" />
<TextView
android:id="@+id/info_text2"
android:layout_marginTop="16dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view3"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
android:layout_below="@id/card_view2">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card3_title"
android:textSize="@dimen/card_title_size"
android:gravity="top" />
<TextView
android:id="@+id/info_text3"
android:layout_marginTop="16dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card4_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title4" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="16dp"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card5_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title5" />
</android.support.v7.widget.CardView>
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="bottom"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:layout_margin="10dp">
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/pink_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_icon="@drawable/ic_add"
fab:fab_colorNormal="@color/fab_back"
fab:fab_colorPressed="@color/fab_pressed_back"
android:layout_gravity="end"
android:layout_marginBottom="16dp"
android:layout_marginRight="16dp" />
</LinearLayout>
</RelativeLayout>
RelativeLayout
中较晚的 children 倾向于漂浮在 RelativeLayout
中较早的 children。
(我说"tend to"是因为Android5.0的elevation
东西也有作用,它们之间的关系是ill-defined)
因此,要让浮动操作按钮 (FAB) 浮动在 RelativeLayout
中的 ScrollView
上,请确保 ScrollView
首先在 [=33= 中定义],后面是 FAB。这不会影响 X/Y 规则,但它应该使 FAB 出现在 Z 轴上的 ScrollView
上方。
如果您只支持 Android 5.0+,另一种可能性是使用 android:elevation
本身来提高 FAB。
您可以使用 android.support.design.widget.CoordinatorLayout
作为父布局。
制作两个 xml 一个,您可以在其中设置滚动条或列表。
另一个是父容器,它包含您的 FloatingActionButton
.
的全部信息
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=".MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
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/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
app:elevation="6dp"
app:backgroundTint="@color/colorAccent"
app:pressedTranslationZ="12dp"
android:layout_margin="@dimen/fab_margin"
android:src="@drawable/ic_add" />
</android.support.design.widget.CoordinatorLayout>
content_main.xml
在这里你可以放置你的ScrollBar。很简单。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
android:gravity="center"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:showIn="@layout/activity_main"
tools:context=".MainActivity">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card1_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title1" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view2"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
android:layout_below="@id/card_view1">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card2_title"
android:textSize="@dimen/card_title_size"
android:gravity="top" />
<TextView
android:id="@+id/info_text2"
android:layout_marginTop="16dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view3"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
android:layout_below="@id/card_view2">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card3_title"
android:textSize="@dimen/card_title_size"
android:gravity="top" />
<TextView
android:id="@+id/info_text3"
android:layout_marginTop="16dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card4_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title4" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="16dp"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card5_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title5" />
</android.support.v7.widget.CardView>
</LinearLayout>
</ScrollView>
</RelativeLayout>
以相对布局为基础。在该滚动视图中,然后 浮动操作按钮(alignParent Right 和 Bottom 设置为 true)。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_height="match_parent"
android:layout_width="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:text="Your content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</ScrollView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:src="@drawable/ic_add"
android:layout_margin="16dp"/>
</RelativeLayout>
BR 马蒂亚斯
我有一个浮动操作按钮,我想将其添加到滚动视图的顶部,这样即使您滚动,该按钮也会保留。我希望它位于滚动视图的顶部和屏幕的右下角。我需要使用什么视图组合来完成此操作?
这是 xml 文件:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:fab="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.nhscoding.safe2tell.STORIES"
android:background="@color/stor_back">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
>
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/pink_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_icon="@drawable/ic_add"
fab:fab_colorNormal="@color/fab_back"
fab:fab_colorPressed="@color/fab_pressed_back"
android:layout_gravity="end"
android:layout_marginBottom="16dp"
android:layout_marginRight="16dp"/>
</LinearLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card1_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title1"
/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view2"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
android:layout_below="@id/card_view1">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card2_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
/>
<TextView
android:id="@+id/info_text2"
android:layout_marginTop="16dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view3"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
android:layout_below="@id/card_view2">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card3_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
/>
<TextView
android:id="@+id/info_text3"
android:layout_marginTop="16dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="wrap_content"
android:layout_height="match_parent"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card4_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title4"
/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="16dp"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card5_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title5"
/>
</android.support.v7.widget.CardView>
</LinearLayout>
</ScrollView>
</RelativeLayout>
试试这个:
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:fab="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.nhscoding.safe2tell.STORIES"
android:background="@color/stor_back">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card1_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title1" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view2"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
android:layout_below="@id/card_view1">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card2_title"
android:textSize="@dimen/card_title_size"
android:gravity="top" />
<TextView
android:id="@+id/info_text2"
android:layout_marginTop="16dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view3"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
android:layout_below="@id/card_view2">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card3_title"
android:textSize="@dimen/card_title_size"
android:gravity="top" />
<TextView
android:id="@+id/info_text3"
android:layout_marginTop="16dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card4_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title4" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="16dp"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card5_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title5" />
</android.support.v7.widget.CardView>
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="bottom"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:layout_margin="10dp">
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/pink_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_icon="@drawable/ic_add"
fab:fab_colorNormal="@color/fab_back"
fab:fab_colorPressed="@color/fab_pressed_back"
android:layout_gravity="end"
android:layout_marginBottom="16dp"
android:layout_marginRight="16dp" />
</LinearLayout>
</RelativeLayout>
RelativeLayout
中较晚的 children 倾向于漂浮在 RelativeLayout
中较早的 children。
(我说"tend to"是因为Android5.0的elevation
东西也有作用,它们之间的关系是ill-defined)
因此,要让浮动操作按钮 (FAB) 浮动在 RelativeLayout
中的 ScrollView
上,请确保 ScrollView
首先在 [=33= 中定义],后面是 FAB。这不会影响 X/Y 规则,但它应该使 FAB 出现在 Z 轴上的 ScrollView
上方。
如果您只支持 Android 5.0+,另一种可能性是使用 android:elevation
本身来提高 FAB。
您可以使用 android.support.design.widget.CoordinatorLayout
作为父布局。
制作两个 xml 一个,您可以在其中设置滚动条或列表。
另一个是父容器,它包含您的 FloatingActionButton
.
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=".MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
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/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
app:elevation="6dp"
app:backgroundTint="@color/colorAccent"
app:pressedTranslationZ="12dp"
android:layout_margin="@dimen/fab_margin"
android:src="@drawable/ic_add" />
</android.support.design.widget.CoordinatorLayout>
content_main.xml
在这里你可以放置你的ScrollBar。很简单。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
android:gravity="center"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:showIn="@layout/activity_main"
tools:context=".MainActivity">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card1_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title1" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view2"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
android:layout_below="@id/card_view1">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card2_title"
android:textSize="@dimen/card_title_size"
android:gravity="top" />
<TextView
android:id="@+id/info_text2"
android:layout_marginTop="16dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view3"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius"
android:layout_below="@id/card_view2">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card3_title"
android:textSize="@dimen/card_title_size"
android:gravity="top" />
<TextView
android:id="@+id/info_text3"
android:layout_marginTop="16dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="@dimen/card_margin_bottom"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card4_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title4" />
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="@dimen/card_margin_top"
android:layout_marginBottom="16dp"
android:layout_marginLeft="@dimen/card_margin_left"
android:layout_marginRight="@dimen/card_margin_right"
card_view:cardCornerRadius="@dimen/card_radius">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/card_title_top"
android:layout_marginBottom="@dimen/card_title_bottom"
android:layout_marginLeft="@dimen/card_title_left"
android:layout_marginRight="@dimen/card_title_right"
android:text="@string/card5_title"
android:textSize="@dimen/card_title_size"
android:gravity="top"
android:id="@+id/title5" />
</android.support.v7.widget.CardView>
</LinearLayout>
</ScrollView>
</RelativeLayout>
以相对布局为基础。在该滚动视图中,然后 浮动操作按钮(alignParent Right 和 Bottom 设置为 true)。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_height="match_parent"
android:layout_width="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:text="Your content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</ScrollView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:src="@drawable/ic_add"
android:layout_margin="16dp"/>
</RelativeLayout>
BR 马蒂亚斯