【问题标题】:Extra padding around Floating Action Button Android浮动操作按钮 Android 周围的额外填充
【发布时间】:2016-12-10 15:03:07
【问题描述】:

我正在尝试在 Android 中创建个人资料页面。我正在使用浮动操作按钮来显示用户图片。

最初我想显示默认图片。

我的 xml 代码是这样的:

<android.support.design.widget.FloatingActionButton
    android:layout_height="100dp"
    android:layout_width="100dp"
    android:id="@+id/userIcon"
    app:fabSize="normal"
    android:src="@drawable/male_icon"
    app:pressedTranslationZ="12dp"
    app:layout_anchor="@id/app_bar"
    app:layout_anchorGravity="bottom|center" />

我的问题是为什么 FAB 周围有一些额外的空间。我不能删除那个空间/填充吗?

已编辑:

这是我的完整 xml 代码::

<android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_width="match_parent"
    android:layout_height="@dimen/app_bar_height"
    android:fitsSystemWindows="true"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/toolbar_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        android:background="@drawable/background"
        app:contentScrim="#2678AD"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin"
            app:popupTheme="@style/AppTheme.PopupOverlay" />
    </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>

<include layout="@layout/content_scrolling" />

<android.support.design.widget.FloatingActionButton
    android:layout_height="100dp"
    android:layout_width="100dp"
    android:id="@+id/userIcon"
    app:fabSize="normal"
    android:src="@drawable/male_icon"
    app:pressedTranslationZ="12dp"
    app:layout_anchor="@id/app_bar"
    app:layout_anchorGravity="bottom|center" />

【问题讨论】:

  • 你可以给边距像:android:layout_marginEnd="7dp" android:layout_marginBottom="10dp"

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


【解决方案1】:

你可能想要将 scaletype 属性更改为 center。喜欢,

android:scaleType="center"

【讨论】:

    【解决方案2】:

    您可以通过让图标变大来移除多余的填充。这样您就可以将图标设置为浮动操作按钮的大小。

        app:maxImageSize="40dp"
    

    或者你想给它的任何尺寸。

    【讨论】:

      【解决方案3】:

      在布局文件中将属性高程设置为 0。因为它采用默认高程。

       app:elevation="0dp"
      

      现在在活动中检查 API 级别是否大于 21 并在需要时设置海拔。

      if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
              fabBtn.setElevation(10.0f);
          }
      

      【讨论】:

        【解决方案4】:

        因为您使用的是相反的 app:fabSize="normal" 。改成app:fabSize="mini"

        【讨论】:

        • 谢谢,非常适合我的要求。最好提一下app:fabCustomSize="your custom fab size" 属性。
        【解决方案5】:

        我认为这是边距,而不是填充。尝试以编程方式进行:

        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
                RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) floatingActionButton.getLayoutParams();
                params.setMargins(0, 0, 0, 0); 
                floatingActionButton.setLayoutParams(params);
            }
        

        或者尝试将 FloatingActionButton 放入 CoordinatorLayout,如下面的示例:

        <?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"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
        
            <android.support.design.widget.FloatingActionButton
                android:id="@+id/bt_ok"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="right"
                android:layout_marginRight="10dp"
                app:backgroundTint="@color/primary"
                app:borderWidth="0dp"
                app:fabSize="mini"/>
        </android.support.design.widget.CoordinatorLayout>
        

        【讨论】:

        • 嘿@Huy,尝试务实地解决它,但没有帮助。并且 FAB 在一个坐标布局内
        • 请张贴你完整的xml,尺寸值:)
        • 你试过用android:scaleType="center"吗?将布局宽度和高度设置为 wrap_content 并添加 fabsize 属性。
        【解决方案6】:

        试试这个:

        app:borderWidth="0dp"
        

        您还可以使用高程移除阴影

        app:elevation="6dp"
        

        看到这个link.

        如果它不起作用,那么尝试像这样管理轮廓阴影:

        Button fab = (Button) rootView.findViewById(R.id.fabbutton);
        
            Outline mOutlineCircle;
            int shapeSize = getResources().getDimensionPixelSize(R.dimen.shape_size);
            mOutlineCircle = new Outline();
            mOutlineCircle.setRoundRect(0, 0, shapeSize, shapeSize, shapeSize / 2);
        
            fab.setOutline(mOutlineCircle);
            fab.setClipToOutline(true);
        

        【讨论】:

        • 嘿@sagar,感谢您的回复,但没有帮助!
        • 我也在 android 5.1.1 上测试过。结果相同:|
        • 并确保您使用的是最新版本的设计依赖项
        猜你喜欢
        • 1970-01-01
        • 2017-04-16
        • 2015-08-17
        • 2017-11-13
        • 2018-11-20
        • 1970-01-01
        • 2013-07-31
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多