Comment créer des boutons personnalisés dans Android à l'aide de XML Styles

Je veux faire ce genre de bouton [même fond & texte] couleurs en utilisant XML Styles

c'est juste pour un exemple, je veux écrire d'autres textes, comme: à Propos de Moi

Encore, je suis en utilisant le bouton créé par le designer dans Photoshop

    <ImageButton
        android:id="@+id/imageButton5"
        android:contentDescription="AboutUs"
        android:layout_width="wrap_content"
        android:layout_marginTop="8dp"
        android:layout_height="wrap_content"
        android:layout_below="@+id/view_pager"
        android:layout_centerHorizontal="true"
        android:background="@drawable/aboutus" />

Remarque: j'ai besoin de ce genre de bouton dans chaque taille et la forme

Je ne veux pas utiliser n'importe quelle image dans mon Application Android, je veux le faire en utilisant XML seulement

Nous une image comme celle-ci et de le définir comme arrière-plan de votre imageView.

InformationsquelleAutor Sneha | 2013-08-29

android android-widget

69

Avez-vous déjà essayé de créer le fond pour la forme des boutons?

Check this out ci-dessous:

Ci-dessous est la séparation de l'image à partir de votre image sur un bouton.

Maintenant, placez-le dans votre ImageButton pour android:src "source" de la sorte:
```
android:src="@drawable/twitter"
```
Maintenant, il suffit de créer la forme de la ImageButton d'avoir un noir shader arrière-plan.
```
android:background="@drawable/button_shape"
```
et la button_shape est le fichier xml dans drawable ressource:
```
    <?xml version="1.0" encoding="UTF-8"?>
<shape 
    xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke 
        android:width="1dp" 
        android:color="#505050"/>
    <corners 
        android:radius="7dp" />

    <padding 
        android:left="1dp"
        android:right="1dp"
        android:top="1dp"
        android:bottom="1dp"/>

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

</shape>
```
Juste essayer de la mettre en œuvre avec ce. Vous pourriez avoir besoin de modifier la valeur de la couleur selon votre condition.

Laissez-moi savoir si cela ne fonctionne pas.

InformationsquelleAutor iDroid Explorer

Copier-collé à partir d'une recette écrite par "Adrián Santalla" sur androidcookbook.com:
https://www.androidcookbook.com/Recipe.seam?recipeId=3307

1. Créer un fichier XML qui représente les états du bouton

Créer un xml dans drawable appelé "button.xml' au nom des états de bouton:

HTML:

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_enabled="false"
        android:drawable="@drawable/button_disabled" />
    <item
    	android:state_pressed="true"
    	android:state_enabled="true"
        android:drawable="@drawable/button_pressed" />
    <item
    	android:state_focused="true"
    	android:state_enabled="true"
        android:drawable="@drawable/button_focused" />
    <item
    	android:state_enabled="true"
        android:drawable="@drawable/button_enabled" />
</selector>

2. Créer un fichier XML qui représente chaque état du bouton

Créer un fichier xml pour chacun des quatre états du bouton. Ils devraient tous être sous un drawable dossier. Suivons les noms indiqués dans le button.xml fichier.

button_enabled.xml:

HTML:

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <gradient
        android:startColor="#00CCFF"
        android:centerColor="#0000CC"
        android:endColor="#00CCFF"
        android:angle="90"/>
    <padding android:left="7dp"
        android:top="7dp"
        android:right="7dp"
        android:bottom="7dp" />
    <stroke
        android:width="2dip"
        android:color="#FFFFFF" />
    <corners android:radius= "8dp" />
</shape>

button_focused.xml:

HTML:

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <gradient
        android:startColor="#F7D358"
        android:centerColor="#DF7401"
        android:endColor="#F7D358"
        android:angle="90"/>
    <padding android:left="7dp"
        android:top="7dp"
        android:right="7dp"
        android:bottom="7dp" />
    <stroke
        android:width="2dip"
        android:color="#FFFFFF" />
    <corners android:radius= "8dp" />
</shape>

button_pressed.xml:

HTML:

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <gradient
        android:startColor="#0000CC"
        android:centerColor="#00CCFF"
        android:endColor="#0000CC"
        android:angle="90"/>
    <padding android:left="7dp"
        android:top="7dp"
        android:right="7dp"
        android:bottom="7dp" />
    <stroke
        android:width="2dip"
        android:color="#FFFFFF" />
    <corners android:radius= "8dp" />
</shape>

button_disabled.xml:

HTML:

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <gradient
        android:startColor="#F2F2F2"
        android:centerColor="#A4A4A4"
        android:endColor="#F2F2F2"
        android:angle="90"/>
    <padding android:left="7dp"
        android:top="7dp"
        android:right="7dp"
        android:bottom="7dp" />
    <stroke
        android:width="2dip"
        android:color="#FFFFFF" />
    <corners android:radius= "8dp" />
</shape>

3. Créer un fichier XML qui représente le style de bouton

Une fois que vous avez créé les fichiers mentionnés ci-dessus, il est temps de créer votre bouton de l'application de style. Maintenant, vous devez créer un nouveau fichier XML, appelé styles.xml (si vous ne l'avez pas encore) où vous pouvez inclure d'autres styles personnalisés, en de valeurs répertoire.

Ce fichier contiendra le bouton nouveau style de votre application. Vous devez définir votre bouton nouveau style des entités. Notez que l'une de ces fonctions, l'arrière-plan de votre nouveau style, doit être définie avec une référence à la touche (button.xml) drawable qui a été créé dans la première étape. À consulter sur le bouton nouveau style que nous utilisons le nom de l'attribut.

L'exemple ci-dessous montre le contenu de la styles.xml fichier:

HTML:

<resources>
    <style name="button" parent="@android:style/Widget.Button">
        <item name="android:gravity">center_vertical|center_horizontal</item>
        <item name="android:textColor">#FFFFFFFF</item>
        <item name="android:shadowColor">#FF000000</item>
        <item name="android:shadowDx">0</item>
        <item name="android:shadowDy">-1</item>
        <item name="android:shadowRadius">0.2</item>
        <item name="android:textSize">16dip</item>
        <item name="android:textStyle">bold</item>
        <item name="android:background">@drawable/button</item>
        <item name="android:focusable">true</item>
        <item name="android:clickable">true</item>
    </style>
</resources>

4. Créer un document XML avec votre propre application personnalisée thème

Enfin, vous devez remplacer la valeur par défaut d'Android style de bouton. Pour cela, vous devez créer un nouveau fichier XML, appelé themes.xml (si vous ne l'avez pas encore), dans les valeurs de répertoire et de remplacer la valeur par défaut d'Android style de bouton.

L'exemple ci-dessous montre le contenu de la themes.xml:

HTML:

<resources>
    <style name="YourApplicationTheme" parent="android:style/Theme.NoTitleBar">
        <item name="android:buttonStyle">@style/button</item>
    </style>
</resources>

Espère que vous les gars peuvent avoir la même chance que j'ai eu avec ce, lorsque je cherchais des boutons personnalisés. Profitez de.

Ok, j'ai reçu une meilleure réponse qui sera certainement aider les autres. Et à propos de la réponse à un vieux sujet, j'ai l'impression que comme je l'ai été à la recherche pour elle, d'autres pourraient faire de même. La plus complète est un sujet, plus vite les développeurs peuvent trouver une solution à leurs problèmes, du moins je le pense comme ça. Merci quand même.
Bonne réponse, mais aucune idée pourquoi le rembourrage option est ignorée?
Juste pour info - Frère, vous souhaiterez peut-être modifier le lien du https en http - depuis que le site n'est plus utilise le protocole sécurisé.

InformationsquelleAutor Gramowski

19

Ont un coup d'oeil à Style De Bouton il va sûrement vous aider.
Il y a beaucoup d'exemples s'il vous plaît recherche sur INTERNET.

par exemple:style
```
<style name="Widget.Button" parent="android:Widget">
    <item name="android:background">@drawable/red_dot</item>
</style>
```
vous pouvez utiliser le sélecteur au lieu de red_dot

red_dot:
```
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval"  >

    <solid android:color="#f00"/>
    <size android:width="55dip"
        android:height="55dip"/>
</shape>
```
Bouton:
```
<Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="49dp"
        style="@style/Widget.Button"
        android:text="Button" />
```
- oui, je le savais, mais j'ai besoin de mettre en œuvre un même arrière-plan et la couleur du texte dans mon code
- voulez-vous dire la couleur exacte de l'image que vous avez donné à votre question?
- Vous avez la connexion internet de l'utiliser. vous pouvez trouver le code couleur pour la couleur d'arrière-plan. Utilisation de Gru de répondre à créer une image dessinés avec cette couleur. recherche de la police de caractères qui correspondent à vos besoins et s'appliquent sur ce bouton, c'est tout.
- votre lien pointe vers xamarin. Il y a des différences qui peuvent créer de la confusion (comme, ce n'est même pas de code Java)
InformationsquelleAutor Siddhesh

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

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

   <size 
       android:width="@dimen/shape_circle_width"
        android:height="@dimen/shape_circle_height"/>
</shape>

1.ajouter ceci dans votre drawable

2.définir comme arrière-plan de votre bouton

je sais comment utiliser les formes, mais j'ai besoin de mettre en œuvre un même arrière-plan et la couleur du texte dans mon code
utiliser les ceci pour dériver la couleur de votre image

InformationsquelleAutor Gru

<gradient android:startColor="#ffdd00"
    android:endColor="@color/colorPrimary"
    android:centerColor="#ffff" />

<corners android:radius="33dp"/>

<padding
    android:bottom="7dp"
    android:left="7dp"
    android:right="7dp"
    android:top="7dp"
    />

InformationsquelleAutor Rajneesh Shukla

Vous devez vous connecter pour publier un commentaire.