Comment ajouter une bordure à un bouton? Est-il possible de le faire sans recourir à l'utilisation d'images?

Étape 1: créer un fichier nommé: my_button_bg.xml

Étape 2: placez ce fichier dans res / drawables.xml

Étape 3: insérer le code ci-dessous

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
  android:shape="rectangle">
  <gradient android:startColor="#FFFFFF" 
    android:endColor="#00FF00"
    android:angle="270" />
  <corners android:radius="3dp" />
  <stroke android:width="5px" android:color="#000000" />
</shape>

Étape 4: Utilisez le code "android: background =" @ drawable / my_button_bg "si nécessaire, par exemple ci-dessous:

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Your Text"
    android:background="@drawable/my_button_bg"
    />

• Android Official Solution

Depuis l' introduction d' Android Design Support v28 , il est facile de créer un bouton avec bordure à l'aide de MaterialButton. Cette classe fournit des styles de matériaux mis à jour pour le bouton dans le constructeur. À l'aide de app:strokeColoret app:strokeWidthvous pouvez créer une bordure personnalisée comme suit:

1. Lorsque vous utilisez androidx:

build.gradle

dependencies {
    implementation 'androidx.appcompat:appcompat:1.1.0'
    implementation 'com.google.android.material:material:1.0.0'
}

• Bouton bordé:

<com.google.android.material.button.MaterialButton
    style="@style/Widget.AppCompat.Button.Colored"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="MATERIAL BUTTON"
    android:textSize="15sp"
    app:strokeColor="@color/green"
    app:strokeWidth="2dp" />

• Bouton bordé non rempli:

<com.google.android.material.button.MaterialButton
    style="@style/Widget.AppCompat.Button.Borderless"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="UNFILLED MATERIAL BUTTON"
    android:textColor="@color/green"
    android:textSize="15sp"
    app:backgroundTint="@android:color/transparent"
    app:cornerRadius="8dp"
    app:rippleColor="#33AAAAAA"
    app:strokeColor="@color/green"
    app:strokeWidth="2dp" />

2. Lorsque vous utilisez appcompat:

build.gradle

dependencies {
    implementation 'com.android.support:design:28.0.0'
}

style.xml

Assurez-vous que votre thème d'application hérite de Theme.MaterialComponentsau lieu de Theme.AppCompat.

<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
    <!-- Customize your theme here. -->
</style>

• Bouton bordé:

<android.support.design.button.MaterialButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="MATERIAL BUTTON"
    android:textSize="15sp"
    app:strokeColor="@color/green"
    app:strokeWidth="2dp" />

• Bouton bordé non rempli:

<android.support.design.button.MaterialButton
    style="@style/Widget.AppCompat.Button.Borderless"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="UNFILLED MATERIAL BUTTON"
    android:textColor="@color/green"
    android:textSize="15sp"
    app:backgroundTint="@android:color/transparent"
    app:cornerRadius="8dp"
    app:rippleColor="#33AAAAAA"
    app:strokeColor="@color/green"
    app:strokeWidth="2dp" />

Résultat visuel

Créez un button_border.xmlfichier dans votre dossier dessinable.

res / drawable / button_border.xml

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

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

    <stroke
        android:width="3dp"
        android:color="#FFFF4917" />

</shape>

Et ajoutez un bouton à votre disposition d'activité XML et définissez l'arrière-plan android:background="@drawable/button_border".

        <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/button_border"
                android:text="Button Border" />

créez drawable / button_green.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
  android:shape="rectangle">
  <gradient
    android:startColor="#003000"
    android:centerColor="#006000"
    android:endColor="#003000"
    android:angle="270" />
  <corners android:radius="5dp" />
  <stroke android:width="2px" android:color="#007000" />
</shape>

et le signaler comme @drawable/button_green:

<Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:background="@drawable/button_green"
        android:text="Button" />

Veuillez regarder ici pour créer une forme dessinable http://developer.android.com/guide/topics/resources/drawable-resource.html#Shape

Une fois que vous avez fait cela, dans le XML de votre jeu de boutons android:background="@drawable/your_button_border"

Si votre bouton ne nécessite pas d'arrière-plan transparent, vous pouvez créer l'illusion d'une bordure à l'aide d'une disposition de cadre. Ajustez simplement l'attribut "padding" de FrameLayout pour changer l'épaisseur de la bordure.

<FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="1sp"
        android:background="#000000">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Your text goes here"
            android:background="@color/white"
            android:textColor="@color/black"
            android:padding="10sp"
            />
</FrameLayout>

Je ne sais pas si les fichiers XML de forme ont des couleurs de bordure modifiables dynamiquement. Mais je sais qu'avec cette solution, vous pouvez changer dynamiquement la couleur de la bordure en définissant l'arrière-plan FrameLayout.

Dans votre mise en page XML:

<Button
    android:id="@+id/cancelskill"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginLeft="25dp"
    android:layout_weight="1"
    android:background="@drawable/button_border"
    android:padding="10dp"
    android:text="Cancel"
    android:textAllCaps="false"
    android:textColor="#ffffff"
    android:textSize="20dp" />

Dans le dossier dessinable, créez un fichier pour le style de bordure du bouton:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <stroke
        android:width="1dp"
        android:color="#f43f10" />
</shape>

Et dans votre activité:

    GradientDrawable gd1 = new GradientDrawable();
    gd1.setColor(0xFFF43F10); // Changes this drawbale to use a single color instead of a gradient
    gd1.setCornerRadius(5);
    gd1.setStroke(1, 0xFFF43F10);

    cancelskill.setBackgroundDrawable(gd1);

    cancelskill.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View v) {
            cancelskill.setBackgroundColor(Color.parseColor("#ffffff"));
            cancelskill.setTextColor(Color.parseColor("#f43f10"));

            GradientDrawable gd = new GradientDrawable();

            gd.setColor(0xFFFFFFFF); // Changes this drawbale to use a single color instead of a gradient
            gd.setCornerRadius(5);
            gd.setStroke(1, 0xFFF43F10);
            cancelskill.setBackgroundDrawable(gd);

            finish();
        }
    });

Je sais que d'un an de retard, mais vous pouvez aussi créer une image de chemin 9 Il y a un outil qui vient avec Android SDK qui contribue à créer telle image Voir ce lien: http://developer.android.com/tools/help/draw9patch .html

PS: l'image peut également être mise à l'échelle à l'infini