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

Question

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

androidmaterial-designfloating-action-buttonmaterial-components-androidandroid-icons

219

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

Floating button

<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

- vovahost

可能是重复的问题：https://stackoverflow.com/a/59455009/3974530 - InsaneCat

14个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Daniel Dube · Answer 1

在 @IRadha 的答案基础上，通过在矢量图设置中使用 android:height="_dp" 并将比例类型设置为 android:scaleType="center"，可以将可绘制对象设置为所设置的任意大小。

- J.Stange · Answer 2

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

app:iconSize="<x>dp"

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

- VIVek · Answer 3

您可以通过以下方式轻松设置FAB图标的大小：

final FloatingActionButton button = new FloatingActionButton(context);

button.setCustomSize(50);

- Sertan · Answer 4

    android:id="@+id/floatingActionButton3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:clickable="true"
    app:backgroundTint="#FBFAFA"
    app:fabCustomSize="70dp"
    app:fabSize="mini"
    app:maxImageSize="84dp"
    app:srcCompat="@drawable/resim"
    app:tint="#E81C1C"
    tools:layout_editor_absoluteX="325dp"
    tools:layout_editor_absoluteY="517dp" />

我是这样处理的