Tutorial Android 4 #5 – Aprimorando o Formulário

Padrão

Olá pessoal! Hoje, dando continuidade aos nossos tutoriais sobre desenvolvimento para Android, vamos continuar com a nossa aplicação Meus Contatos. No post de hoje, vamos adicionar a opção de categorizar o tipo de contato, mapeando-o como um enumerador na classe de modelo.

Bom, sem mais delongas, vamos começar a fazer a no nosso layout para abrigar essa categorização. Adicionaremos alguns itens do tipo RadioButton (aqueles botões marcadores) em nosso formulário (arquivo layout/activity_meus_contatos.xml). Adicione o TextView com a legenda do campo recém inserido e os itens RadioGroup e RadioButton, conforme o código a seguir:

&lt;RelativeLayout xmlns:android=&quot;http://schemas.android.com/apk/res/android&quot;<br />
    xmlns:tools=&quot;http://schemas.android.com/tools&quot;<br />
    android:layout_width=&quot;match_parent&quot;<br />
    android:layout_height=&quot;match_parent&quot;<br />
    tools:context=&quot;.MeusContatos&quot; &gt;</p>
<p>    &lt;LinearLayout<br />
        android:layout_width=&quot;match_parent&quot;<br />
        android:layout_height=&quot;wrap_content&quot;<br />
        android:layout_alignParentTop=&quot;true&quot;<br />
        android:orientation=&quot;vertical&quot; &gt;</p>
<p>        &lt;TextView<br />
            android:layout_width=&quot;wrap_content&quot;<br />
            android:layout_height=&quot;wrap_content&quot;<br />
            android:text=&quot;@string/nome&quot; /&gt;</p>
<p>        &lt;EditText<br />
            android:id=&quot;@+id/nome&quot;<br />
            android:layout_width=&quot;fill_parent&quot;<br />
            android:layout_height=&quot;wrap_content&quot;<br />
            android:inputType=&quot;text&quot; /&gt;</p>
<p>        &lt;TextView<br />
            android:layout_width=&quot;wrap_content&quot;<br />
            android:layout_height=&quot;wrap_content&quot;<br />
            android:text=&quot;@string/email&quot; /&gt;</p>
<p>        &lt;EditText<br />
            android:id=&quot;@+id/email&quot;<br />
            android:layout_width=&quot;fill_parent&quot;<br />
            android:layout_height=&quot;wrap_content&quot;<br />
            android:inputType=&quot;textEmailAddress&quot; /&gt;</p>
<p>        &lt;TextView<br />
            android:layout_width=&quot;wrap_content&quot;<br />
            android:layout_height=&quot;wrap_content&quot;<br />
            android:text=&quot;@string/tipo_contato&quot; /&gt;</p>
<p>        &lt;RadioGroup<br />
            android:id=&quot;@+id/tipo_contato&quot;<br />
            android:layout_width=&quot;fill_parent&quot;<br />
            android:layout_height=&quot;wrap_content&quot; &gt;</p>
<p>            &lt;RadioButton<br />
                android:id=&quot;@+id/pessoal&quot;<br />
                android:layout_width=&quot;wrap_content&quot;<br />
                android:layout_height=&quot;wrap_content&quot;<br />
                android:text=&quot;@string/tipo_pessoal&quot; /&gt;</p>
<p>            &lt;RadioButton<br />
                android:id=&quot;@+id/profissional&quot;<br />
                android:layout_width=&quot;wrap_content&quot;<br />
                android:layout_height=&quot;wrap_content&quot;<br />
                android:text=&quot;@string/tipo_profissional&quot; /&gt;</p>
<p>            &lt;RadioButton<br />
                android:id=&quot;@+id/academico&quot;<br />
                android:layout_width=&quot;wrap_content&quot;<br />
                android:layout_height=&quot;wrap_content&quot;<br />
                android:text=&quot;@string/tipo_academico&quot; /&gt;<br />
        &lt;/RadioGroup&gt;<br />
    &lt;/LinearLayout&gt;</p>
<p>    &lt;Button<br />
        android:id=&quot;@+id/salvar&quot;<br />
        android:layout_width=&quot;fill_parent&quot;<br />
        android:layout_height=&quot;wrap_content&quot;<br />
        android:layout_alignParentBottom=&quot;true&quot;<br />
        android:text=&quot;@string/salvar&quot; /&gt;</p>
<p>&lt;/RelativeLayout&gt;

Para o elemento RadioGroup, definimos o atributo identificador, no exemplo definido como tipo_contato, que será o meio pelo qual iremos acessá-lo no código-fonte Java. Internos a ele, temos os elementos do tipo RadioButton. Em nosso exemplo, definimos as opções PessoalProfissional e Acadêmico. Tivemos também a adição de alguns valores ao arquivo values/strings.xml:

&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;<br />
&lt;resources&gt;</p>
<p>    &lt;string name=&quot;app_name&quot;&gt;Meus Contatos&lt;/string&gt;<br />
    &lt;string name=&quot;menu_settings&quot;&gt;Settings&lt;/string&gt;<br />
    &lt;string name=&quot;nome&quot;&gt;Nome:&lt;/string&gt;<br />
    &lt;string name=&quot;email&quot;&gt;E-mail:&lt;/string&gt;<br />
    &lt;string name=&quot;salvar&quot;&gt;Salvar&lt;/string&gt;<br />
    &lt;string name=&quot;tipo_contato&quot;&gt;Tipo de Contato:&lt;/string&gt;<br />
    &lt;string name=&quot;tipo_pessoal&quot;&gt;Pessoal&lt;/string&gt;<br />
    &lt;string name=&quot;tipo_profissional&quot;&gt;Profissional&lt;/string&gt;<br />
    &lt;string name=&quot;tipo_academico&quot;&gt;Acadêmico&lt;/string&gt;</p>
<p>&lt;/resources&gt;

O próximo passo é mapearmos estas opções no código-fonte Java. Primeiramente, precisamos modificar nossa classe Contato para abrigar o tipo. Vamos definir enumerador interno para estes tipos e em seguida criar um atributo interno desse tipo recém-criado:

package net.rafaeltoledo.meuscontatos.model;</p>
<p>public class Contato {</p>
<p>	private String nome;<br />
	private String email;<br />
	private Tipo tipo;</p>
<p>	public String getNome() {<br />
		return nome;<br />
	}</p>
<p>	public void setNome(String nome) {<br />
		this.nome = nome;<br />
	}</p>
<p>	public String getEmail() {<br />
		return email;<br />
	}</p>
<p>	public void setEmail(String email) {<br />
		this.email = email;<br />
	}</p>
<p>	public Tipo getTipo() {<br />
		return tipo;<br />
	}</p>
<p>	public void setTipo(Tipo tipo) {<br />
		this.tipo = tipo;<br />
	}</p>
<p>	public static enum Tipo {<br />
		PESSOAL,<br />
		PROFISSIONAL,<br />
		ACADEMICO<br />
	}<br />
}

Vamos agora alterar o código da nossa Activity, para obtermos a opção selecionada pelo usuário. Dentro do método onClick, vamos adicionar um trecho de código puxando os dados do RadioGroup e verificando seu status de acordo com a opção selecionada. O código fica assim:

@Override<br />
public void onClick(View v) {<br />
	EditText nome = (EditText) findViewById(R.id.nome);<br />
	EditText email = (EditText) findViewById(R.id.email);</p>
<p>	contato.setNome(nome.getText().toString());<br />
	contato.setEmail(email.getText().toString());</p>
<p>	RadioGroup tipoContato = (RadioGroup) findViewById(R.id.tipo_contato);</p>
<p>	switch (tipoContato.getCheckedRadioButtonId()) {<br />
	case R.id.pessoal:<br />
		contato.setTipo(Contato.Tipo.PESSOAL);<br />
		break;<br />
	case R.id.profissional:<br />
		contato.setTipo(Contato.Tipo.PROFISSIONAL);<br />
		break;<br />
	case R.id.academico:<br />
		contato.setTipo(Contato.Tipo.ACADEMICO);<br />
		break;<br />
	}<br />
}

Obtemos o elemento tipo_contato da mesma forma que fizemos para nome e email, utilizando o método findViewById(). Logo após isso, fazemos um switch com o conteúdo do método getCheckedRadioButtonId(), de acordo com o id de cada um dos botões definidos por nós. Ao final, nosso formulário estará assim:

clique para ampliar

Pra quem não conseguiu acompanhar ou teve problemas, o projeto pode ser baixado aqui.

Bom pessoal, é isso! Espero que estejam gostando dos posts. Comentem, deixem sugestões e participem do blog, afinal, ele é feito pra vocês leitores!

Até a próxima!