221 votes

Bouton circulaire personnalisé

Je veux créer un bouton personnalisé et j'ai besoin qu'il soit circulaire. Comment puis-je créer un bouton circulaire ? Je ne pense pas que cela soit possible avec draw9patch.

Je ne sais pas non plus comment créer un bouton personnalisé !

Avez-vous une suggestion ?

0 votes

Vous devez étendre la classe du bouton et surcharger la méthode onDraw.

2 votes

Mais le problème est que si j'étend cela, et que l'utilisateur touche en dehors du cercle, Onlcick sera appelé, comment résoudre cela ?

0 votes

Pourquoi ne pas simplement définir une image de forme ronde comme arrière-plan de votre bouton ?

0voto

40-Love Points 1333

Créez une nouvelle ressource vectorielle dans le dossier drawable.

Vous pouvez également importer votre image PNG et convertir le fichier en SVG en ligne à l'adresse suivante https://image.online-convert.com/convert-to-svg . Plus la résolution est élevée, meilleure sera la conversion.

Ensuite, créez une nouvelle ressource vectorielle à partir de ce fichier SVG.

Voici un exemple d'image vectorielle de cercle que vous pouvez utiliser. Copiez le code dans un fichier xml dans le dossier drawables.

ic_check.xml :

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportHeight="256"
    android:viewportWidth="256">
    <path
        android:fillColor="#2962FF"
        android:pathData="M111,1.7c-7.2,1.1 -22.2,4.8 -27.9,7 -33.2,12.5 -61.3,40.3 -74.1,73.3 -8.7,22.6 -10.5,55.3 -4.4,78 10.9,40 39.7,72.4 77.4,87 22.6,8.7 55.3,10.5 78,4.4 45.3,-12.3 79.1,-46.1 91.4,-91.4 2.9,-10.7 3.9,-21.9 3.3,-37.4 -0.7,-21.2 -4.6,-35.9 -14,-54.1 -18.2,-35 -54,-60.5 -93.4,-66.4 -6.7,-1 -30.7,-1.3 -36.3,-0.4zM145,23.1c21.8,3.3 46.5,16.5 61.1,32.8 20.4,22.6 30.1,51.2 27.7,81.1 -3.5,44.4 -35.9,82.7 -79.6,94 -21.6,5.6 -46.6,3.7 -67.8,-5.1 -10.4,-4.3 -24.7,-14.1 -33.4,-22.9 -41.6,-41.5 -41.6,-108.4 0,-150 24.3,-24.3 57.6,-35.1 92,-29.9z"
        android:strokeColor="#00000000" />
    <path
        android:fillColor="#2962FF"
        android:pathData="M148.4,113c-24.6,26 -43.3,44.9 -44,44.6 -0.7,-0.3 -8.5,-6.1 -17.3,-13 -8.9,-6.9 -16.5,-12.6 -17,-12.6 -1.4,-0 -25.6,19 -25.8,20.3 -0.3,1.4 62.7,50.2 64.8,50.2 1.7,-0 108.4,-112.3 108.4,-114.1 0,-1.3 -23.8,-20.4 -25.4,-20.4 -0.6,-0 -20.2,20.3 -43.7,45z"
        android:strokeColor="#00000000" />
</vector>

Utilisez cette image dans votre bouton :

<ImageButton
    android:id="@+id/btn_level1"
    android:layout_width="36dp"
    android:layout_height="36dp"
    android:background="@drawable/ic_check"
/>

Votre bouton sera un bouton circulaire.

enter image description here

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X