domingo, 20 de setembro de 2015

Android Básico: Transição entre telas


   No post de hoje mostraremos como capturar o evento de um botão, como chamar uma Activity a partir de outra, o uso do xml de strings e criação de novas telas além da padrão.
   Primeiro criamos uma tela com um botão centralizado na mesma. Não me preocupei com o layout mas apenas com a funcionalidade:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="horizontal"   >

    <Button        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="@string/strNovatela"        android:layout_gravity="center_vertical"        android:id="@+id/btnNovaTela"
        />
</LinearLayout>
   
   O que mudei na tela que o android cria de padrão:
   Mudei o formato de RelativeLayout para LinearLayout.
  O LinearLayout trabalha com os componentes visuais seguindo uma determinada orientação: Horizontal ou vertical. Mudei para ele para mostrar que há outros tipos de layout além do RelativeLayout.
   Depois criei um botão e coloquei a largura para completar a tela toda. Coloquei um texto "Nova Tela" no campo text, depois explico pq está mostrando @string, e coloquei um identificador: btnNovaTela esse identificador será importante mais tarde. Perceba que para criar um identificador de um campo você atribui a propriedade id um valor que comece com "@+id".
 Ao final a tela ficou assim:
   


   Segundo Passo: Criar o código para capturar o botão e seu clique:
   Modifiquei a classe MainActivity que foi criada automaticamente pelo Android e a fiz implementar a interface View.OnClickListener, esta interface estabelece o método onClick de um objeto visual (View). Fazendo desta forma ficamos com um código menos poluído, pois uma outra forma seria criar uma classe inline do java.
   Feito isto capturamos o botão:
   Button btnNovaTela = (Button) findViewById(R.id.btnNovaTela);
   O método findViewById é responsável por recuperar o objeto do xml com o identificador passado no parametro. A classe R, guarda todos os ids criados e a usamos para recuperar o botão com o id btnNovaTela.
   Temos que fazer o cast para um objeto Button e agora podemos ter acesso aos métodos do botão.
   Próximo passo é indicar para o botão quem vai ser responsável por capturar seu click:
   btnNovaTela.setOnClickListener(this);
   No caso usamos nossa própria classe (this).
   Agora falta colocar o método para chamar nossa futura tela:
   Para chamar outra tela é muito simples:
   Utilizamos o objeto Intent para dizer ao Android que temos a intenção de chamar uma nova tela:
   Colocamos nossa classe como contexto e a tela a ser chamada no outro parâmetro e em  seguida executamos o startActivity. 
     Intent intent = new Intent(MainActivity.this,NovaTela.class);
   startActivity(intent);

   public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    @Override    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //Tratando o botão da tela:        
        Button btnNovaTela = (Button) findViewById(R.id.btnNovaTela);
        btnNovaTela.setOnClickListener(this);

    }


    @Override    public void onClick(View v) {
        //Se houvesse mais de um botão seria necessário colocar um switch  
      Intent intent = new Intent(MainActivity.this,NovaTela.class);
      startActivity(intent);
    }

   Criamos o código mas ainda falta criar a nova Activiy ou o código não compilará:
   Para criar a classe e o xml ao mesmo tempo o modo mais fácil é clicar em new, xml e após LayoutXml:
   


   


   Escolhi o mesmo nome que coloquei na classe anterior: NovaTela.
   Automaticamente o Android cria o xml da Activity e sua classe.
   Inclusive ele coloca a referência da mesma  no AndroidManifest:

    <activity  android:name=".NovaTela" android:label="@string/title_activity_nova_tela" >
    </activity>
    </application>
  
  Vamos a criação do xml da tela que aparecerá após o clique do botão:
   Modificamos o xml criado pelo Android para:
   <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="horizontal"    >


    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:textAppearance="?android:attr/textAppearanceLarge"        android:text="CONSEGUIMOS!!"        android:id="@+id/textView"        />
</LinearLayout>
   
   A tela ficou assim:
   


   Agora o código está pronto, basta executar e quando você clicar o botão ele chamará a segunda tela. Não foi preciso modificar uma linha de código sequer da classe NovaTela.
   Antes que eu me esqueça segue como colocar os textos no xml de Strings:
   

   
   Quando você clica Alt + Enter em cima de um texto aparece a opção de extrair o mesmo para o xml de Strings. Depois basta dar um nome para o texto e ele grava automaticamente lá:
   


   Bom, por hoje é só.
   Até a próxima!


Nenhum comentário:

Postar um comentário