2011-10-07 22 views
139

Come si aggiunge un bordo a un pulsante? È possibile farlo senza ricorrere all'uso delle immagini?Android - bordo per il pulsante

+0

http: // StackOverflow.it/questions/7626554/android-draw-border-in-imageview/7626628 # 7626628 Anche qui :) – asenovm

risposta

305

Passaggio 1: Creare file denominato: my_button_bg.xml

Passaggio 2: Inserisci questo file in res/drawables.xml

Passaggio 3: Inserisci sotto il codice

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

Fase 4: Usa il codice "android: background =" @ drawable/my_button_bg", dove ad esempio necessario di seguito:

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

grazie. + 1 per questo.Dopo averlo salvato in una cartella disegnabile come file xml. Come possiamo usare vero? –

+1

@AndroidPower puoi usarlo con R.drawable.FILE_NAME – slayton

+2

Dove va questo codice, nel codice .axml per il markup per il pulsante? Va in un file di tipo styles.xml? – theJerm

5

So che la sua circa un anno di ritardo, ma è anche possibile creare un'immagine di 9 percorso C'è uno strumento che viene fornito con SDK di Android che aiuta nella creazione di tale immagine Vedi questo link: http://developer.android.com/tools/help/draw9patch.html

PS: l'immagine può essere infinitamente scalato così

13

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

e indicarlo come @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" /> 
14

Creare button_border.xml file nella cartella drawable.

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> 

E pulsante Add per il layout di attività XML e sfondo set 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" /> 
5

Se il pulsante non richiede uno sfondo trasparente, allora si può creare l'illusione di un bordo utilizzando un layout Frame. Basta regolare l'attributo "padding" di FrameLayout per modificare lo spessore del bordo.

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

Non sono sicuro che i file di forma xml abbiano colori di bordo modificabili dinamicamente. Ma so che con questa soluzione, puoi cambiare dinamicamente il colore del bordo impostando lo sfondo FrameLayout.

1

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

Nella cartella drawable, creare un file per stile del bordo del pulsante:

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

E nella vostra attività:

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(); 
     } 
    }); 
Problemi correlati