Aprenda Android

  • Página Inicial
  • Contato!
  • Tudo sobre Android Parte 1!
  • Tudo sobre Android Parte 2!
  • Tudo sobre Android Parte 3!
  • Tudo sobre Android Parte 4!
  • Tudo sobre Android Parte 3

    Jogo da Velha - Traçando a Linha na Finalização do Jogo

    Em res, values, crie um values resource file XML com o nome cor e esse código:

    
    <resources>
        <color name="red">#FF0000</color>
    </resources>
    
    

    Crie esse método no Java:

    
    public void mudaQuad(int btn, int cor) {
        this.getQuad(btn).setTextColor(this.getResources().getColor(cor));
    }
    

    E altere o if de finalizado assim:

    
    if(s1.equals(s2) && s2.equals(s3)) {
        this.mudaQuad(estadoFinal[x][0], R.color.red);
        this.mudaQuad(estadoFinal[x][1], R.color.red);
        this.mudaQuad(estadoFinal[x][2], R.color.red);
    
        Toast.makeText(this.getVi().getContext(), "O Jogo Acabou!", Toast.LENGTH_LONG).show();
    }
    
    

    Jogo da Velha - Configurações Após a Finalização do Jogo

    Altere o método finalizado assim:

    
    public boolean finalizado() {
        for(int x = 0; x <= 7; x++) { // Arrays são contados a partir do zero
            // Recupera os valores do botão:
            String s1 = this.getQuad(estadoFinal[x][0]).getText().toString();
            String s2 = this.getQuad(estadoFinal[x][1]).getText().toString();
            String s3 = this.getQuad(estadoFinal[x][2]).getText().toString();
    
            if(!s1.equals("") && !s2.equals("") && !s3.equals("")) {
                if(s1.equals(s2) && s2.equals(s3)) {
                    this.mudaQuad(estadoFinal[x][0], R.color.red);
                    this.mudaQuad(estadoFinal[x][1], R.color.red);
                    this.mudaQuad(estadoFinal[x][2], R.color.red);
    
                    Toast.makeText(this.getVi().getContext(), "O Jogo Acabou!", Toast.LENGTH_LONG).show();
    
                    return true;
                }
            }
        }
        return false;
    }
    
    

    E altere o método clickQuad assim:

    
    public void clickQuad(View v) {
        if(!this.finalizado()) {
            if(((Button)v).getText().equals("")) {
                if(this.getLastPlay().equals(XIS)) {
                    ((Button)v).setText(BOLA);
    
                    this.setLastPlay(BOLA);
                }
                else {
                    ((Button)v).setText(XIS);
    
                    this.setLastPlay(XIS);
                }
            }
            else {
                Toast.makeText(this.getVi().getContext(), "Escolha outro Botão", Toast.LENGTH_LONG).show();
            }
    
            this.finalizado();
        }
    }
    
    

    No arquivo cor.xml criado, adicione essa tag:

    
    <color name="blue">#000088</color>
    
    

    No Java criamos essa função:

    
    public void resetaCor() {
        for(int i = 1; i <= 9; i++) {
            if(this.getQuad(i) != null) {
                this.mudaQuad(i, R.color.blue);
            }
        }
    }
    
    

    E no método novoJogo coloque a invocação da função, assim:

    
    public void novoJogo(View v) {
        this.ativarQuad(true);
        
        this.resetaCor();
    
        for(int i = 1; i <= 9; i++) {
            if(this.getQuad(i) != null) {
                this.getQuad(i).setText("");
            }
        }
    }
    
    

    Jogo da Velha - Definindo quem inicia com X e com O

    Primeiro adicione no jogo dois radiobuttons dentro de um radiogroup, com os valores X e O, e as ids rbX e rbO.

    No Java, no método novoJogo, coloque isso no final da função:

    
    RadioButton rbX = this.getVi().findViewById(R.id.rbX);
    RadioButton rbO = this.getVi().findViewById(R.id.rbO);
    
    // Sempre o oposto do que queremos aqui:
    
    if(rbX.isChecked()) {
        this.setLastPlay(BOLA);
    }
    else if(rbO.isChecked()) {
        this.setLastPlay(XIS);
    }
    
    

    Criando Projeto de Cadastro

    Abra um projeto novo com o nome Cadastro de Clientes, escolha as opções recomendadas e aguarde.

    No arquivo XML, mude o tipo de layout para LinearLayout, e no desenho do layout coloque um PlainText, um ImageButton (sem imagem) e um ListView. Veja se o Layout tá com a orientação vertical.

    Coloque um layout horizontal dentro dele, deixe ele como o primeiro e arraste o edit text e o botão pra ele.

    Para os componentes ficarem 100% na largura e altura independente do celular, coloque as opções layout-width e layout-height como match_parent.

    PS: Mantenha a action bar nesse projeto. Pra mudar a cor dele, coloque isso no onCreate:

    
    getSupportActionBar().setBackgroundDrawable(new ColorDrawable(Color.parseColor("#AAAAAA"))); // importe
    
    

    Personalizando Componentes

    Como visto, o match_parent ocupa o máximo de espaço, de forma contrária, o wrap_content ocupa o mínimo, que seria o tamanho do componente. Coloque o layout com o text e o button como wrap_content na largura.

    O listview deverá estar como match_parent em ambas

    No imagebutton, vá nas propriedades em src e altere a imagem de adicionar da paleta do programa.

    Indo na pasta app > src > main > res, dentro de qualquer pasta ou criando uma nova, podemos colocar qualquer imagem que queiramos colocar no lugar.

    Personalizando Ícones do Projeto

    Na pasta app > src > main > res podemos colocar um novo ícone e adicionar ele no botão do nosso projeto, na propriedade src, e o escolhemos em mipmap.

    PS: O tamanho deve ser pequeno, não pode ter espaços no nome e é preferível o nome começar com ic_launcher.

    Fundo do Botão Transparente

    Altere os ids dos componentes para txtPesq, btnAdd e lstCont.

    Para deixar o botão com fundo transparente, vá em background e mude a cor dele.

    Criando a Tela de Cadastro de Clientes

    Crie uma nova activity do tipo Empty Activity pro nosso projeto (clique na pasta e vá em new) e coloque o nome ActCadClientes

    PS: Desmarque a opção Launcher Activity.

    Na nova activity, veja se ele está como Linear Layout e ajuste a orientação para vertical.

    Adicione outro linear layout, e dentro dele adicione um label o texto nome.

    PS: Veja se o layout gravity não está em center.

    Coloque um plain text e coloque a id txtNome, copie esse linear Layout e copie ele quatro vezes.

    No segundo coloque telefone e exclua o plain text, e coloque um phone text. Coloque um layout horizontal e arraste pra dentro dele o phone text e um spinner.

    Adicionando os Spinners Botões de Opções

    Podemos ajustar a largura e a altura dos componentes telefone e o spinner, com números a partir do 1 pra ajustar.

    Coloque as ids txtTel e cxTel nos componentes.

    Copie o layout com o telefone e coloque abaixo deste, com a palavra e-mail e copie de novo para endereço.

    Copie o nome e faça o mesmo para observações. Coloque as ids especificadas em todos.

    Criando Evento do Botão para Chamar Cadastros

    Faça essas alterações na classe MainActivity:

    
    public class MainActivity extends AppCompatActivity implements View.OnClickListener { // Coloque a implementação
        private ImageButton btnAdd; // Importe android.widget.*
        private EditText txtPesq;
        private ListView lstCont;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main); // Aqui mostra qual activity ele está ligado
    
            btnAdd = (ImageButton)findViewById(R.id.btnAdd);
            txtPesq = (EditText)findViewById(R.id.txtPesq);
            lstCont = (ListView)findViewById(R.id.lstCont);
            
            btnAdd.setOnClickListener(this);
        }
    
        // Método da interface implementado para clique:
    
        @Override
        public void onClick(View v) {
            Intent it = new Intent(this, ActCadClientes.class); // Coloque o nome da activity a ser chamada seguido de class, importe android.content.*.
    
            startActivity(it);
        }
    }
    
    

    Programando o Act de Cadastro

    Vamos agora no ActCadClientes.java, e alteramos o código assim:

    
    public class ActCadClientes extends AppCompatActivity {
        private EditText txtNome; // Importe android.widget.*
        private EditText txtTel;
        private EditText txtMail;
        private EditText txtEnd;
        private EditText txtObs;
        private Spinner cxTel;
        private Spinner cxMail;
        private Spinner cxEnd;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_act_cad_clientes);
    
            txtNome = (EditText)findViewById(R.id.txtNome);
            txtTel = (EditText)findViewById(R.id.txtTel);
            txtMail = (EditText)findViewById(R.id.txtMail);
            txtEnd = (EditText)findViewById(R.id.txtEnd);
            txtObs = (EditText)findViewById(R.id.txtObs);
            cxTel = (Spinner)findViewById(R.id.cxTel);
            cxMail = (Spinner)findViewById(R.id.cxMail);
            cxEnd = (Spinner)findViewById(R.id.cxEnd);
        }
    }
    
    

    Criando os Arrays para Alimentar Spinners

    Primeiramente, vamos criar, abaixo de endereço, mais um componente pra data com um campo e um spinner, e coloque as ids txtData e cxData. Adicione a chamada deles na activity.

    Crie os arrays assim:

    
    private ArrayAdapter<String> adpTipoTel;
    private ArrayAdapter<String> adpTipoMail;
    private ArrayAdapter<String> adpTipoEnd;
    private ArrayAdapter<String> adpTipoData;
    
    

    E dentro da função onCreate, os inicialize assim:

    
    adpTipoTel = new ArrayAdapter<>(this, android.R.layout.simple_spinner_item);
    adpTipoMail = new ArrayAdapter<>(this, android.R.layout.simple_spinner_item);
    adpTipoEnd = new ArrayAdapter<>(this, android.R.layout.simple_spinner_item);
    adpTipoData = new ArrayAdapter<>(this, android.R.layout.simple_spinner_item);
    
    adpTipoTel.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
    adpTipoMail.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
    adpTipoEnd.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
    adpTipoData.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
    
    

    Alimentando os Spinners

    Para associar os spinnert aos arrays, fazemos assim, dentro da função onCreate:

    
    cxTel.setAdapter(adpTipoTel);
    cxMail.setAdapter(adpTipoMail);
    cxEnd.setAdapter(adpTipoEnd);
    cxData.setAdapter(adpTipoData);
    
    adpTipoTel.add("Celular");
    adpTipoTel.add("Fixo");
    adpTipoTel.add("Trabalho");
    
    adpTipoMail.add("Pessoal");
    adpTipoMail.add("Trabalho");
    
    adpTipoEnd.add("Casa");
    adpTipoEnd.add("Trabalho");
    
    adpTipoData.add("Cadastro");
    adpTipoData.add("Compra");
    
    

    Criando um Menu para o Cad Clientes

    Crie em res, a pasta menu e um arquivo de recursos de menu com o nome menu_act_cad_clientes.xml, e deixe o XML dele assim:

    
    <?xml version="1.0" encoding="utf-8"?>
    <menu xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        tools:context="com.example.cadastrodeclientes.ActCadClientes">
        <item
            android:id="@+id/action_settings"
            android:orderInCategory="100"
            android:title="Configurações"
            app:showAsAction="never"/>
    </menu>
    
    

    No Java, coloque esse método na classe da Activity:

    
    @Override
    public boolean onCreateOptionsMenu(Menu men) {
        MenuInflater infl = getMenuInflater();
        infl.inflate(R.menu.menu_act_cad_clientes, men);
    
        return true;
    }
    
    

    Criando Strings para os Menus

    Para mostrar o menu, basta remover o atributo do XML app:showAsAction de todos os itens.

    Copie as tags item e mude os titler pra criarmos mais menus.

    No arquivo strings.xml, em resources, podemos colocar os labels assim:

    
    <resources>
        <string name="app_name">Cadastro de Clientes</string>
        <string name="action_settings">Settings</string>
        <string name="title_activity_act_cad_clientes">Clientes</string>
        <string name="lbl_nome">Nome</string>
        <string name="lbl_telefone">Telefone</string>
        <string name="lbl_email">E-mail</string>
        <string name="lbl_endereco">Endereço</string>
        <string name="lbl_observacoes">Observações</string>
        <string name="lbl_data">Data Cadastro</string>
    </resources>
    
    

    Esse arquivo acima é útil para, por exemplo, podermos facilmente mudar o idioma dos aplicativos.

    Colocamos dentro da tag resources também essas tags, pros nossos menus:

    
    <string name="lbl_salvar">Salvar</string>
    <string name="lbl_alterar">Alterar</string>
    <string name="lbl_excluir">Excluir</string>
    
    

    Aí no primeiro item, no menu_act_cad_clientes.xml, alteramos a tag assim:

    
    <item
        android:id="@+id/menu_acao1"
        android:orderInCategory="100"
        android:title="@string/lbl_salvar"/>
    
    

    Aí ele pegará do arquivo o texto do label em strings.xml. Faça o mesmo nos outros itens com menu_acao2 e lbl_alterar, e menu_acao3 e lbl_excluir.

    Chame o componente toolbar no aplicativo:

    
    tbAct = (Toolbar)findViewById(R.id.tbAct); // importe androidx.appcompat.widget.Toolbar, e declare o atributo do tipo Toolbar no código
    
    setSupportActionBar(tbAct);
    
    

    E coloque esse método na classe:

    
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();
    
        if(id == R.id.menu_acao1) {
            return true;
        }
        
        return super.onOptionsItemSelected(item);
    }