在视图边缘的浮动行动按钮阴影剪报

问题描述 投票:17回答:4

我有一个浮动动作按钮锚定在协调器布局的右下角。它距离视图的边距是16dp(默认情况下包含边距并在dimens.xml文件中指定),但它的阴影是剪切并且具有方形外观(见下文)。当我从视图的边缘移动浮动操作按钮到32dp时,其阴影正确显示。

我已经尝试设置其高程属性(android:elevation="5dp"),但这似乎没有任何效果。我也尝试将borderWidth属性设置为0(app:borderWidth="0dp"),但也没有效果。

浮动动作按钮的行为是否有这样的原因?

XML

<android.support.design.widget.CoordinatorLayout
    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:id="@+id/coordinator_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity">

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/create_floating_action_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_create_white_48dp"
        app:layout_anchor="@id/coordinator_layout"
        app:layout_anchorGravity="bottom|right" />

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

图片

FAB 16dp from the margin. FAB 32dp from the margin.

android android-layout shadow floating-action-button
4个回答
28
投票

问题是父剪裁阴影。查找剪切阴影的父级(不一定是层次结构中的下一个)并将其添加到xml中的视图。

android:clipChildren="false"

我一直在测试这个正在删除并将该行添加到剪切视图的父级并且工作正常。

添加其他容器或更改边距是我不建议的解决方法。这太贴碎了。迷你工厂具有不同的容器尺寸,并且根据API级别(<21或> = 21)需要不同的尺寸。


9
投票

有类似的问题。做两件事:

  1. android.support.design.widget.CoordinatorLayout删除android:paddingRight="@dimen/activity_horizontal_margin"android:paddingBottom="@dimen/activity_vertical_margin"
  2. android.support.design.widget.FloatingActionButton添加android:layout_marginRight="@dimen/activity_horizontal_margin"android:layout_marginBottom="@dimen/activity_horizontal_margin"

由于解释= FAB没有显示阴影的地方,因此,你没有完全看到它。


1
投票

我也有同样的问题。但为了FAB,我不能只丢掉我的保证金价值。所以我在层次结构中添加了另一个层,这有助于我将FAB准确放置在我想要的位置,而不会破坏父级。所以现在我为了CoordinatorLayout而在CoordinatorLayout里面有一个FAB。以下是我修改过的布局文件。

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/ddd"
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:background="@drawable/tile"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.CoordinatorLayout
        android:id="@+id/fff"
        android:padding="10dp"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ScrollView
            android:id="@+id/scroll_container"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <!-- All my views under a LinearLayout parent -->

        </ScrollView>

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

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fabAdd"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="Add Text"
        android:visibility="visible"
        android:layout_margin="10dp"
        app:backgroundTint="@color/primary"
        app:layout_anchor="@+id/fff"
        app:layout_anchorGravity="bottom|right|end"/>

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

0
投票

我已将此添加到父视图中:

android:clipToPadding="false"
© www.soinside.com 2019 - 2024. All rights reserved.