Existe alguma maneira de criar EditText
cantos arredondados?
280
Existe alguma maneira de criar EditText
cantos arredondados?
Existe uma maneira mais fácil do que a escrita pelo CommonsWare. Basta criar um recurso desenhável que especifique a maneira como o EditText
desenho será desenhado:
<?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>
Em seguida, basta referenciar este drawable em seu layout:
<?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>
Você receberá algo como:
Com base no comentário de Mark, quero adicionar a maneira como você pode criar estados diferentes para o seu 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>
Estes são os estados:
<?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>
E ... agora, a EditText
aparência deve ser:
<?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
tem planos de fundo diferentes para focado, desativado, pressionado e selecionado, além do padrão. O foco, em particular, pode ser importante no futuro, se conseguirmos alguns dispositivos Android que não possuem telas sensíveis ao toque, como o Google TV.android:radius
em vez de definir 4 linhasAqui está a mesma solução (com algum código de bônus extra) em apenas um arquivo XML:
Depois, basta definir o atributo background para o arquivo edittext_rounded_corners.xml:
fonte
topRightRadius
etopLeftRadius
os quatro cantos acabavam arredondados. Por favor ajude. :(Tente este,
1.Crie o arquivo rounded_edittext.xml no seu Drawable
2.Aplique o plano de fundo para o seu EditText no arquivo xml
3.Você obterá uma saída como esta
fonte
Obrigado pela resposta de Norfeldt. Fiz uma pequena alteração no gradiente para obter um melhor efeito de sombra interna.
Parece ótimo em um layout de plano de fundo claro ..
fonte
Na minha opinião, ele já tem cantos arredondados.
Caso você os queira mais arredondados, precisará:
EditText
plano de fundo (encontradas no seu SDK)StateListDrawable
recurso XML que combina essesEditText
planos de fundo em um únicoDrawable
e modifique-o para apontar para seus arquivos PNG de nove patches mais arredondadosStateListDrawable
como pano de fundo para o seuEditText
widgetfonte
Se você deseja que apenas o canto não faça uma curva completa, use o código abaixo.
Apenas curva os quatro ângulos de
EditText
.fonte
Apenas para acrescentar às outras respostas, descobri que a solução mais simples para obter os cantos arredondados era definir o seguinte como pano de fundo para o seu Texto de edição.
fonte
Com a Biblioteca de componentes de material, você pode usar o
MaterialShapeDrawable
para desenhar formas personalizadas .Com um
EditText
você pode fazer:Em seguida, crie um
MaterialShapeDrawable
:Requer a versão 1.1.0 da biblioteca.
fonte