Comment définir le rayon des coins arrondis d'une couleur dessinable à l'aide de XML?

108

Sur le site Web Android, il y a une section sur les dessinables en couleur . La définition de ces drawables en XML ressemble à ceci:

<resources>
    <drawable name="solid_red">#f00</drawable>
    <drawable name="solid_blue">#0000ff</drawable>
    <drawable name="solid_green">#f0f0</drawable>
</resources>

Dans l'API java, ils ont la méthode suivante pour définir les coins arrondis:

setCornerRadius(float radius)

Existe-t-il un moyen de définir les coins arrondis dans le xml?

android drawable Jay Askren
la source
Pour définir les coins à partir du code, voir (Gradient Drawables): stackoverflow.com/questions/8709595/…
samis

Réponses:

319

Utilisez la <shape>balise pour créer un dessin en XML avec des coins arrondis. (Vous pouvez faire d'autres choses avec la balise de forme comme définir également un dégradé de couleur).

Voici une copie d'un fichier XML que j'utilise dans l'une de mes applications pour créer un dessin avec un fond blanc, une bordure noire et des coins arrondis:

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
    <solid android:color="#ffffffff"/>    
             
    <stroke android:width="3dp"
            android:color="#ff000000" />

    <padding android:left="1dp"
             android:top="1dp"
             android:right="1dp"
             android:bottom="1dp" /> 
             
    <corners android:radius="7dp" /> 
</shape>
Marque B
la source
1
où enregistrer ce fichier et comment l'obtenir dans mon code java? merci
shyam
7
enregistrez-le en tant que fichier xml dans le répertoire drawable, puis utilisez-le comme vous utiliseriez n'importe quel drawable (icône ou fichier de ressources) en utilisant son nom de ressource (R.drawable.your_xml_name)
Guillaume
30
dans ce cas particulier, tous les rayons sont identiques, vous auriez donc pu utiliser android: radius = "7dp"
Will Kru
2
De plus, le moteur de rendu de disposition dans Android Studio ne pourra pas le rendre si vous définissez le rayon séparément (même avec les mêmes valeurs) et vous donnerait un avertissement "Pat.isConvex n'est pas pris en charge". Utilisez simplement <corners android: radius = "7dp" />
Francesco Ambrosini
@shyam Vous pouvez le définir comme "arrière-plan". Si vous l'utilisez sur un TextView, vous devrez vous rappeler d'ajouter un remplissage pour le début et la fin afin que le texte ne soit pas encombré par le bord arrondi
RowanPD
19

La réponse de mbaird fonctionne très bien. Sachez simplement qu'il semble y avoir un bogue dans Android (au moins 2.1), que si vous définissez le rayon d'un coin individuel sur 0, cela force tous les coins à 0 (du moins c'est le cas avec les unités "dp"; je n'ai pas N'essayez pas avec d'autres unités).

J'avais besoin d'une forme où les coins supérieurs étaient arrondis et les coins inférieurs carrés. J'ai obtenu cela en définissant les coins que je voulais carrés à une valeur légèrement supérieure à 0: 0,1 dp. Cela reste toujours comme des coins carrés, mais cela ne force pas les autres coins à avoir un rayon de 0.

John Pisello
la source
tu viens d'écrire 0,1 dp? ça marche, j'ai aussi besoin de coins arrondis supérieurs et de coins carrés inférieurs, même problème que vous venez d'utiliser 1 dp, sur les coins carrés et 10dp sur les coins ronds, vous avez raison, c'est toujours perceptible, mais me donne 90% de ce que je voulez, selon la documentation, le réglage 0 sur les coins non arrondis aurait dû fonctionner.
codeScriber
En fait, ce n'est pas un bug, c'est dans la documentation: developer.android.com/guide/topics/resources/…
Tsuharesu
1

Essayez ci-dessous le code 

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners
    android:bottomLeftRadius="30dp"
    android:bottomRightRadius="30dp"
    android:topLeftRadius="30dp"
    android:topRightRadius="30dp" />
<solid android:color="#1271BB" />

<stroke
    android:width="5dp"
    android:color="#1271BB" />

<padding
    android:bottom="1dp"
    android:left="1dp"
    android:right="1dp"
    android:top="1dp" /></shape>
Mujahid Khan
la source