ปรับขนาดไอคอนของปุ่มการกระทำลอยตัว (fab)

ใหม่ปุ่มการกระทำลอยควรจะ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

ในฐานะที่เป็นเนื้อหาของคุณ 24dp x 24dp คุณควรใช้24dp ไอคอน จากนั้นตั้งค่าandroid:scaleType="center"ใน ImageButton ของคุณเพื่อหลีกเลี่ยงการปรับขนาดอัตโนมัติ

ทำรายการนี้เป็นมิติ

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

ที่นี่ 36dp คือขนาดไอคอนบนปุ่มจุดลอย สิ่งนี้จะตั้งขนาด 36dp สำหรับไอคอนทั้งหมดสำหรับปุ่มการกระทำแบบลอย

ปรับปรุงตามความคิดเห็น

หากคุณต้องการตั้งค่าขนาดไอคอนเป็นปุ่มการกระทำแบบลอยตัวโดยเฉพาะให้ไปกับแอตทริบิวต์ปุ่มการกระทำแบบลอยตัวเช่นแอป: fabSize = "ปกติ" และ Android: scaleType = "ศูนย์"

  <!--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"

ลองใช้app:maxImageSize="56dp"แทนคำตอบข้างต้นหลังจากคุณอัปเดตไลบรารีสนับสนุนเป็น v28.0.0

มีสามแอตทริบิวต์ XML ที่สำคัญสำหรับ FAB ที่กำหนดเอง:

• app:fabSize: อาจเป็น "มินิ" (40dp), "ปกติ" (56dp) (ค่าเริ่มต้น) หรือ "อัตโนมัติ"
• app:fabCustomSize: นี่จะเป็นตัวตัดสินขนาด FAB โดยรวม
• app:maxImageSize: นี่จะเป็นตัวกำหนดขนาดของไอคอน

ตัวอย่าง:

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

ช่องว่างภายใน FAB (ช่องว่างระหว่างไอคอนและวงกลมพื้นหลังหรือที่รู้จักกันในชื่อripple ) ถูกคำนวณโดยนัยโดย:

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

โปรดทราบว่าระยะขอบของ fab สามารถตั้งค่าได้โดยandroid:marginคุณสมบัติแท็ก xml ปกติ

แนวทางการออกแบบกำหนดสองขนาดและหากไม่มีเหตุผลที่ชัดเจนในการเบี่ยงเบนจากการใช้อย่างใดอย่างหนึ่งขนาดสามารถควบคุมได้ด้วยfabSizeคุณลักษณะ XML ของFloatingActionButtonส่วนประกอบ

พิจารณาการระบุโดยใช้อย่างใดอย่างหนึ่ง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" />

<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)

ดูดีกับผม.

เป้าหมายของคุณคืออะไร

หากตั้งค่าขนาดภาพไอคอนเป็นใหญ่กว่า:

1. ตรวจสอบให้แน่ใจว่ามีขนาดภาพใหญ่กว่าขนาดเป้าหมายของคุณ (so you can set max image size for your icon)

2. ขนาดภาพไอคอนเป้าหมายของฉันคือ84dpและขนาด fab คือ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" />

หากคุณใช้ androidx 1.0.0 และกำลังใช้ขนาด fab ที่กำหนดเองคุณจะต้องระบุขนาดที่กำหนดเองโดยใช้

app:fabCustomSize="your custom size in dp"

โดย deafult ขนาดคือ 56dp และมีรูปแบบอื่นที่เป็น fab ขนาดเล็กซึ่งเป็น 40dp ถ้าคุณใช้อะไรคุณจะต้องระบุให้ padding ถูกคำนวณอย่างถูกต้อง

อย่างที่FABเป็นImageViewเพื่อให้คุณสามารถใช้แอตทริบิวต์การเปลี่ยนขนาดไอคอนเช่นเดียวกันscaleType ImageViewเริ่มต้นscaleTypeสำหรับเป็นFAB fitCenterคุณสามารถใช้centerและcenterInsideเพื่อทำให้ไอคอนเล็กและใหญ่ตามลำดับ

ค่าทั้งหมดสำหรับscaleTypeแอตทริบิวต์ - และcenter, centerCrop, centerInside, fitCenter, fitEnd, fitStart, fitXYmatrix

ดู https://developer.android.com/reference/android/widget/ImageView.ScaleType.htmlสำหรับรายละเอียดเพิ่มเติม

ออกจากคำตอบของ @ IRadha ในการตั้งค่า drawable เวกเตอร์android:height="_dp" และการตั้งค่าชนิดสเกลเพื่อandroid:scaleType="center" ตั้งค่า drawable ให้เป็นขนาดใดก็ได้

คุณสามารถเล่นกับการตั้งค่าต่อไปนี้ของ FloatingActionButton: android: scaleType และ app: maxImageSize สำหรับฉันฉันได้ผลลัพธ์ที่พึงประสงค์ถ้า android: scaleType = "centerInside" และแอพ: maxImageSize = "56dp"