Question Comment définir une forme de cercle dans un fichier à dessiner Android xml?


J'ai quelques problèmes pour trouver la documentation des définitions de formes en XML pour Android. Je voudrais définir un cercle simple rempli d'une couleur solide dans un fichier XML pour l'inclure dans mes fichiers de mise en page.

Malheureusement, la documentation sur android.com ne couvre pas les attributs XML des classes Shape. Je pense que je devrais utiliser un ArcShape pour dessiner un cercle, mais il n'y a pas d'explication sur la façon de définir la taille, la couleur ou l'angle nécessaire pour créer un cercle à partir d'un arc.


503
2017-07-06 09:40


origine


Réponses:


Ceci est un cercle simple en tant que dessinable dans Android.

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

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

   <size 
       android:width="120dp"
        android:height="120dp"/>
</shape>

1139
2017-08-25 12:24



Définissez ceci comme arrière-plan de votre vue

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

enter image description here

Pour un cercle solide, utilisez:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid
        android:color="#48b3ff"/>
</shape>

enter image description here

Solide avec accident vasculaire cérébral:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#199fff"/>
    <stroke
        android:width="2dp"
        android:color="#444444"/>
</shape>

enter image description here

Remarque: Pour faire le oval les formes apparaissent sous forme de cercle, dans ces exemples, soit votre point de vue que vous utilisez ces formes comme son arrière-plan doit être un carré ou vous devez définir le height et width propriétés de l'étiquette de forme à une valeur égale.


594
2018-01-11 15:08



Code pour cercle simple

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
        <solid android:color="#9F2200"/>
        <stroke android:width="2dp" android:color="#fff" />
        <size android:width="80dp" android:height="80dp"/>
</shape>

83
2017-11-25 10:01



Regardez dans les exemples SDK Android. Il y a plusieurs exemples dans le projet ApiDemos:

/ ApiDemos / res / drawable /

  • black_box.xml
  • shape_5.xml
  • etc

Cela ressemblera à ceci pour un cercle avec un remplissage en dégradé:

<? xml version = "1.0" encoding = "utf-8"?>
<shape xmlns: android = "http://schemas.android.com/apk/res/android" android: forme = "ovale">
    <gradient android: startColor = "# FFFF0000" android: endColor = "# 80FF00FF"
            android: angle = "270" />
</ shape>


45
2017-08-11 17:32



Vous pouvez utiliser VectorDrawable comme ci-dessous:

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="200dp"
    android:height="200dp"
    android:viewportHeight="64"
    android:viewportWidth="64">

    <path
        android:fillColor="#ff00ff"
        android:pathData="M22,32
        A10,10 0 1,1 42,32
        A10,10 0 1,1 22,32 Z" />
</vector>

Le rendu XML ci-dessus est:

enter image description here


39
2017-07-29 16:17



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

    <!-- fill color -->
    <solid android:color="@color/white" />

    <!-- radius -->
    <stroke
        android:width="1dp"
        android:color="@color/white" />

    <!-- corners -->
    <corners
        android:radius="2dp"/>
</shape>

18
2018-01-29 10:00



Voici un simple circle_background.xml pour le pré-matériel:

<?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="oval">
            <solid android:color="@color/color_accent_dark" />
        </shape>
    </item>
    <item>
        <shape android:shape="oval">
            <solid android:color="@color/color_accent" />
        </shape>
    </item>
</selector>

Vous pouvez utiliser avec l'attribut 'android:background="@drawable/circle_background" dans la définition de mise en page de votre bouton


15
2018-06-09 23:28



Si vous voulez un cercle comme ça:

enter image description here

Essayez d'utiliser le code ci-dessous:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:innerRadius="0dp"
android:shape="ring"
android:thicknessRatio="2"
android:useLevel="false" >
<solid android:color="@android:color/white" />
<stroke
    android:width="1dp"
    android:color="@android:color/darker_gray" /></shape>

7
2018-02-06 09:36



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

    <stroke
        android:width="10dp"
        android:color="@color/white"/>

    <gradient
        android:startColor="@color/red"
        android:centerColor="@color/red"
        android:endColor="@color/red"
        android:angle="270"/>

    <size 
        android:width="250dp" 
        android:height="250dp"/>
</shape>

6
2018-04-10 12:05



Je ne pouvais pas dessiner un cercle à l'intérieur de mon ConstraintLayout pour une raison quelconque, je ne pouvais pas utiliser les réponses ci-dessus.

Qu'est-ce qui fonctionne parfaitement est un simple TextView avec le texte qui sort, lorsque vous appuyez sur "Alt + 7":

 <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="#0075bc"
            android:textSize="40dp"
            android:text="•"></TextView>

0
2018-05-01 13:52



Vous pouvez essayer ceci -

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring"
    android:innerRadiusRatio="700"
    android:thickness="100dp"
    android:useLevel="false">

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

</shape>

En outre, vous pouvez ajuster le rayon du cercle en ajustant android:thickness.

enter image description here


0
2018-06-07 08:39