Ich möchte einen Android-Button mit Symbol + Text in der Mitte haben. Ich verwende das Attribut drawableLeft, um das Bild festzulegen. Dies funktioniert gut, wenn die Schaltfläche eine Breite von hat "wrap_content"
, ich mich jedoch auf die maximale Breite dehnen muss, damit ich die Breite verwende "fill_parent"
. Dadurch wird mein Symbol direkt links von der Schaltfläche verschoben, und ich möchte, dass sowohl das Symbol als auch der Text in der Schaltfläche zentriert sind.
Ich habe versucht, die Polsterung einzurichten, aber dies erlaubt nur die Angabe eines festen Werts, so dass es nicht das ist, was ich brauche. Ich muss Symbol + Text in der Mitte ausgerichtet haben.
<Button
android:id="@+id/startTelemoteButton"
android:text="@string/start_telemote"
android:drawableLeft="@drawable/start"
android:paddingLeft="20dip"
android:paddingRight="20dip"
android:width="fill_parent"
android:heigh="wrap_content" />
Irgendwelche Vorschläge, wie ich das erreichen könnte?
android
android-layout
user-interface
button
alignment
jloriente
quelle
quelle
Antworten:
android: drawableLeft behält immer android: paddingLeft als Abstand vom linken Rand bei. Wenn die Schaltfläche nicht auf android: width = "wrap_content" eingestellt ist, hängt sie immer links!
Mit Android 4.0 (API Level 14) können Sie das Attribut android: drawableStart verwenden , um ein Zeichen am Anfang des Textes zu platzieren. Die einzige abwärtskompatible Lösung, die ich mir ausgedacht habe, ist die Verwendung eines ImageSpan zum Erstellen eines Text + Image Spannable:
In meinem Fall musste ich auch das Android: Gravity-Attribut des Buttons anpassen, damit es zentriert aussieht:
quelle
button.setText(buttonLabel)
Ich weiß, dass ich diese Frage zu spät beantworte, aber das hat mir geholfen:
Ich habe diese Lösung von hier aus gefunden: Probleme mit der Android-Benutzeroberfläche: Erstellen einer Schaltfläche mit zentriertem Text und Symbol
quelle
Ich habe stattdessen LinearLayout verwendet Button verwendet . Der OnClickListener , den ich verwenden muss, funktioniert auch für LinearLayout einwandfrei.
quelle
Alle vorherigen Antworten scheinen veraltet zu sein
Sie können das
MaterialButton
Jetzt verwenden, mit dem Sie die Schwerkraft des Symbols einstellen können.Für die Verwendung der Materialkomponenten müssen Sie natürlich:
Fügen Sie eine Abhängigkeit hinzu
implementation 'com.google.android.material:material:1.3.0-alpha01'
(verwenden Sie die neueste Version)Erweitern Sie das Thema Materialkomponenten
Falls Sie dies nicht tun können, erweitern Sie es aus dem Material Bridge-Thema
quelle
Ich passe es an, indem ich links und rechts Polster wie folgt hinzufüge:
quelle
Ich bin kürzlich auf das gleiche Problem gestoßen. Ich habe versucht, eine billigere Lösung zu finden.
Dann rufen Sie einfach
OnClickListener
anLinearLayout
.Ich hoffe, dies hilft jemandem, da es ein sehr häufiges Problem zu sein scheint. :) :)
quelle
Sie können eine benutzerdefinierte Schaltfläche verwenden, die sich selbst misst und zeichnet, um eine linke Zeichenfläche aufzunehmen. Beispiel und Verwendung finden Sie hier
Verwendung
quelle
Dies ist meine Lösung, die ich vor 3 Jahren geschrieben habe. Die Schaltfläche hat Text und ein linkes Symbol und befindet sich im Rahmen, der hier die eigentliche Schaltfläche ist und von fill_parent gestreckt werden kann. Ich kann es nicht noch einmal testen, aber es hat damals funktioniert. Wahrscheinlich muss Button nicht verwendet werden und kann durch TextView ersetzt werden, aber ich werde es jetzt nicht testen und es ändert die Funktionalität hier nicht zu sehr.
quelle
Ich weiß, dass diese Frage etwas älter ist, aber vielleicht sind Sie immer noch offen für Hinweise oder Problemumgehungen:
Erstellen Sie ein RelativeLayout "wrap_content" mit dem Schaltflächenbild als Hintergrund oder der Schaltfläche selbst als erstem Element des Layouts. Holen Sie sich ein LinearLayout und setzen Sie es auf "layout_centerInParent" und "wrap_content". Stellen Sie dann Ihr Drawable als Bildansicht ein. Stellen Sie endlich eine Textansicht mit Ihrem Text (Gebietsschema) ein.
Sie haben also im Grunde diese Struktur:
oder so:
Ich weiß, dass es bei dieser Lösung viele Elemente gibt, mit denen Sie sich befassen müssen, aber Sie können damit ganz einfach Ihre eigene benutzerdefinierte Schaltfläche erstellen und auch die genaue Position von Text und Zeichen festlegen :)
quelle
Meine Art, es zu lösen, bestand darin, die Schaltfläche mit leichten
<View ../>
Elementen zu umgeben, deren Größe sich dynamisch ändert. Nachfolgend einige Beispiele, was damit erreicht werden kann:Beachten Sie, dass der anklickbare Bereich der Schaltflächen in Beispiel 3 der gleiche ist wie in 2 (dh mit Leerzeichen), was sich von Beispiel 4 unterscheidet, in dem keine "nicht klickbaren" Lücken dazwischen vorhanden sind.
Code:
quelle
Versuchen Sie, diese Bibliothek zu verwenden
OmegaCenterIconButton
quelle
Sie können ein benutzerdefiniertes Widget erstellen:
Die Java-Klasse IButton:
}}
Das Layout ibutton.xml
So verwenden Sie dieses benutzerdefinierte Widget:
Sie müssen den Namespace für die benutzerdefinierten Attribute xmlns angeben: ibutton = "http://schemas.android.com/apk/res/com.test.android.xxx" wobei com.test.android.xxx das Stammpaket von ist die Anwendung.
Setzen Sie es einfach unter xmlns: android = "http://schemas.android.com/apk/res/android".
Das Letzte, was Sie brauchen, sind die benutzerdefinierten Attribute in der Datei attrs.xml.
In der attrs.xml
Um eine bessere Positionierung zu erzielen, wickeln Sie die benutzerdefinierte Schaltfläche in ein LinearLayout ein, wenn Sie potenzielle Probleme mit RelativeLayout-Positionierungen vermeiden möchten.
Genießen!
quelle
Hatte ein ähnliches Problem, wollte aber eine Mitte ohne Text und ohne umbrochene Layouts zeichnen. Die Lösung bestand darin, eine benutzerdefinierte Schaltfläche zu erstellen und zusätzlich zu LINKS, RECHTS, OBEN und UNTEN eine weitere Zeichenfläche hinzuzufügen. Man kann die zeichnbare Platzierung leicht ändern und sie in der gewünschten Position relativ zum Text haben.
CenterDrawableButton.java
attrs.xml
Verwendung
quelle
Setzen Sie das FrameLayout in LinearLayout und setzen Sie die Ausrichtung auf Horizontal.
quelle
Sie können die Schaltfläche über einem LinearLayout platzieren
quelle
Was passiert, wenn Sie Android versuchen: Gravity = "center_horizontal"?
quelle
Ich denke Android: Schwerkraft = "Zentrum" sollte funktionieren
quelle
Wie von Rodja vorgeschlagen, gibt es vor 4.0 keine direkte Möglichkeit, den Text mit dem Zeichenelement zu zentrieren. Wenn Sie einen padding_left-Wert festlegen, wird das Zeichenobjekt vom Rand entfernt. Daher ist mein Vorschlag, dass Sie zur Laufzeit genau berechnen, wie viele Pixel vom linken Rand Ihr Zeichenelement sein muss, und es dann mit setPadding übergeben. Ihre Berechnung könnte so etwas wie sein
Die Breite Ihrer Zeichen ist festgelegt und Sie können sie nachschlagen und die Textbreite berechnen oder erraten.
Schließlich müssten Sie den Füllwert mit der Bildschirmdichte multiplizieren, was Sie mit DisplayMetrics tun können
quelle
Ich teste es nicht, aber anscheinend können Sie die CenteredContentButton-Bibliothek verwenden
quelle
öffentliche Klasse DrawableCenterTextView erweitert TextView {
}}
quelle
Schmutzige Lösung.
Das Finden der richtigen Polsterung löst den Zweck. Verwenden Sie für einen abwechslungsreichen Bildschirm jedoch unterschiedliche Auffüllungen und legen Sie diese in der Dimens-Ressource im entsprechenden Werteordner ab.
quelle
Verwenden Sie RelativeLayout (Container) und Android: layout_centerHorizontal = "true" , mein Beispiel:
quelle
Andere Möglichkeit, das Button-Thema beizubehalten.
Mit dieser Lösung können Sie, wenn Sie @ color / your_color @ color / your_highlight_color in Ihrem Aktivitätsthema hinzufügen, ein Matherial-Thema auf Lollipop mit Schatten und Welligkeit und für die vorherige Version eine flache Schaltfläche mit Ihrer Farbe und Hervorhebungsfarbe haben, wenn Sie darauf drücken.
Darüber hinaus wird mit dieser Lösung die Bildgröße automatisch angepasst
Ergebnis: Zuerst am Lollipop-Gerät Zweitens: Am Pre-Lollipop-Gerät 3 .: Pre-Lollipop-Gerät Taste drücken
quelle
Ich habe
textView
mit dem Symbol zentriertpaddingLeft
und textView auf left | centerVertical ausgerichtet . und für eine kleine Lücke zwischen Ansicht und Symbol habe ich verwendetdrawablePadding
quelle
android:paddingLeft
funktioniert hat.Dies mag ein alter / geschlossener Thread sein, aber ich habe überall gesucht und nichts Nützliches gefunden, bis ich mich entschied, meine eigene Lösung zu erstellen. Wenn jemand hier versucht, nach einer Antwort zu suchen, versuchen Sie diese, könnte Ihnen eine Minute des Nachdenkens ersparen
Da das lineare Layout als Container und derjenige mit dem Selektor fungiert, sieht es beim Klicken auf das gesamte lineare Layout genau so aus, wie es sein sollte. Wenn Sie möchten, dass beide zentriert sind, verwenden Sie relative Insteaf. Wenn Sie möchten, dass es horizontal zentriert ist, ändern Sie die Ausrichtung in horizontal.
Beachten Sie nicht vergessen , hinzuzufügen android: anklickbare = „true“ , dass Sie Ihrem Hauptcontainer (relativ oder linear) damit die Aktion ausgeführt werden kann.
Auch dies kann ein alter Thread sein, kann aber trotzdem jemandem dort helfen.
-cheers hoffen es hilft- happycodings.
quelle
Wenn Sie eine der Lösungen der benutzerdefinierten Ansicht verwenden, seien Sie vorsichtig, da diese häufig bei langem oder mehrzeiligem Text fehlschlagen . Ich schrieb einige Antworten um, ersetzte
onDraw()
und verstand, dass das ein falscher Weg war.quelle
Ich habe Lösungen für das Ausrichten von Drawable am Anfang / links gesehen, aber nichts für Drawable End / Right, also habe ich diese Lösung gefunden. Es verwendet dynamisch berechnete Auffüllungen zum Ausrichten von Zeichen- und Text auf der linken und rechten Seite.
Es ist wichtig, die Schwerkraft in Ihrem Layout entweder auf "center_vertical | start" oder "center_vertical | end" zu setzen, je nachdem, wo Sie das Symbol einstellen. Beispielsweise:
Das einzige Problem bei dieser Implementierung ist, dass die Schaltfläche nur eine einzige Textzeile enthalten kann. Andernfalls füllt der Textbereich die Schaltfläche aus und die Auffüllungen sind 0.
quelle
benutze das
android:background="@drawable/ic_play_arrow_black_24dp"
Stellen Sie einfach den Hintergrund auf das Symbol ein, das Sie zentrieren möchten
quelle