调整浮动操作按钮（fab）的图标大小

Question

新的浮动操作按钮应为 56dp x 56dp ，其中的图标应为 24dp x 24dp 。因此，图标和按钮之间的空间应为 16dp 。

<ImageButton
    android:id="@+id/fab_add"
    android:layout_width="56dp"
    android:layout_height="56dp"
    android:layout_gravity="bottom|right"
    android:layout_marginBottom="16dp"
    android:layout_marginRight="16dp"
    android:background="@drawable/ripple_oval"
    android:elevation="8dp"
    android:src="@drawable/ic_add_black_48dp" />

ripple_oval.xml     

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?android:colorControlHighlight">
    <item>
        <shape android:shape="oval">
            <solid android:color="?android:colorAccent" />
        </shape>
    </item>
</ripple>

这是我得到的结果：

我使用了 \ material-design-icons-1.0.0 \ content \ drawable-hdpi \ ic_add_black_48dp.png 中的图标 https://github.com/google/material-design-icons/releases/tag/1.0.1

如何使按钮内的图标大小 完全，如指南所述？

http://www.google.com/design/spec/components/buttons.html#buttons-floating-action-button

Answer 1

由于您的内容为24dp x 24dp，因此您应使用24dp icon。然后在ImageButton中设置android:scaleType="center"以避免自动调整大小。

Answer 2

在尺寸

中输入此条目

<!--Floating action button-->
<dimen name="design_fab_image_size" tools:override="true">36dp</dimen>

这里36dp是浮点按钮上的图标大小。这将为浮动操作按钮的所有图标设置36dp大小。

按评论更新

如果您想将图标大小设置为特定的浮动操作按钮，请使用浮动操作按钮属性，例如app：fabSize =“normal”和android：scaleType =“center”。

  <!--app:fabSize decides size of floating action button You can use normal, auto or mini as per need-->
  app:fabSize="normal" 

  <!--android:scaleType decides how the icon drawable will be scaled on Floating action button. You can use center(to show scr image as original), fitXY, centerCrop, fitCenter, fitEnd, fitStart, centerInside.-->
  android:scaleType="center"

Answer 3

在将支持库更新到v28.0.0后，尝试使用app:maxImageSize="56dp"代替上述答案

Answer 4

设计指南定义了两种尺寸，除非有充分的理由偏离使用它们，否则可以使用fabSize组件的FloatingActionButton XML属性控制尺寸。

考虑使用app:fabSize="normal"或app:fabSize="mini"指定，例如：

<android.support.design.widget.FloatingActionButton
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:src="@drawable/ic_done_white_24px"
   app:fabSize="mini" />

Answer 5

<ImageButton
        android:background="@drawable/action_button_bg"
        android:layout_width="56dp"
        android:layout_height="56dp"
        android:padding="16dp"
        android:src="@drawable/ic_add_black_48dp"
        android:scaleType="fitXY"
        android:elevation="8dp"/>

使用您提供的背景，我的设备（Nexus 7 2012）上的按钮会产生

对我来说很好看。

Answer 6

您的目标是什么？

如果将图标图像尺寸设置为更大：

1. 确保图像尺寸大于目标尺寸(so you can set max image size for your icon)

2. 我的目标图标图像大小为 84dp ，晶圆厂大小为 112dp ：

   <android.support.design.widget.FloatingActionButton
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_gravity="center"
       android:src= <image here>
       app:fabCustomSize="112dp"
       app:fabSize="auto"
       app:maxImageSize="84dp" />
   

Answer 7

如果您使用的是androidx 1.0.0，并且使用的是自定义晶圆厂尺寸，则必须使用

指定自定义尺寸

app:fabCustomSize="your custom size in dp"

默认情况下，大小为56dp，还有另一个变化是小型fab，大小为40dp，如果您使用任何东西，则必须指定它才能正确计算填充

Answer 8

自定义FAB具有三个关键的XML属性：

• app:fabSize：“迷你”（40dp），“正常”（56dp）（默认）或“自动”
• app:fabCustomSize：这将决定FAB的总体大小。
• app:maxImageSize：这将决定图标的大小。

---

示例：

app:fabCustomSize="64dp" 
app:maxImageSize="32dp"

FAB填充（图标和背景圆圈之间的间距，又称为波纹）是通过以下方式隐式计算的：

4-edge padding = (fabCustomSize - maxImageSize) / 2.0 = 16

---

请注意，可以通过通常的android:margin xml标签属性来设置晶圆厂的边距。

Answer 9

您可以使用FloatingActionButton的以下设置进行播放：android：scaleType和app：maxImageSize。对于我来说，如果android：scaleType =“ centerInside”和app：maxImageSize =“ 56dp”，我将获得理想的结果。

Answer 10

使用 ExtendedFloatingActionButton，这为我解决了这个问题：

app:iconSize="<x>dp"

我尝试了 iconPadding 或 fabCustomSize，但似乎没有任何变化

Answer 11

您可以使用以下方法轻松设置 FAB 图标大小

<块引用>

final FloatingActionButton button = new FloatingActionButton(context);

button.setCustomSize(50);