web-dev-qa-db-fra.com

Créer un bouton avec des coins arrondis dans android

enter image description here

J'essaye de créer un bouton qui ressemble à l'image ci-dessus. Au départ, mon idée était de créer un patch 9 et de le définir comme arrière-plan du bouton. Mais comme il s'agit d'un bouton simple, je pense que nous pouvons en quelque sorte le dessiner sans utiliser d'images.

La couleur d'arrière-plan du bouton est # 0c0c0c La couleur de la bordure est # 1a1a1a La couleur du texte est #cccccc

J'ai trouvé une question similaire sur SO mais cela crée un dégradé -
Android - bordure du bouton

androidandroid-layoutandroid-button
11
coderplus

Le Android Developer's Guide a un guide détaillé à ce sujet: Shape Drawbables .

Vous pouvez également simplement supprimer l'élément gradient du lien que vous avez fourni:

<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:shape="rectangle">
    <corners Android:radius="3dp" />
    <stroke Android:width="5px" Android:color="#1a1a1a" />
</shape>
23
Sam
   <Button
    Android:id="@+id/button1"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_above="@+id/textView1"
    Android:layout_alignLeft="@+id/textView1"
    Android:layout_marginBottom="56dp"
    Android:text="Button" 
    Android:textColor="#FF0F13"
    Android:background="@drawable/bbkg"/>//create bbkg.xml in drawable folder

bbkg.xml // arrière-plan du bouton

   <?xml version="1.0" encoding="utf-8"?>
  <selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
  <item Android:state_pressed="true" 
    Android:drawable="@drawable/pressed" />
  <item  Android:state_focused="false" 
    Android:drawable="@drawable/normal" />
  </selector>

normal.xml // état normal de l'arrière-plan du bouton

  <?xml version="1.0" encoding="UTF-8"?> 
  <shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:shape="rectangle"> 
  <solid Android:color="#10EB0A"/>    
  <stroke Android:width="3dp"
        Android:color="#0FECFF" /> 
  <padding Android:left="5dp"
         Android:top="5dp"
         Android:right="5dp"
         Android:bottom="5dp"/> 
  <corners Android:bottomRightRadius="7dp"
         Android:bottomLeftRadius="7dp" 
         Android:topLeftRadius="7dp"
         Android:topRightRadius="7dp"/> 
  </shape>

pressé.xml // état du fond du bouton enfoncé

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
   Android:shape="rectangle"> 
<solid Android:color="#FF1A47"/>    
<stroke Android:width="3dp"
        Android:color="#0FECFF"/>

<corners Android:bottomRightRadius="7dp"
         Android:bottomLeftRadius="7dp" 
         Android:topLeftRadius="7dp"
         Android:topRightRadius="7dp"/> 
</shape>
16
Raghunandan

Si tu veux quelque chose comme ça

Aperçu du bouton

voici le code.

Créez un fichier xml dans votre dossier pouvant être dessiné comme mybutton.xml et collez le balisage suivant:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android" >
 <item Android:state_pressed="true" >
     <shape Android:shape="rectangle"  >
         <corners Android:radius="3dip" />
         <stroke Android:width="1dip" Android:color="#5e7974" />
         <gradient Android:angle="-90" Android:startColor="#345953" Android:endColor="#689a92"  />            
     </shape>
 </item>
<item Android:state_focused="true">
     <shape Android:shape="rectangle"  >
         <corners Android:radius="3dip" />
         <stroke Android:width="1dip" Android:color="#5e7974" />
         <solid Android:color="#58857e"/>       
     </shape>
 </item>  
<item >
    <shape Android:shape="rectangle"  >
         <corners Android:radius="3dip" />
         <stroke Android:width="1dip" Android:color="#5e7974" />
         <gradient Android:angle="-90" Android:startColor="#8dbab3" Android:endColor="#58857e" />            
     </shape>
 </item>
</selector>

Utilisez maintenant ce dessin pour l'arrière-plan de votre vue. Si la vue est un bouton, quelque chose comme ceci:

<Button
    Android:id="@+id/button1"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:padding="10dp"
    Android:textColor="#ffffff"
    Android:background="@drawable/mybutton"
    Android:text="Buttons" />
3
Andriya