Regola le dimensioni dell'icona del pulsante di azione mobile (fab)

Il nuovo pulsante di azione mobile dovrebbe essere 56dp x 56dp e l'icona al suo interno dovrebbe essere 24dp x 24dp . Quindi lo spazio tra icona e pulsante dovrebbe essere 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>

E questo è il risultato che ottengo:

ho usato l'icona di \ 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

Come rendere la dimensione dell'icona all'interno del pulsante esattamente come descritto nelle linee guida?

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

Poiché il contenuto è 24dp x 24dp, è necessario utilizzare l'icona 24dp . E quindi imposta il android:scaleType="center"tuo ImageButton per evitare il ridimensionamento automatico.

Fai questa voce in dimens

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

Qui 36dp è la dimensione dell'icona sul pulsante a virgola mobile. Questo imposterà la dimensione di 36dp per tutte le icone per il pulsante di azione mobile.

Aggiornamenti come da commenti

Se desideri impostare la dimensione dell'icona su un particolare pulsante di azione mobile, seleziona gli attributi del pulsante di azione mobile come app: fabSize = "normale" e 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"

Prova a utilizzare app:maxImageSize="56dp"invece delle risposte sopra riportate dopo aver aggiornato la libreria di supporto alla v28.0.0

Esistono tre attributi XML chiave per FAB personalizzati:

• app:fabSize: "Mini" (40dp), "normale" (56dp) (impostazione predefinita) o "auto"
• app:fabCustomSize: Questo deciderà la dimensione complessiva del FAB.
• app:maxImageSize: Questo deciderà la dimensione dell'icona.

Esempio:

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

Il padding FAB (lo spazio tra l'icona e il cerchio di sfondo, aka ripple ) è calcolato implicitamente da:

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

Si noti che i margini del fab possono essere impostati dalle normali android:marginproprietà del tag xml.

Le linee guida di progettazione definiscono due dimensioni e, a meno che non vi sia un motivo valido per discostarsi dall'uso di entrambe, la dimensione può essere controllata con l' fabSizeattributo XML del FloatingActionButtoncomponente.

Prendi in considerazione di specificare utilizzando app:fabSize="normal"o app:fabSize="mini", ad esempio:

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

Con lo sfondo che hai fornito, si ottiene il pulsante qui sotto sul mio dispositivo (Nexus 7 2012)

Mi sembra buono.

Qual è il tuo obiettivo?

Se imposta la dimensione dell'immagine dell'icona su una più grande:

1. Assicurati di avere una dimensione dell'immagine più grande della dimensione target (so you can set max image size for your icon)

2. La dimensione dell'immagine dell'icona di destinazione è 84 dpi e la dimensione fab è 112 dpi :

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

Se stai usando androidx 1.0.0 e stai usando una dimensione fab personalizzata, dovrai specificare la dimensione personalizzata usando

app:fabCustomSize="your custom size in dp"

Per sorda la dimensione è 56dp e c'è un'altra variazione che è la fab di piccole dimensioni che è 40dp, se stai usando qualcosa dovrai specificarlo affinché il padding sia calcolato correttamente

Così FABcom'è ImageViewPuoi usare l' scaleTypeattributo per cambiare allo stesso modo la dimensione dell'icona ImageView. L'impostazione predefinita scaleTypeper a FABè fitCenter. È possibile utilizzare centere centerInsideper rendere l'icona piccola e grande rispettivamente.

Tutti i valori per l' scaleTypeattributo sono - center, centerCrop, centerInside, fitCenter, fitEnd, fitStart, fitXYe matrix.

Vedi https://developer.android.com/reference/android/widget/ImageView.ScaleType.html per maggiori dettagli.

al di fuori della risposta di @ IRadha in un'impostazione di disegno vettoriale android:height="_dp" e impostando il tipo di scala per android:scaleType="center" impostare il disegno su qualsiasi dimensione impostata

Puoi giocare con le seguenti impostazioni di FloatingActionButton: android: scaleType e app: maxImageSize. Per quanto mi riguarda, ho un risultato desiderabile se android: scaleType = "centerInside" e app: maxImageSize = "56dp".