FloatingActionButton con testo anziché immagine

Question

Sto cercando di capire come può essere modificato FloatingActionButton dalla libreria di supporto Android. Può essere usato con il testo anziché l'immagine?

Qualcosa di simile a questo:

vedo estende ImageButton quindi non credo. Ho ragione?

È corretto in termini di design dei materiali in generale?

Answer 1

Grazie a tutti.

Qui è facile soluzione che ho trovato per questa domanda. Funziona correttamente per Android 4+, per Android 5+ viene aggiunto parametro specifico Android: elevation per disegnare TextView su FloatingActionButton.

<FrameLayout 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_gravity="bottom|right"> 

    <android.support.design.widget.FloatingActionButton 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:src="@android:color/transparent" /> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center" 
     android:text="@android:string/ok" 
     android:elevation="16dp" 
     android:textColor="@android:color/white" 
     android:textAppearance="?android:attr/textAppearanceMedium" /> 
</FrameLayout> 

Answer 2

Non è possibile impostare il testo per FloatingActionButton dalla libreria di supporto, ma ciò che si può fare è creare un'immagine di testo direttamente da Android Studio: File -> New -> Image Asset e quindi utilizzarlo per il proprio pulsante.

Nei termini di Materiale Design; non hanno menzionato l'utilizzo del testo con FloatingActionButton e non vedo alcun motivo per farlo poiché non si ha molto spazio per un testo.

Answer 3

convertire un testo in bitmap e utilizzarlo. è super facile.

fab.setImageBitmap(textAsBitmap("OK", 40, Color.WHITE)); 

//method to convert your text to image 
public static Bitmap textAsBitmap(String text, float textSize, int textColor) { 
    Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG); 
    paint.setTextSize(textSize); 
    paint.setColor(textColor); 
    paint.setTextAlign(Paint.Align.LEFT); 
    float baseline = -paint.ascent(); // ascent() is negative 
    int width = (int) (paint.measureText(text) + 0.0f); // round 
    int height = (int) (baseline + paint.descent() + 0.0f); 
    Bitmap image = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888); 

    Canvas canvas = new Canvas(image); 
    canvas.drawText(text, 0, baseline, paint); 
    return image; 
} 

Answer 4

I FAB vengono solitamente utilizzati in CoordinatorLayout s. È possibile utilizzare questo:

<android.support.design.widget.CoordinatorLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto"> 

    <android.support.design.widget.FloatingActionButton 
      android:id="@+id/fab" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_gravity="bottom|end" 
      android:layout_margin="@dimen/fab_margin"    
      app:backgroundTint="@color/colorPrimary" /> 

     <TextView android:layout_height="wrap_content" 
       android:layout_width="wrap_content" 
       android:text="OK" 
       android:elevation="6dp" 
       android:textSize="18dp" 
       android:textColor="#fff" 
       app:layout_anchor="@id/fab" 
       app:layout_anchorGravity="center"/> 

</android.support.design.widget.CoordinatorLayout> 

Questo è ciò che fa il lavoro

app:layout_anchor="@id/fab" 
app:layout_anchorGravity="center" 

Risultato:

Se stai usando un po 'di layout_behavior per la FAB, ti fare un simile layout_behavior per il TextView

Answer 5

mi è stato bisogno di testo in un FAB, ma invece ho appena andato con un TextView con un background disegnabile circolare:

<TextView 
     android:layout_margin="10dp" 
     android:layout_gravity="right" 
     android:gravity="center" 
     android:background="@drawable/circle_background" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:textColor="#FFF" 
     android:textStyle="bold" 
     android:fontFamily="sans-serif" 
     android:text="AuthId" 
     android:textSize="15dp" 
     android:elevation="10dp"/> 

Ecco drawable (circle_backgroung.xml):

<?xml version="1.0" encoding="utf-8"?> 
<shape 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="oval"> 

<solid 
    android:color="#666666"/> 

<size 
    android:width="60dp" 
    android:height="60dp"/> 
</shape>