web-dev-qa-db-fra.com

Bouton Android avec icône et texte

J'ai quelques boutons comme celui-ci dans mon application:

    <Button
        Android:id="@+id/bSearch"
        Android:layout_width="fill_parent"
        Android:layout_height="wrap_content"
        Android:padding="16dp"
        Android:text="Search"
        Android:textSize="24sp" />

J'essaie de créer un même bouton avec du texte et une icône. Android: drawableLeft ne fonctionne pas pour moi (peut-être que ce serait le cas, mais je ne sais pas comment définir une hauteur maximale pour l'icône).

J'ai donc créé un LinearLayout avec un ImageView et un TextView et je l'ai fait agir comme un bouton:

    <LinearLayout
        Android:id="@+id/bSearch2"
        Android:layout_width="fill_parent"
        Android:layout_height="wrap_content"
        Android:background="@Android:drawable/btn_default"
        Android:clickable="true"
        Android:padding="16dp"
        Android:orientation="horizontal" >

        <ImageView
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_gravity="center_vertical"
            Android:layout_marginLeft="5dp"
            Android:adjustViewBounds="true"
            Android:maxHeight="30dp"
            Android:maxWidth="30dp"
            Android:scaleType="fitCenter"
            Android:src="@drawable/search_icon" />

        <TextView
            Android:id="@+id/tvSearchCaption"
            Android:layout_width="fill_parent"
            Android:layout_height="wrap_content"
            Android:layout_gravity="center_vertical"
            Android:textSize="24sp"
            Android:paddingRight="30dp"
            Android:gravity="center"
            Android:text="Search" />
    </LinearLayout>

Mon nouveau bouton est exactement ce que je veux (taille de la police, placement des icônes et du texte). Mais cela ne ressemble pas à mes boutons par défaut:

enter image description here

J'ai donc essayé de changer le fond et la couleur du texte de mon nouveau bouton:

Button Search = (Button) findViewById(R.id.bSearch);
LinearLayout bSearch2 = (LinearLayout) findViewById(R.id.bSearch2);
bSearch2.setBackground(bSearch.getBackground());
TextView tvSearchCaption = (TextView)findViewById(R.id.tvSearchCaption);
tvSearchCaption.setTextColor(bSearch.getTextColors().getDefaultColor());

Cela donne un résultat étrange, mon ancien bouton, est foiré:

enter image description here

Quand je change l'ordre de ces deux boutons dans le XML, donc le "nouveau bouton" commence en premier, cela donne un autre résultat étrange:

enter image description here

Maintenant, j'ai remarqué que lorsque j'essaie d'appuyer sur l'ancien bouton, le nouveau est appuyé.

Des idées?

73
Dusan

Essaye celui-là.

<Button
    Android:id="@+id/bSearch"
    Android:layout_width="fill_parent"
    Android:layout_height="wrap_content"
    Android:padding="16dp"
    Android:text="Search"
    Android:drawableLeft="@Android:drawable/ic_menu_search"
    Android:textSize="24sp"/>
241
Liem Vo

Pour ajouter une image à gauche, à droite, en haut ou en bas, vous pouvez utiliser des attributs tels que:

Android:drawableLeft
Android:drawableRight
Android:drawableTop
Android:drawableBottom

L'exemple de code est donné ci-dessus. Vous pouvez également y parvenir en utilisant une disposition relative.

15
user3515854

Pour ceux qui cherchent à le faire dynamiquement, alors setCompoundDrawables(Drawable left, Drawable top, Drawable right, Drawable bottom) sur l’objet des boutons sera utile.

Échantillon

Button search = (Button) findViewById(R.id.yoursearchbutton);
search.setCompoundDrawables('your_drawable',null,null,null);
10
Kennedy Nyaga

@Liem Vo est correct mais si vous utilisez End/Start au lieu de Right/Left Android le studio l'appréciera :)

<Button
Android:id="@+id/bSearch"
Android:layout_width="fill_parent"
Android:layout_height="wrap_content"
Android:padding="16dp"
Android:text="Search"
Android:drawableStart="@Android:drawable/ic_menu_search"
Android:textSize="24sp"/>
1
TheTeslaa

res/drawable/circle.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:shape="rectangle">
    <corners Android:radius="1000dp" />
    <solid Android:color="#41ba7a" />
    <stroke
        Android:width="2dip"
        Android:color="#03ae3c" />
    <padding
        Android:bottom="4dp"
        Android:left="4dp"
        Android:right="4dp"
        Android:top="4dp" />
</shape>

res/layout/custom_button.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:gravity="center_horizontal"
    Android:orientation="vertical"
    Android:padding="16dp">
    <LinearLayout
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:orientation="horizontal">
        <Button
            Android:layout_width="100dp"
            Android:layout_height="100dp"
            Android:background="@drawable/circle"
            Android:drawableTop="@Android:drawable/ic_dialog_email"
            Android:paddingTop="20dp"
            Android:text="Contact"
            Android:textColor="#fff" />
        <Button
            Android:layout_width="100dp"
            Android:layout_height="100dp"
            Android:layout_marginLeft="10dp"
            Android:background="@drawable/circle"
            Android:drawableTop="@Android:drawable/ic_dialog_map"
            Android:paddingTop="20dp"
            Android:text="Map"
            Android:textColor="#fff" />
        <Button
            Android:layout_width="100dp"
            Android:layout_height="100dp"
            Android:layout_marginLeft="10dp"
            Android:background="@drawable/circle"
            Android:drawableTop="@Android:drawable/ic_dialog_info"
            Android:paddingTop="20dp"
            Android:text="Info"
            Android:textColor="#fff" />
    </LinearLayout>
</LinearLayout>

Exemple d'image et de lien enter image description here

Exemple: https://code-Android-example.blogspot.com/2019/07/custom-button-with-icon-and-text-in-Android.html

0
Tienanhvn