2015-06-19 26 views
17

Ist es möglich, die DrawableLeft in einem Android-Button zu tönen? Ich habe einen schwarzen Drawable, den ich gerne weiß färben würde. Ich weiß, wie man dies mit einer Bildansicht (Bild links) erreicht, aber ich möchte dies mit der Standard-Android-Schaltfläche tun.Android Button Drawable Tint

enter image description here

Mein Quellcode:

<Button android:layout_height="wrap_content" 
     android:layout_width="0dp" 
     android:layout_weight="1" 
     android:text="@string/drawer_quizzes" 
     android:backgroundTint="@color/md_light_green_500" 
     android:stateListAnimator="@null" 
     android:textColor="#fff" 
     android:textSize="12dp" 
     android:fontFamily="sans-serif" 
     android:drawableLeft="@drawable/ic_action_landscape" 
     android:gravity="left|center_vertical" 
     android:drawablePadding="8dp" 
     /> 

Gibt es eine Möglichkeit, die Taste tönen? Oder gibt es eine benutzerdefinierte Ansichtsmethode, um diesen Effekt zu erzielen?

+0

Sie möchten also ein Bild auf der linken Seite des Textes in der Schaltfläche platzieren? –

+0

@HawraaKhalil ja, genau. Aber es sollte weiß getönt werden –

+1

Stimmen Sie hier https://code.google.com/p/android/issues/detail?id=198613, wenn Sie möchten, dass drawableTint in Support-Bibliothek gehen –

Antwort

38

können Sie erreichen auf einer Schaltfläche mit dieser Methode der drawableleft Färbung:

Schritt 1: erstellen ziehbar Ressource-Datei mit Bitmap als Element Eltern wie unten und Namen als ic_action_landscape.xml unter dem ziehbar Ordner gezeigt

<?xml version="1.0" encoding="utf-8"?> 
<bitmap xmlns:android="http://schemas.android.com/apk/res/android" 
    android:src="@android:drawable/ic_btn_speak_now" 
    android:tint="@color/white" /> 

Schritt 2: erstellen Sie Ihr Button-Steuerelement in Ihrem Layout wie unten

<Button 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:backgroundTint="@color/md_light_green_500" 
     android:drawableLeft="@drawable/ic_action_landscape" 
     android:drawablePadding="8dp" 
     android:fontFamily="sans-serif" 
     android:gravity="left|center_vertical" 
     android:stateListAnimator="@null" 
     android:text="@string/drawer_quizzes" 
     android:textColor="#fff" 
     android:textSize="12dp" /> 

Die Schaltfläche ruft den Zeichensatz aus dem Zeichensatzordner ic_action_landscape.xml aus dem Zeichenordner statt @android: Zeichen- oder Zeichenpng (en) ab.

Methode 2:
Schritt 1:
Sie können sogar das Symbol als Aktionsleiste und Tab-Symbole mit dem Vordergrund als Bild hinzufügen, die von einem benutzerdefinierten Speicherort oder einer Clipart importiert werden können

Schritt 2:
Unter Theme Dropdown wählen Sie Benutzerdefinierte

Schritt 3:
Dann die Farbe als #FFFFFF in der Vordergrundfarbe Auswahl wählen. Method 2 Pictorial representation

Beenden Sie den Assistenten, um das Bild hinzuzufügen, und fügen Sie dann das Zeichen als Bild hinzu.

Pictorial representation for answer to the question

+0

Danke, ich benutze die erste Methode jetzt da ich auch gerne das (schwarze) Icon in anderen Teilen der UI benutzen würde. –

+14

Beachten Sie jedoch, dass das Tint-Attribut nur seit Lollipop unterstützt wird. Für die Vor-Lollipop-Unterstützung habe ich den folgenden Code verwendet, um die Schaltfläche programmgesteuert auszuzeichnen: 'Drawable [] drawables = postButton.getCompoundDrawables(); \t \t \t Drawable wrapDrawable = DrawableCompat.wrap (Zeichensatz [0]); \t \t \t DrawableCompat.setTint (wrapDrawable, getResources(). GetColor (android.R.color.white)); ', unter Verwendung der support-v4-Bibliothek. – Boris

+0

Es scheint, Methode 1 funktioniert nur für Standard-Icons (von Android). Wenn wir ein neues Symbol auf unseren Ressourcen hinzufügen, funktioniert es nicht an meinem Ende. Nur eine Notiz. – vida

1

Als @Boris vorgeschlagen, können Sie die Support-Bibliothek verwenden.

Ich habe den AppCompatButton mit einigen draft code erweitert. Die TintAppCompatButton sollte Standardverhalten haben, aberTintAppCompatButtonCustom wurde gemacht, um benutzerdefinierte Färbung zu demonstrieren.

Ich werde sehen, ob ich eine PR erheben kann, um das in die offizielle Support-Bibliothek zu bekommen.

Der Code von Interesse ist:

private void init() { 
    PorterDuff.Mode tintMode = PorterDuff.Mode.SRC_IN; 
    Drawable[] ds = getCompoundDrawables(); 
    tint(ds[LEFT], Color.RED, tintMode); 
    tint(ds[TOP], Color.YELLOW, tintMode); 
    tint(ds[RIGHT], Color.GREEN, tintMode); 
    tint(ds[BOTTOM], Color.BLUE, tintMode); 
} 

private void tint(Drawable d, int color, PorterDuff.Mode tintMode) { 
    TintInfo ti = new TintInfo(); 
    ti.mTintMode = tintMode; 
    ti.mTintList = ColorStateList.valueOf(color); 
    ti.mHasTintList = true; 
    ti.mHasTintMode = true; 

    TintManager.tintDrawable(d, ti, new int[]{0}); 
} 
1

ich so spät sein kann, aber wenn Sie C# verwenden, können Sie es auf diese Weise tun:

Color iconColor = Color.Orange; // TODO: Get from settings 
Mode mode = Mode.SrcAtop; 

Drawable drawable = ResourcesCompat.GetDrawable(Resources, Resource.Drawable.ic_action_arrest, null); 

drawable.SetColorFilter(iconColor, mode); 

Sie werden auch brauchen :

using Android.Graphics; 
using static Android.Graphics.PorterDuff; 
using Android.Graphics.Drawables; 

Hoffe, dass dies hilft. Es ist der einfachste Weg, den ich gefunden habe. Beachten Sie auch, dass an jedem Ort in Ihrer App, an dem Sie dieses Symbol verwenden, diese Farbe angezeigt wird.

0

Ich weiß, dass es bereits viele Antworten gibt, aber keiner von ihnen hat mich glücklich gemacht, da ich keine unterschiedlichen Zeichen für verschiedene Stile von Elementen haben wollte.

So war meine Lösung Farbfilter in Konstruktor wie folgt festgelegt:

int textColor = getTextColors().getColorForState(EMPTY_STATE_SET, Color.WHITE); 
    Drawable[] drawables = getCompoundDrawablesRelative(); 
    for (Drawable drawable : drawables) { 
     if(drawable != null) { 
      drawable.setColorFilter(textColor, PorterDuff.Mode.SRC_ATOP); 
     } 
    } 

I Textfarbe verwendet, weil das war, was ich brauche, aber es kann mit benutzerdefinierten Attribut ersetzt werden mehr dinamic zu sein.