Tutorial Android #14 – Ajustando o Layout para Paisagem (II)

Padrão

Olá pessoal! No tutorial de hoje vamos voltar a um tema já tratado superficialmente alguns posts atrás: a adaptação do layout da aplicação Lista de Restaurantes também para o modo paisagem. Não sei se vocês chegaram a testar o exemplo do tutorial 10, mas naquela situação tínhamos um pequeno problema: ao rotacionar a tela para modo paisagem / retrato, perdíamos o conteúdo do formulário, caso alguma coisa tivesse sido digitada.

No tutorial de hoje vamos fazer a rotação de uma maneira mais organizada, resolvendo também este problema. Todos prontos? 🙂

Primeiramente, precisamos de uma forma de armazenar os valores no caso da mudança de orientação do celular. Lá na classe FormularioDetalhes, vamos sobrescrever o método onSaveInstanceState(), que armazenará os valores pra gente. Adicione a seguinte implementação ao final da classe:

@Override<br />
public void onSaveInstanceState(Bundle outState) {<br />
	super.onSaveInstanceState(outState);</p>
<p>	outState.putString(&quot;nome&quot;, nome.getText().toString());<br />
	outState.putString(&quot;endereco&quot;, endereco.getText().toString());<br />
	outState.putString(&quot;anotacoes&quot;, anotacoes.getText().toString());<br />
	outState.putInt(&quot;tipo&quot;, tipos.getCheckedRadioButtonId());<br />
}

Pronto. Já fizemos com que os valores do formulário fossem salvos. Agora, vamos implementar o método onRestoreInstanceState() que devolverá os dados no formulário.

@Override<br />
public void onRestoreInstanceState(Bundle savedInstanceState) {<br />
	super.onRestoreInstanceState(savedInstanceState);</p>
<p>	nome.setText(savedInstanceState.getString(&quot;nome&quot;));<br />
	endereco.setText(savedInstanceState.getString(&quot;endereco&quot;));<br />
	anotacoes.setText(savedInstanceState.getString(&quot;anotacoes&quot;));<br />
	tipos.check(savedInstanceState.getInt(&quot;tipo&quot;));<br />
}

Por fim, vamos definir novamente o nosso layout em modo paisagem. Crie novamente a pasta (se você a excluiu) res/layout-land e crie o arquivo form_detalhes.xml. Se você ainda tem o arquivo main.xml lá, exclua-o.

&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;<br />
&lt;TableLayout xmlns:android=&quot;http://schemas.android.com/apk/res/android&quot;<br />
    android:layout_width=&quot;fill_parent&quot;<br />
    android:layout_height=&quot;wrap_content&quot;<br />
    android:stretchColumns=&quot;1,3&quot; &gt;<br />
    &lt;TableRow&gt;<br />
        &lt;TextView android:text=&quot;Nome:&quot;/&gt;<br />
        &lt;EditText android:id=&quot;@+id/nome&quot;<br />
            android:layout_span=&quot;3&quot; /&gt;<br />
    &lt;/TableRow&gt;<br />
    &lt;TableRow&gt;<br />
    	&lt;TextView android:text=&quot;Endereço:&quot;/&gt;<br />
    	&lt;EditText android:id=&quot;@+id/end&quot;<br />
            android:layout_span=&quot;3&quot; /&gt;<br />
    &lt;/TableRow&gt;<br />
    &lt;TableRow&gt;<br />
    	&lt;TextView android:text=&quot;Tipo:&quot;/&gt;<br />
    	&lt;RadioGroup android:id=&quot;@+id/tipos&quot;&gt;<br />
    		&lt;RadioButton android:id=&quot;@+id/rodizio&quot;<br />
       			android:text=&quot;Rodízio&quot;/&gt;<br />
    		&lt;RadioButton android:id=&quot;@+id/fast_food&quot;<br />
        		android:text=&quot;Fast Food&quot;/&gt;<br />
        	&lt;RadioButton android:id=&quot;@+id/a_domicilio&quot;<br />
            	android:text=&quot;A Domicílio&quot;/&gt;<br />
   		&lt;/RadioGroup&gt;<br />
   		&lt;TextView android:text=&quot;Anotações:&quot;/&gt;<br />
   		&lt;LinearLayout<br />
   		    android:layout_width=&quot;fill_parent&quot;<br />
   		    android:layout_height=&quot;fill_parent&quot;<br />
   		    android:orientation=&quot;vertical&quot;&gt;<br />
   		    &lt;EditText android:id=&quot;@+id/anotacoes&quot;<br />
    			android:singleLine=&quot;false&quot;<br />
	    		android:gravity=&quot;top&quot;<br />
    			android:lines=&quot;4&quot;<br />
    			android:scrollHorizontally=&quot;false&quot;<br />
    			android:maxLines=&quot;4&quot;<br />
    			android:maxWidth=&quot;140sp&quot;<br />
    			android:layout_width=&quot;fill_parent&quot;<br />
    			android:layout_height=&quot;wrap_content&quot;/&gt;<br />
   		    &lt;Button android:id=&quot;@+id/salvar&quot;<br />
    			android:layout_width=&quot;fill_parent&quot;<br />
        		android:layout_height=&quot;wrap_content&quot;<br />
        		android:text=&quot;Salvar&quot;/&gt;<br />
   		&lt;/LinearLayout&gt;<br />
	&lt;/TableRow&gt;<br />
&lt;/TableLayout&gt;

E pronto! Quanto a tela de listagem, não precisamos alterar seu layout pois ele funciona bem tanto em modo retrato quanto paisagem.

Quem quiser baixar o projeto, só clicar aqui. Até o próximo post!

Obs: após a última atualização do plugin ADT do Eclipse, ele acusou alguns ‘warnings‘ nos layouts XML. Por enquanto não se preocupem com isso! 😉