Um botão consiste em texto ou ícone, ou ambos, que comunica a ação que ocorre quando o usuário tocar nele.
É possível criar um botão no layout de três maneiras, dependendo seja um botão com texto, um ícone ou ambos:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="16dp" android:paddingRight="16dp" android:orientation="vertical" > <Button android:id="@+id/supabutton" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="I'm a button" /> <ImageButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:contentDescription="A tiny Android icon" android:src="@drawable/baseline_android_24" app:tint="#ff0000" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:drawableStart="@drawable/baseline_android_24" android:drawablePadding="4dp" android:drawableTint="#ff0000" android:text="I'm a button with an icon" /> </LinearLayout>
O código anterior gera algo parecido com isto:
Responder a eventos de clique
Quando o usuário toca em um botão, a
Button
recebe um
evento de clique.
Para declarar o manipulador de eventos de forma programática, crie um
View.OnClickListener
e o atribui ao botão chamando
setOnClickListener(View.OnClickListener)
,
como no exemplo a seguir:
Kotlin
findViewById<Button>(R.id.supabutton) .setOnClickListener { Log.d("BUTTONS", "User tapped the Supabutton") }
Java
Button button = (Button) findViewById(R.id.supabutton); button.setOnClickListener(new View.OnClickListener() { public void onClick(View v) { Log.d("BUTTONS", "User tapped the Supabutton"); } });
Estilizar o botão
A aparência do botão (a imagem de plano de fundo e a fonte) varia de acordo com o dispositivo, porque dispositivos de fabricantes diferentes costumam ter estilos padrão diferentes para entrada controles de segurança.
Para personalizar botões individuais com um plano de fundo diferente, especifique o
Atributo android:background
com um drawable ou um recurso de cor. Como alternativa, você pode aplicar um estilo para o botão,
que funciona de modo semelhante aos estilos HTML para definir várias propriedades de estilo, como plano de fundo,
fonte e tamanho. Para mais informações sobre como aplicar estilos, consulte
Estilos e temas.
Botão sem bordas
Um design que pode ser útil é o de um botão "sem bordas". Os botões sem borda são parecidos com botões básicos exceto que não têm bordas nem plano de fundo, mas ainda mudam de aparência durante diferentes estados, como quando tocado.
Para criar um botão sem bordas, aplique o
borderlessButtonStyle
ao botão, como no exemplo a seguir:
<Button android:id="@+id/supabutton" style="?android:attr/borderlessButtonStyle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="I'm a button" />
Plano de fundo personalizado
Se você quiser realmente redefinir a aparência do seu botão, você pode especificar um plano de fundo personalizado. No entanto, em vez de fornecer um bitmap ou uma cor simples, o plano de fundo precisa ser uma lista de estados. recurso que muda de aparência dependendo do estado atual do botão.
Você pode definir a lista de estados em um arquivo XML que define três imagens ou cores a serem usadas para o diferentes estados de botão.
Para criar um drawable de lista de estados para o plano de fundo do botão, faça o seguinte:
- Criar três bitmaps para o plano de fundo do botão que representem o padrão, tocado e em foco estados de botão. Para garantir que suas imagens caibam em botões de vários tamanhos, crie os bitmaps como bitmaps de npm-patch.
- Coloque os bitmaps no diretório
res/drawable/
do projeto. Nomeie cada bitmap para refletir o estado do botão que representa, por exemplo,button_default.9.png
.button_pressed.9.png
ebutton_focused.9.png
. - Crie um novo arquivo XML no diretório
res/drawable/
. Dê um nome comobutton_custom.xml
: Insira o XML desta forma:<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/button_pressed" android:state_pressed="true" /> <item android:drawable="@drawable/button_focused" android:state_focused="true" /> <item android:drawable="@drawable/button_default" /> </selector>
Define um único recurso desenhável que altera sua imagem de acordo com o estado atual do o botão.
- O primeiro
<item>
define o bitmap que será usado quando o botão for tocado (ativado). - A segunda
<item>
define o bitmap a ser usado quando o botão estiver em foco, como como quando o botão é destacado usando o trackball ou o botão direcional. - O terceiro
<item>
define o bitmap a ser usado quando o botão estiver no padrão. estado, sem toque nem focado.
Esse arquivo XML representa um único recurso drawable. Quando referenciado por um
Button
para seu plano de fundo, a imagem exibida muda com base no estado do botão. - O primeiro
- Aplique o arquivo XML do drawable como plano de fundo do botão:
<Button android:id="@+id/button_send" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/button_send" android:onClick="sendMessage" android:background="@drawable/button_custom" />
Para mais informações sobre essa sintaxe XML, incluindo como definir um botão desativado,
passou o cursor ou, em outro estado, ler sobre
StateListDrawable
: