android: drawableLeft Rand und / oder Polsterung


Antworten:


464

Wie Cephus erwähnt, android:drawablePaddingwird das Auffüllen zwischen dem Text und dem Zeichenelement nur erzwungen, wenn die Schaltfläche klein genug ist.

Wenn Sie größere Tasten auslegen, können Sie diese android:drawablePaddingin Verbindung mit android:paddingLeftund verwendenandroid:paddingRight auslegen, , um den Text zu erzwingen und nach innen zur Mitte der Schaltfläche zu zeichnen. Durch getrenntes Anpassen der linken und rechten Polsterung können Sie sehr detaillierte Anpassungen am Layout vornehmen.

Hier ist eine Beispielschaltfläche, bei der der Text und das Symbol durch Auffüllen enger zusammengedrückt werden als standardmäßig:

<Button android:text="@string/button_label" 
    android:id="@+id/buttonId"
    android:layout_width="160dip"
    android:layout_height="60dip"
    android:layout_gravity="center"
    android:textSize="13dip"
    android:drawableLeft="@drawable/button_icon"
    android:drawablePadding="2dip"
    android:paddingLeft="30dip"
    android:paddingRight="26dip"
    android:singleLine="true"
    android:gravity="center" />  

21
android: paddingLeft = "30dip" android: paddingRight = "26dip" sind hier der Schlüssel!
Igor Ganapolsky

4
Dies hat nichts mit der Frage zu tun, aber Android: Schwerkraft = "Mitte" hält den Text mit der Mitte des Zeichens ausgerichtet!
cwhsu

1
Was ist, wenn wir links und rechts Drawables haben und nur rechts Drawable anpassen müssen?
nmxprime

Ich benutze nur: android: paddingLeft, und es ändert die Position des Bildes. android: drawablePadding wird für den Abstand zwischen Bild und Text verwendet.
Tapferer

Das Problem dieses Codes ist, dass die passwordToggleDrawablelinke Auffüllungslücke größer wird, da kein spezifisches Ziel nur für die linke Zeichnung festgelegt werden kann.
Obst

184

TextView hat eine android: drawablePadding- Eigenschaft, die den Trick machen sollte:

android: drawablePadding

Der Abstand zwischen den Zeichen und dem Text.

Muss ein Dimensionswert sein, bei dem es sich um eine Gleitkommazahl handelt, an die eine Einheit wie "14.5sp" angehängt ist. Verfügbare Einheiten sind: px (Pixel), dp (dichteunabhängige Pixel), sp (skalierte Pixel basierend auf der bevorzugten Schriftgröße), in (Zoll), mm (Millimeter).

Dies kann auch ein Verweis auf eine Ressource (in der Form "@ [Paket:] Typ: Name") oder ein Themenattribut (in der Form "? [Paket:] [Typ:] Name") sein, die einen Wert dieses Typs enthält .

Dies entspricht dem globalen Attribut Ressourcensymbol drawablePadding.


61

android:drawablePaddingEs wird nur dann eine Polsterlücke zwischen dem Text und dem Zeichenobjekt erstellt, wenn die Schaltfläche klein genug ist, um die beiden zusammenzudrücken. Wenn Ihre Schaltfläche breiter als die kombinierte Breite (für drawableLeft / drawableRight) oder Höhe (für drawableTop / drawableBottom) ist, führt drawablePadding nichts aus.

Ich kämpfe gerade auch damit. Meine Schaltflächen sind ziemlich breit und das Symbol hängt am linken Rand der Schaltfläche und der Text ist in der Mitte zentriert. Meine einzige Möglichkeit, dies zu umgehen, bestand darin, einen Rand auf dem Zeichenelement zu backen, indem ich mit Photoshop leere Pixel am linken Rand der Leinwand hinzufügte. Nicht ideal und auch nicht wirklich zu empfehlen. Aber das ist meine Stop-Gap-Lösung für den Moment, kurz bevor TextView / Button neu erstellt wird.


Danke, dass du mein Problem erklärt hast. Ich habe nicht
bemerkt

Ich habe das gleiche Problem. Mein Knopf ist breit, so dass das Zeichen nicht nahe am Text ist
Milad Faridnia

yay es hat funktioniert danke
dave o grady

43

Ja. Verwenden Sie drawablePadding wie folgt:

<TextView
        android:id="@+id/tvHeader"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Settings and Contents"
        android:drawableLeft="@drawable/icon_success"
        android:drawablePadding="10dp" />

37

Machen Sie Ihre zeichnbare resources.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true">
        <inset android:drawable="@drawable/small_m" android:insetLeft="10dp" android:insetTop="10dp" />
    </item>
    <item>
        <inset android:drawable="@drawable/small_p" android:insetLeft="10dp" android:insetTop="10dp" />
    </item>
</selector>

2
@ The Finest Artist Ich habe Inset in Drawable verwendet und es funktioniert gut für Geräte der neueren Version. Ich meine, es funktioniert nicht in SDK 16, 17, sondern in SDK 23. Gibt es eine Idee?
Bhavin Chauhan


Schöne Antwort und positive Abstimmung dafür. Sie helfen mir nur, ein Problem zu lösen, das mich lange Zeit verwirrt hat.
Anthonyeef

34

android:drawablePaddingDies ist der einfachste Weg, um einem zeichnbaren Symbol eine Polsterung zu geben. Sie können jedoch keine bestimmte einseitige Polsterung wie paddingRightoder paddingLefteines zeichnbaren Symbols angeben. Um dies zu erreichen, müssen Sie sich damit befassen. Und wenn Sie sich bewerben paddingLeftoder paddingRightauf Edittext, wird die Polsterung Edittextzusammen mit dem zeichnbaren Symbol vollständig platziert.


12

Definieren Sie eine Form für Ihren Edittext und geben Sie ihm zum Beispiel eine Polsterung

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <padding
        android:left="5dp"
        android:right="5dp"
    />
    <solid android:color="#F6F6F6" />
    <stroke
        android:width="1px"
        android:color="#C3C3C3" />

    <corners
        android:bottomLeftRadius="1dp"
        android:bottomRightRadius="1dp"
        android:topLeftRadius="1dp"
        android:topRightRadius="1dp" />
</shape>

Die in dieser Form definierte Polsterung hilft dabei, die Zeichnung links oder rechts zu polieren. ---------------------- Wenden Sie diese Form auf EditView an

 <EditText
            android:id="@+id/example"
            android:layout_width="fill_parent"
            android:layout_height="36dp"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:background="@drawable/shape2"
            android:drawableLeft="@drawable/icon1"
            android:drawablePadding="@dimen/txtDrwblPadding"
            android:ems="10"
         />

Wenn Sie diese definierte Form als Hintergrund verwenden, erhält Ihr EditText einen Stil plus Rand für drawableLeft.


12

android: drawablePadding ist der einfachste Weg, dem zeichnbaren Symbol eine Polsterung zu geben, aber Sie können keine bestimmte einseitige Polsterung wie paddingRight oder paddingLeft of drawable icon geben. Um dies zu erreichen, müssen Sie sich damit befassen. Wenn Sie paddingLeft oder paddingRight auf Edittext anwenden, wird das gesamte Edittext zusammen mit dem Zeichensymbol aufgefüllt.

<TextView android:layout_width="match_parent"
    android:padding="5sp"
    android:id="@+id/date"
    android:gravity="center|start"
    android:drawableEnd="@drawable/ic_calendar"
    android:background="@drawable/edit_background"
    android:hint="Not Selected"
    android:drawablePadding="10sp"
    android:paddingStart="10sp"
    android:paddingEnd="10sp"
    android:textColor="@color/black"
    android:layout_height="wrap_content"/>

Sie sollten "dp" verwenden
Mark Pazon

11
<TextView
    android:layout_width="wrap_content"
    android:layout_height="32dp"
    android:background="@drawable/a"
    android:drawableLeft="@drawable/concern_black"
    android:gravity="center"
    android:paddingLeft="10dp"
    android:paddingRight="10dp"
    android:drawablePadding="10dp"
    android:text="text"/>

Hinweis: layout_width muss wrap_content sein und paddingLeft paddingRight drawablePadding verwenden, um die Lücke zu steuern. Wenn Sie angeben, dass der Wert für layout_width eine Lücke zwischen Symbol und Text aufweist, wird die Auffüllung gemessen, sobald Sie layout_width einen bestimmten Wert geben.


9

Ich werde meine Antwort auch in den Ring werfen. Wenn Sie dies programmgesteuert tun möchten, können Sie Folgendes tun.

final Drawable drawable = ContextCompat.getDrawable(getContext(), R.drawable.somedrawable);
final boolean isLTR = ViewCompat.LAYOUT_DIRECTION_LTR == ViewCompat.getLayoutDirection(this);
final int iconInsetPadding = getResources().getDimensionPixelSize(R.dimen.icon_padding);

final Drawable insetDrawable = new InsetDrawable(drawable, isLTR ? 0 : iconInsetPadding, 0, isLTR ? iconInsetPadding : 0, 0);

Dadurch wird die Polsterung am Ende des Zeichens hinzugefügt, wobei das Ende links / rechts bedeutet, je nachdem, ob sich das Telefon in LTR oder RTL befindet.


7

Statt ButtonVerwendung LinearLayoutmit ImageViewund nach TextViewinnen. In untergeordneten Gegenständen mögen ImageViewund TextViewverwenden android:duplicateParentState="true".


Sie benötigen tatsächlich ein FrameLayout und eine Schaltfläche (und die ImageView / TextView in ihrem eigenen LinearLayout), um die Schaltflächen-Benutzeroberfläche zu reproduzieren und den onclicklistener () auf den Schaltflächenteil zu übertragen
3c71

1
Warum zusätzliches Layout verwenden, wenn Sie bereits drawablePadding in TextView haben?
Parinda Rajapaksha

5

Sie sollten die Verwendung einer Ebenenliste in Betracht ziehen

Erstellen Sie eine solche zeichnbare Datei und nennen Sie sie ic_calendar.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape android:shape="rectangle">
        <solid android:color="@android:color/transparent"/>
    </shape>
</item>
<item android:right="10dp">
    <bitmap android:gravity="center_vertical|left"
        android:src="@drawable/ic_calendar_16dp"
        android:tint="@color/red"
        />
</item>
</layer-list>

Unter Layoutdatei,

<TextView
         android:id="@+id/tvDate"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:drawableLeft="@drawable/ic_calendar"
         android:textColor="@color/colorGrey"
         android:textSize="14sp" 
    />

4

Sie können eine Auffüllung für die Schaltfläche verwenden und mit drawablePadding spielen

 <Button
    style="@style/botonesMenu"
    android:padding="15dp"
    android:drawablePadding="-15dp"
    android:text="@string/actualizarBD"
    android:textAlignment="gravity"
    android:gravity="center"
    android:layout_row="1"
    android:layout_column="0"
    android:drawableTop="@drawable/actualizar"
    android:id="@+id/btnActualizar"
    android:onClick="actualizarBD" />

Sie können eine bestimmte Auffüllung verwenden, je nachdem, wo Sie Ihre Zeichnung platzieren, mit android: paddingLeft = "10dp" oder android: paddingBottom = "10dp" oder android: paddingRight = "10dp" oder android: paddingTop = "10dp"


2

Mit können Sie android:drawableLeft="@drawable/your_icon"das Zeichen festlegen, das auf der linken Seite angezeigt werden soll. Um eine Polsterung für das Zeichenobjekt festzulegen, sollten Sie die android:paddingLeftoder android:paddingRightdie linke / rechte Polsterung verwenden.

android:paddingRight="10dp"
android:paddingLeft="20dp"
android:drawableRight="@drawable/ic_app_manager"

1

Wenn die Größe der zeichnbaren Ressource festgelegt ist, können Sie Folgendes tun:

<Button
    android:background="@drawable/rounded_button_green"
    style="?android:attr/selectableItemBackground"
    android:layout_height="wrap_content"
    app:layout_widthPercent="70%"
    android:drawableRight="@drawable/ic_clear_black_24dp"
    android:paddingRight="10dp"
    android:paddingLeft="34dp"
    tools:text="example" />

Der Schlüssel hier ist:

    android:drawableRight="@drawable/ic_clear_black_24dp"
    android:paddingRight="10dp"
    android:paddingLeft="34dp"

Das heißt, die Größe der zeichnbaren Ressource plus paddingRight ist paddingLeft.

Sie können das Ergebnis in diesem Beispiel sehen


1
textView.setCompoundDrawablesWithIntrinsicBounds(AppCompatResources.getDrawable(this,drawable),null,null,null);

addressTitleView.setCompoundDrawablePadding();

Während dieses Code-Snippet die Frage lösen kann, hilft eine Erklärung wirklich, die Qualität Ihres Beitrags zu verbessern. Denken Sie daran, dass Sie die Frage für Leser in Zukunft beantworten und diese Personen möglicherweise die Gründe für Ihren Codevorschlag nicht kennen.
Rosário Pereira Fernandes

Dies funktioniert nur für die Textansicht, nicht zB für die Schaltfläche, mit der auch Start- / End-Drwables festgelegt werden können
Ixx

1

einfach neu machen von:

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

    <corners android:radius="40dp"/>

    <solid android:color="@android:color/white"/>

</shape>

zu

<layer-list
        xmlns:android="http://schemas.android.com/apk/res/android">
    <item
            android:right="@dimen/_2dp"
            android:left="@dimen/_2dp"
            android:bottom="@dimen/_2dp"
            android:top="@dimen/_2dp"
            >
        <shape
                xmlns:android="http://schemas.android.com/apk/res/android">

            <corners android:radius="40dp"/>

            <solid android:color="@android:color/white"/>

        </shape>
    </item>

</layer-list>

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.