调整“浮动操作”按钮（fab）的图标大小 [英] Adjust icon size of Floating action button (fab)

问题描述

新的浮动操作按钮应为 56dp x 56dp strong>，并且其中的图标应为 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

 <涟漪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-操作按钮

解决方案

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

The new floating action button should be 56dp x 56dp and the icon inside it should be 24dp x 24dp. So the space between icon and button should be 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>

And this is the result I get:

I used the icon from \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

How to make the size of the icon inside the button be exactly as described in guidelines ?

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

解决方案

As your content is 24dp x 24dp you should use 24dp icon. And then set android:scaleType="center" in your ImageButton to avoid auto resize.

这篇关于调整“浮动操作”按钮（fab）的图标大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！