it-swarm.com.de

Android - Rahmen für Schaltfläche

Wie füge ich einer Schaltfläche einen Rahmen hinzu? Ist dies möglich, ohne auf Bilder zurückzugreifen?

193
jeffreyveon

Schritt 1: Erstellen Sie die Datei my_button_bg.xml

Schritt 2: Platzieren Sie diese Datei in res/drawables.xml

Schritt 3: Geben Sie den folgenden Code ein

<?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>

Schritt 4: Verwenden Sie den Code "Android: background =" @ drawable/my_button_bg ", falls erforderlich, zB unten:

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

Erstellen button_border.xml Datei in Ihrem Zeichenordner.

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>

Und fügen Sie eine Schaltfläche zu Ihrem XML-Aktivitätslayout hinzu und legen Sie den Hintergrund fest 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" />
34
Karina Sen

Android Official Solution

Seit Einführung von Android Design Support v28 ist es einfach, mit MaterialButton eine umrandete Schaltfläche zu erstellen. Diese Klasse liefert aktualisierte Materialstile für die Schaltfläche im Konstruktor. Mit app:strokeColor Und app:strokeWidth Können Sie einen benutzerdefinierten Rahmen wie folgt erstellen:

build.gradle

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

style.xml

Stellen Sie sicher, dass Ihr Anwendungsdesign von Theme.MaterialComponents Anstelle von Theme.AppCompat Erbt.

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

• Umrandete Schaltfläche:

<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" />

• Nicht ausgefüllte umrandete Schaltfläche:

<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="@color/transparent"
    app:cornerRadius="8dp"
    app:rippleColor="#33AAAAAA"
    app:strokeColor="@color/green"
    app:strokeWidth="2dp" />

Visuelles Ergebnis

enter image description here

29
aminography

Hier finden Sie Informationen zum Erstellen einer Form, die gezeichnet werden kann http://developer.Android.com/guide/topics/resources/drawable-resource.html#Shape

Sobald Sie dies getan haben, setzen Sie in der XML für Ihre Schaltfläche Android:background="@drawable/your_button_border"

17
dymmeh

erstelle 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>

und weise darauf hin als @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" />
13
vitperov

Wenn für Ihre Schaltfläche kein transparenter Hintergrund erforderlich ist, können Sie mithilfe eines Rahmenlayouts eine Rahmenillusion erstellen. Passen Sie einfach das "Auffüllen" -Attribut von FrameLayout an, um die Dicke des Rahmens zu ändern.

<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>

Ich bin nicht sicher, ob die Shape-XML-Dateien dynamisch bearbeitbare Rahmenfarben haben. Ich weiß jedoch, dass Sie mit dieser Lösung die Farbe des Rahmens dynamisch ändern können, indem Sie den FrameLayout-Hintergrund festlegen.

5
Rock Lee

Ich weiß, dass es ungefähr ein Jahr zu spät ist, aber Sie können auch ein 9-Pfad-Image erstellen. Es gibt ein Tool, das mit dem SDK Android= hilft, ein solches Image zu erstellen. Siehe diesen Link: http://developer.Android.com/tools/help/draw9patch.html

PS: Das Bild kann auch unendlich skaliert werden

5
himura

In Ihrem XML-Layout:

<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" />

Erstellen Sie im Zeichenordner eine Datei für den Rahmenstil der Schaltfläche:

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

Und in Ihrer Tätigkeit:

    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();
        }
    });
5
Raseem Ayatt