【问题标题】:Floating Action Button not showing up on top浮动操作按钮未显示在顶部
【发布时间】:2015-06-23 07:38:39
【问题描述】:

我目前正在尝试制作一个浮动操作按钮,但由于某种原因,它一直在我的 recylerView 下呈现该按钮。我试过弄乱layout order、elevation,甚至尝试在java代码中使用.bringToFront()方法。

Activity_main

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:id="@+id/drawer"
    android:layout_width="match_parent" android:fitsSystemWindows="true"
    android:layout_height="match_parent">

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

        <include android:id="@+id/toolbar_actionbar"
            layout="@layout/toolbar_default"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

        <include
            android:id="@+id/fab_layout"
            layout="@layout/fab_layout"
            android:layout_width="@dimen/fab_button_diameter"
            android:layout_height="@dimen/fab_button_diameter"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true" />

        <FrameLayout android:id="@+id/container"
           android:layout_width="match_parent"
           android:clickable="true" android:layout_height="match_parent"
           android:layout_below="@+id/toolbar_actionbar">

        <android.support.v7.widget.RecyclerView
           android:id="@+id/cardList"
           android:layout_width="match_parent"
           android:layout_height="match_parent" />

    </FrameLayout>

</RelativeLayout>

<!-- android:layout_marginTop="?android:attr/actionBarSize"-->
<com.android.expresso.expresso.ScrimInsetsFrameLayout android:id="@+id/scrimInsetsFrameLayout"
    android:layout_width="@dimen/navigation_drawer_width"
    android:layout_height="wrap_content"
    android:fitsSystemWindows="true"
    android:layout_gravity="start"
    app:insetForeground="#4000"
    android:elevation="10dp">
    <fragment android:id="@+id/fragment_drawer"
        android:name="com.android.expresso.expresso.NavigationDrawerFragment"
        android:layout_width="@dimen/navigation_drawer_width"
        android:layout_height="match_parent" android:fitsSystemWindows="true"
        app:layout="@layout/fragment_navigation_drawer" />
</com.android.expresso.expresso.ScrimInsetsFrameLayout>

Fab_layout

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">

    <ImageButton
        android:id="@+id/fab_image_button"
        android:layout_width="@dimen/fab_button_diameter"
        android:layout_height="@dimen/fab_button_diameter"
        android:background="@drawable/fab_shape"
        android:src="@drawable/btn_order_hub"/>

</FrameLayout>

【问题讨论】:

  • 切换到官方 FloatingActionButton。您可以使用官方 NavigationView 更改 ScrimInsetsFrameLayout。
  • 谢谢,可能是一个愚蠢的疏忽,但我似乎无法通过 xml 使用浮动操作按钮...我需要导入一些特殊的东西吗?

标签: android xml android-layout floating-action-button recyclerview-layout


【解决方案1】:

fab_layout 应该是 xml 中的最后一个视图。绘图按 xml 顺序绘制 - 您正在绘制 FAB,然后其他视图(容器)覆盖 FAB

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

    <include android:id="@+id/toolbar_actionbar"
        layout="@layout/toolbar_default"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <FrameLayout android:id="@+id/container"
       android:layout_width="match_parent"
       android:clickable="true" android:layout_height="match_parent"
       android:layout_below="@+id/toolbar_actionbar">

        <android.support.v7.widget.RecyclerView
           android:id="@+id/cardList"
           android:layout_width="match_parent"
           android:layout_height="match_parent" />

        <include
            android:id="@+id/fab_layout"
            layout="@layout/fab_layout"
            android:layout_width="@dimen/fab_button_diameter"
            android:layout_height="@dimen/fab_button_diameter"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true" />

    </FrameLayout>
</RelativeLayout>

【讨论】:

  • FAB 也应该有高度,这将使它在相关设备上“位于顶部”。
  • 是的,但是 Matthew Steinhardt 没有在任何地方使用 elevation,所以所有内容都将使用 elevation=0dp 绘制。如果他只使用elevation 而不在elevation 将不会受到尊重,并且视觉效果会像现在一样。但它也是使用海拔高度的好主意。请注意,在全新的设计库中有来自 Google 的 FAB,请查看 this link
猜你喜欢
  • 2016-06-08
  • 2016-11-09
  • 1970-01-01
  • 2022-06-25
  • 2017-10-13
  • 2020-12-18
  • 1970-01-01
  • 1970-01-01
  • 2015-10-23
相关资源
最近更新 更多