Existe-t-il un moyen de créer EditText
des coins arrondis?
280
Existe-t-il un moyen de créer EditText
des coins arrondis?
Il existe un moyen plus simple que celui écrit par CommonsWare. Il suffit de créer une ressource à dessiner qui spécifie la façon dont le EditText
sera dessiné:
<?xml version="1.0" encoding="utf-8"?>
<!-- res/drawable/rounded_edittext.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
<solid android:color="#FFFFFF"/>
<corners
android:bottomRightRadius="15dp"
android:bottomLeftRadius="15dp"
android:topLeftRadius="15dp"
android:topRightRadius="15dp"/>
</shape>
Ensuite, référencez simplement ce dessin dans votre mise en page:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="5dip"
android:background="@drawable/rounded_edittext" />
</LinearLayout>
Vous obtiendrez quelque chose comme:
Sur la base du commentaire de Mark, je veux ajouter la façon dont vous pouvez créer différents états pour votre EditText
:
<?xml version="1.0" encoding="utf-8"?>
<!-- res/drawable/rounded_edittext_states.xml -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="true"
android:state_enabled="true"
android:drawable="@drawable/rounded_focused" />
<item
android:state_focused="true"
android:state_enabled="true"
android:drawable="@drawable/rounded_focused" />
<item
android:state_enabled="true"
android:drawable="@drawable/rounded_edittext" />
</selector>
Ce sont les états:
<?xml version="1.0" encoding="utf-8"?>
<!-- res/drawable/rounded_edittext_focused.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
<solid android:color="#FFFFFF"/>
<stroke android:width="2dp" android:color="#FF0000" />
<corners
android:bottomRightRadius="15dp"
android:bottomLeftRadius="15dp"
android:topLeftRadius="15dp"
android:topRightRadius="15dp"/>
</shape>
Et ... maintenant, le EditText
devrait ressembler à:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/hello"
android:background="@drawable/rounded_edittext_states"
android:padding="5dip"/>
</LinearLayout>
EditText
a des arrière-plans différents pour la mise au point, la désactivation, la pression et la sélection, outre la valeur par défaut. La concentration, en particulier, peut être importante à l'avenir si nous obtenons des appareils Android dépourvus d'écrans tactiles, comme Google TV.android:radius
plutôt que de définir 4 lignesVoici la même solution (avec du code bonus supplémentaire) dans un seul fichier XML:
Vous définissez ensuite l'attribut background sur le fichier edittext_rounded_corners.xml:
la source
topRightRadius
et quetopLeftRadius
les quatre coins sont arrondis. Veuillez aider. :(Essaye celui-là,
1.Créez le fichier round_edittext.xml dans votre Drawable
2.Appliquez l'arrière-plan de votre EditText dans un fichier xml
3.Vous obtiendrez une sortie comme celle-ci
la source
Merci pour la réponse de Norfeldt. J'ai fait un léger changement dans son dégradé pour un meilleur effet d'ombre intérieure.
A l'air bien dans une mise en page claire.
la source
Par ma façon de penser, il a déjà des coins arrondis.
Au cas où vous voudriez qu'ils soient plus arrondis, vous devrez:
EditText
arrière-plan (trouvées dans votre SDK)StateListDrawable
ressource XML qui combine cesEditText
arrière-plans en un seulDrawable
et modifiez-la pour pointer vers vos fichiers PNG à neuf correctifs plus completsStateListDrawable
comme arrière-plan pour votreEditText
widgetla source
Si vous voulez que le coin ne courbe pas la fin entière, utilisez le code ci-dessous.
Il ne courbera que les quatre angles de
EditText
.la source
Juste pour ajouter aux autres réponses, j'ai trouvé que la solution la plus simple pour atteindre les coins arrondis était de définir ce qui suit comme arrière-plan de votre Edittext.
la source
Avec la bibliothèque de composants de matériaux, vous pouvez utiliser le
MaterialShapeDrawable
pour dessiner des formes personnalisées .Avec un,
EditText
vous pouvez faire:Créez ensuite un
MaterialShapeDrawable
:Il nécessite la version 1.1.0 de la bibliothèque.
la source