sexta-feira, 13 de fevereiro de 2015

Android Custom Dialog (Dialog Customizado)

Android Custom Dialog (Dialog Customizado)


    Algumas vezes precisamos efetivar algum procedimento sem que para isso seja necessário sair da Activity, por exemplo abrir um calculadora em uma Activity de despesas. É aí que o Dialog vem para nos ajudar. Neste tutorial estarei utilizando o Android Studio 1.0.2 , veja os passos que iremos realizar.


  • Criar uma MainActivity 
  • Criar um Layout para o Dialog
  • Criar o Dialog na classe MainActivity
    O nosso projeto ficará assim:

Layout da MainActivity


Layout do Dialog



    Ao criar um projeto no Android Studio ele já cria a MainActivity prara você, dessa forma você precisa apenas editar o layout da MainActivity, abaixo segue o código do layout  activity_main.xml.


activity_main.xml



<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Abrir Dialog"
        android:id="@+id/button"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="103dp" />
</RelativeLayout>

    Agora você deve criar um novo arquivo xml que será o nosso dialog_layout.xml para que possamos defini-lo como ContentView do nosso Dialog, crie um arquivo xml na pasta de layout do seu projeto no mesmo lugar onde está o layout da MainActivity, abaixo o código do dialog_layout.


dialog_layout.xml



<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="match_parent">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:text="Nome:"
        android:id="@+id/textView"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginLeft="29dp"
        android:layout_marginStart="29dp"
        android:layout_marginTop="58dp" />

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/editText"
        android:layout_alignTop="@+id/textView"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:layout_toRightOf="@+id/textView"
        android:layout_toEndOf="@+id/textView" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Mostrar na tela"
        android:id="@+id/button_dialog"
        android:layout_below="@+id/editText"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="56dp" />
</RelativeLayout>

    Agora vamos criar o nosso Dialog na classe MainActivity para que quando o usuário clique no botão "Abrir Dialog" o nosso Dialog apareça. Veja o código abaixo.


MainActivity.java


package com.inforprogramm.auladialog;


import android.app.Activity;
import android.app.Dialog;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;


public class MainActivity extends Activity {

    //Cria as variaveis
    private Button button;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        //instacia o botao
        button = (Button) findViewById(R.id.button);

        //cria a acao do botao
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //Agora vamos criar o dialog
                final Dialog dialog = new Dialog(MainActivity.this);
                //define o layout que criamos como contentView do nosso dialog
                dialog.setContentView(R.layout.dialog_layout);
                //Cria o titulo do dialog
                dialog.setTitle("Meu Dialog!");
                //cria o botao do nosso dialog passando o id do botao que criamos no dialog_layout
                Button botaoDialog = (Button) dialog.findViewById(R.id.button_dialog);
                // cria a caixa de texto EditText do nosso Dialog passando o id do EditText que criamos
                final EditText edtText = (EditText) dialog.findViewById(R.id.editText);

                //criamos a acao do botao do dialog
                botaoDialog.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        //pegamos o texto da caixa de texto e mostramos na tela
                        String texto = edtText.getText().toString();
                        Toast.makeText(MainActivity.this,"O nome é: "+texto,Toast.LENGTH_SHORT).show();
                        //fecha o dialog
                        dialog.dismiss();

                    }
                });
                //mostra o dialog
                dialog.show();
            }
        });


    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}



    Para baixar os códigos desse tutorial clique aqui: Android Dialog













Nenhum comentário:

Postar um comentário