Điều chỉnh kích thước biểu tượng của Floating nút hành động (fab)

Question

Nút hành động nổi mới nên 56dp x 56dp và biểu tượng bên trong nó nên 24dp x 24dp. Do đó, khoảng cách giữa biểu tượng và nút phải là 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> 

Và đây là kết quả tôi nhận được:

tôi đã sử dụng các biểu tượng từ \ tài liệu thiết kế-icon-1.0.0 \ nội dung \ drawable-hdpi \ ic_add_black_48dp.png
https://github.com/google/material-design-icons/releases/tag/1.0.1

Cách tạo kích thước của biểu tượng bên trong nút là chính xác như được mô tả trong nguyên tắc?

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

Answer 1

Vì nội dung của bạn là 24dp x 24dp, bạn nên sử dụng 24dp icon. Và sau đó đặt android:scaleType="center" trong ImageButton của bạn để tránh tự động thay đổi kích thước.

Answer 2

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

Với nền mà bạn cung cấp nó kết quả trong nút bên dưới trên điện thoại của tôi (Nexus 7 2012)

Trông tốt với tôi.

Answer 3

Make cụm từ này trong dimens

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

Đây 36dp là kích thước biểu tượng trên nút dấu chấm động. Điều này sẽ đặt kích thước 36dp cho tất cả các biểu tượng cho nút tác vụ nổi.

cập nhật Như mỗi nhận xét

Nếu bạn muốn thiết lập kích thước biểu tượng để đặc biệt Floating Nút hành động sau đó bạn phải đi với Floating nút hành động thuộc tính như ứng dụng: fabSize = "bình thường" và android: scaleType =" trung tâm".

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

Các hướng dẫn thiết kế định nghĩa hai kích cỡ và trừ khi có một lý do mạnh mẽ để đi chệch khỏi bằng cách sử dụng, kích thước có thể được kiểm soát với các thuộc tính fabSize XML của các thành phần FloatingActionButton.

Xem xét quy định cụ thể bằng cách sử dụng app:fabSize="normal" hoặc app:fabSize="mini", ví dụ .:

<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

Như FAB là như ImageView do đó, bạn có thể sử dụng scaleType thuộc tính để thay đổi kích thước biểu tượng tương tự như vậy ImageView. Mặc định scaleType cho một FAB là fitCenter.Bạn có thể sử dụng center và centerInside để tạo biểu tượng nhỏ và lớn tương ứng.

Tất cả các giá trị cho thuộc tính scaleType là - center, centerCrop, centerInside, fitCenter, fitEnd, fitStart, fitXY và matrix.

Xem https://developer.android.com/reference/android/widget/ImageView.ScaleType.html để biết thêm chi tiết.

Answer 6

tắt của @ IRadha của câu trả lời trong vector thiết android:height="_dp" và thiết lập các loại quy mô android:scaleType="center" drawable đặt drawable đến bất cứ kích thước đã được thiết lập