Spinner (ou Select) no Android, Entendendo e Utilizando

Tudo bem?

Dando continuidade a série de vídeos sobre componentes visuais no Android, no vídeo acima eu apresento o componente Spinner que é a versão do <select> (HTML) ou ComboBox (Java) no Android.

Aparentemente, por causa da tag <select> no HTML, pode vir a ideia de que implementar o conteúdo de um Spinner é trivial. Na verdade é sim simples, mas não tanto quanto um <select>.

A grande vantagem do Spinner no Android ante as suas variações em outras linguagens é a possibilidade de personalização dos itens do Spinner (colocando imagens, textos estilizados, ...) sem a necessidade de uso de outra tecnologia (HTML e JavaScript, por exemplo).

No aplicativo do blog eu utilizo alguns Spinners, pois nele há alguns formulários. E você, como desenvolvedor Android, mesmo que iniciante, certamente vai utilizar o componente Spinner em algum momento dos projetos que estiver envolvido.

Nos links a seguir tenho alguns projetos Android completos fazendo uso do Spinner de maneira customizada, utilizando até mesmo um <layer-list>. Não deixe de também estuda-los para você entender ainda mais o potencial do Spinner em interfaces gráficas de aplicativos Android:

• Data Binding Para Vinculo de Dados na UI Android;
• Trabalhando Análise Qualitativa em seu Aplicativo Android.

A seguir o diagrama do componente visual Spinner:

A seguir forneço alguns links de outros conteúdos completos do Blog, acompanhados de vídeos, que lhe colocarão em dia com o que há de novo no desenvolvimento Android:

• Kotlin Android, Entendendo e Primeiro Projeto;
• Android Studio: Instalação, Configuração e Otimização;
• Android Mobile-Commerce, Apresentação e Protótipo do Projeto.

E caso você tenha como meta aprender a desenvolver aplicativos Android, ou evoluir nesta área, também com os conteúdos gratuitos do Blog, então não deixe de acessar a lista exclusiva para estudos em: Estudando Android - Lista de Conteúdos do Blog.

Não esqueça de se inscrever 📫 na lista de e-mails do Blog para receber os conteúdos exclusivos Android em primeira mão.

Se inscreva também no canal do Blog no YouTube para acompanhar as últimas novidades.

Surgindo dúvidas ou dicas, pode enviar abaixo na área de comentários que logo eu lhe retorno.

Obs. : o link para download do projeto apresentado em vídeo se encontra logo abaixo no artigo, na seção "Download".

Abraço.

Eclipse IDE vs Android Studio IDE

Apesar de o conteúdo da vídeo aula acima estar utilizando o Eclipse IDE 😱, tudo que é apresentado, tanto a parte teórica quanto a parte prática, é ainda válido nos dias de hoje com o desenvolvimento Android utilizando o Android Studio 😁.

Ou seja, independente da linguagem oficial (Java, Kotlin, C ou C++), IDE ou framework que você esteja utilizando, o conteúdo acima é ainda muito útil.

AndroidX

Apesar do conteúdo sobre o componente Spinner ainda estar atual e ser importante para qualquer nível de desenvolvedor Android.

Apesar disso eu também recomendo, assim que finalizado o projeto em sua própria instalação de IDE, que você o migre para o AndroidX.

Algo que pode ser feito com poucos cliques, como apresentado no tutorial a seguir: Migrar para o AndroidX.

Fontes

Spinner - documentação oficial Android

Controles giratórios - documentação oficial Android

AdapterView.OnItemSelectedListener - documentação oficial Android

Relacionado

ImageSwitcher no Android, Entendendo e UtilizandoAndroid

ViewPager no Android, Entendendo e UtilizandoAndroid

Utilizando a Câmera do Smartphone em Sua APP AndroidAndroid

Style, String, Dimen, Color e WindowNoTitle no Android, Entendendo e UtilizandoAndroid

Comentários Blog (20)

Para código / script, coloque entre [code] e [/code] para receber marcação especifica.

Forneça seu nome válido.

Forneça seu email válido.

Forneça o comentário.

Enviar

Enviando, aguarde...

Gilberto Lopes (1) (0)

18/12/2019

Bom dia, Thiengo.
Consegui implementar o spinner com a sua ajuda porém, estou com uma dificuldade.
Recebo os dados e monto o array pra popular o spinner mas não estou conseguindo posicionar no elemento retornado do banco.
Como exemplo prático tenho uma lista de tipos de logradouro (rua, praça, avenida, etc). O banco retorna avenida e preciso posicionar este elemento no formulário após a leitura.
poderia ajudar?

Responder

Vinícius Thiengo (0) (0)

30/12/2019

Gilberto, tudo bem?

Se o objetivo for: posicionar o elemento "avenida" apenas como mais um elemento da lista de opções do Spinner.

E se você não estiver utilizando um adapter personalizado no Spinner, então a escolha de solução comum seria:

-> Obter em uma variável a posição atual do item que está selecionado no Spinner. Utilize o método getSelectedItemPosition() para isso. Método do objeto Spinner;

-> Acessar o array de opções do Spinner. Pode carrega-lo novamente do banco de dados ou do XML fonte, se necessário;

-> Adicionar, na última posição do array, o novo item, "avenida";

-> Carregar o array atualizado no Spinner;

-> Utilizar o método setSelection() do Spinner para deixar o item correto como já selecionado. No caso o item que já estava selecionado pelo usuário.

Se o problema for colocar a opção "avenida" como a opção selecionada no Spinner, ou seja, esta opção já está presente, porém é preciso garantir que ela seja a opção selecionada.

Neste caso você pode, como uma simples e rápida solução:

-> Acessar o array de opções do Spinner e verificar (com loop e condicional) com o método equalsIgnoreCase() qual a posição da String "avenida" no array;

-> Encontrando a posição, acesse o objeto Spinner e use o método setSelection() para colocar como opção selecionada a String retornada pelo banco de dados, podendo ser "avenida" ou qualquer uma outra.

Gilberto, é isso.

Surgindo mais dúvidas, pode enviar.

Bons estudos.

Abraço.

Responder

Rodrigo Marden (1) (0)

07/05/2019

Boa tarde Thiengo,

Estou criando um spinner porém estou com dificuldades em popular com os dados vindo do banco de dados, já tentei com ArrayAdapter, com o BaseAdapter, porém não funciona. Se eu populo a lista direto no código, ele funciona normalmente, mas quando eu tento com uma lista gerada a partir do banco de dados o funcionamento dele fica diferente, não entra na função .setOnItemSelectedListener e não fica um previamente selecionado e nem consigo selecionar outros.

Responder

Vinícius Thiengo (0) (0)

14/05/2019

Rodrigo, tudo bem?

O que você deve fazer é o seguinte:

-> Deixe a lista de dados vinculados ao adapter do Spinner como uma variável de instância da classe que contém o Spinner como componente de layout;

-> Assim que os dados chegarem do banco de dados acesse a lista de dados vinculada ao adapter do Spinner e remova todos os dados dela (sem criar uma nova instância de lista), como a seguir: listaDados.clear();

-> Depois de remover os dados da lista, coloque nela os dados que chegaram do banco de dados, como a seguir: listaDados.add( listaDadosBancoDeDados );

-> Por fim acesse o adapter do Spinner e invoque o método de atualização de dados, notifyDataSetChanged(), como a seguir: adapterSpinner.notifyDataSetChanged().

Para o roteiro descrito acima, utilizando o BaseAdapter, você não terá dificuldades em implementa-lo.

Rodrigo, desta forma o Spinner de seu projeto funcionará como esperado.

Abraço.

Responder

Rodrigo Marden (0) (0)

15/05/2019

É isso que eu estou fazendo. Segue o código:

 //Recuperar espacos do firebase
       /* listaEspacos = new ArrayList<>();
        Preferencia preferencia = new Preferencia(CadastroReservaActivity.this);
        String idCondominio = preferencia.getIdCondominio();
        Query queryBuscarEspaco = ConfiguracaoFirebase.getFirebase().child("condominios").child(idCondominio).child("espacos").orderByChild("nome");

        queryBuscarEspaco.addListenerForSingleValueEvent(new ValueEventListener() {
            @Override
            public void onDataChange(DataSnapshot dataSnapshot) {
                listaEspacos.clear();
                int i = 0;

                for(DataSnapshot dados : dataSnapshot.getChildren()) {
                    Espaco espaco = dados.getValue(Espaco.class);
                    espaco.setId(dados.getKey());
                    listaEspacos.add(espaco);
                    nomesEspaco[i] = espaco.getNome();
                }
            }

            @Override
            public void onCancelled(DatabaseError databaseError) {

            }
        });*/

        //Configurando Spinner
        ArrayAdapter adapter = new ArrayAdapter(this, android.R.layout.simple_spinner_item, listaEspacos);
        adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
        espaco.setAdapter(adapter);


        //Método para capturar o item selecionado do Spinner
        espaco.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
            @Override
            public void onItemSelected(AdapterView adapterView, View view, int i, long l) {
                posicaoSpinner = i;
                valor.setText("Valor: " + listaEspacos.get(posicaoSpinner).getValor().toString());
            }

            @Override
            public void onNothingSelected(AdapterView adapterView) {

            }
        });

Responder

Vinícius Thiengo (0) (1)

24/05/2019

Rodrigo,

Somente faltou, depois do for() de onDataChange(), a invocação adapter.notifyDataSetChanged().

Somente adicionar os itens à lista vinculada ao adapter não é o suficiente, você também precisa informar a UI que houve atualização em lista. O notifyDataSetChanged() faz isso.

Veja se com essa alteração se o Spinner passa a funcionar como esperado.

Abraço.

Responder

Robson (1) (0)

29/09/2017

Thiengo blz meu caro!!!!?
Então tô com um Spinner que tem uns 500 itens e isto dificulta o usuário na seleção, existe como fazer uma "Busca" ou "Filtragem" de forma a otimizar o trabalho do usuário? os dados já vem ordenados mais como são muitos registros isto não é o bastante.

Responder

Vinícius Thiengo (1) (0)

04/10/2017

Robson, tudo bem aqui.

Tente o AutoCompleteTextView, com ele é possível, e mais viável, trabalhar todas essas 500 opções que o usuário tem.

Mais sobre no link a seguir: https://www.thiengo.com.br/autocompletetextview-no-android-entendendo-e-utilizando

Abraço.

Responder

Robson (1) (0)

05/10/2017

Valeu Thiengo!
Mais cara bem que poderiam fazer algo para o Spinner, o AutoComplete o usuário pode digitar algo por exemplo tenho minha lista com dados de 1001001 a 1001100 o cara digita apenas 100 e então eu tenho agora que validar isto, no spinner só validava se estava vazio.

Responder

Robson (1) (0)

05/10/2017

Cara mais aquelas sugestões que vc mostrou no Android Arsenal acho que vai rolar, valeu!!!!!

Responder

Filipe Braga (1) (0)

03/04/2017

Prezado Vinícius,

Achei interessante sua abordagem aqui. Já tenho feito algum desenvolvimento com AndroidStudio e em uma das minhas aplicações estou utilizando três Spinner, devidamente declarados os atributos, associado as View's e feito o Cast.

O problema é que o terceiro Spinner não está selecionando nenhum item, apesar deles aparecerem (e atualizarem, corretamente). Os Spinner's tem o mesmo código e funcionam de maneira encadeada (a escolha de uma opção no Spinner1 afeta as opções mostradas no 2 e assim em diante). A única diferença entre eles é que o 3 (que não está selecionando) tem mais de 20 itens.

Testei com um Toast no 'onItemSelected', mas sequer a mensagem aparece quando seleciono um item no Spinner3.

Abraço

Responder

Vinícius Thiengo (0) (0)

08/04/2017

Filipe, tudo bem?

Alguma mensagem de erro ou warning é apresentada nos logs do Android Studio? Certificou-se de que esse terceiro listener não está vinculado a nenhuma listener dos Spinners anteriores, algo que afetaria o funcionamento dele?

Abraço.

Responder

Alan Lucena (1) (0)

21/03/2017

Professor boa tarde! Por um acaso senhor notou algum "bug" no spiner do Android Studio 2.3, pois o meu a letra fica somente branca e os layouts que crio aparecem com background cinza escuro, existe alguma solução para este spiner?

Responder

Vinícius Thiengo (0) (1)

24/03/2017

Alan, tudo bem?

Não notei o Bug, até mesmo tive de utilizar o Spinner essa semana. Uma maneira de mudar as cores dele é mudando o tema que está sendo utilizado.

Provavelmente seu App está utilizando o AppTheme que herda de Theme.AppCompat, certo? Para confirmar, vá no AndroidManifest e veja se na tag da Activity do Spinner há um atributo android:theme=?@style/AppTheme?, caso não, a Activity está herdando o tema da <application>, que provavelmente deve ser AppTheme.

No arquivo /res/values/styles.xml você consegue alterar isso, para, por exemplo, ao invés de herdar de Theme.AppCompat passar a herdar de Theme.AppCompat.Light ou de Theme.AppCompat.Light.DarkActionBar, ou de ? Há vários.

Uma outra maneira que não é simples e que também pode tirar um pouco de performance de seu aplicativo, ao menos na parte de Spinner, é criando um adapter customizado e então fornecendo o XML dos itens, XML criado por ti com suas cores de fundo e texto. Abraço.

Responder

Alan Lucena (1) (0)

26/03/2017

Isso mesmo que o senhor disse professro "AppTheme". As letras de fundo estão brancas e se usar um background branco as letras somem por enquanto resolvi o problema de uma outra forma, mas não esta do jeito que quero, mas vou trocar os temas para dar uma analisada, por enquanto muito obrigado pelas orientações, tenha uma ótima semana.

Responder

Fernando Antunes (1) (0)

28/11/2014

Salve Salve Thiengo!!! parabéns e sempre acompanho seu BLOG, principalmente agora que estou iniciando, estou com uma dúvida estou trabalhando com um menu DRAWER e ele utliza fragmentos e não activity, como eu faria para inserir ess SPINNER no fragment? se puder ajudar... vlwsss

Responder

Vinícius Thiengo (1) (0)

29/11/2014

Fala Fernando, blz?
Então, na verdade o fragment é quase que a mesma coisa que a Activity quando vamos trabalhar com ele, tem o próprio layout, próprio ciclo de vida, ... No caso vc pode colocar esse spinner no layout do fragment via Java code, sem o xml, ou pelo xml mesmo, que no caso recomendo o xml para separar a view da lógica. O fragment tem um método onCreateView() que é responsável por gerenciar a inicialização do layout do fragment... dê uma olhada nos dois vídeos abaixo sobre fragment, acho que vão lhe ajudar bastante:

Fragments no Android, Trabalhando com Múltiplas Activities (http://www.thiengo.com.br/fragments-no-android-trabalhando-com-multiplas-activities )

Ciclo de Vida e Otimização de Fragments no Android (http://www.thiengo.com.br/ciclo-de-vida-e-otimizacao-de-fragments-no-android )

Abraço

Responder

Érick Nilson (1) (0)

22/10/2014

Thiengo, tudo bem? Primeiramente parabéns pelas ótimas vídeo-aulas que você disponibiliza! São muito boas!
Estou com um projeto que utiliza Spinner para cadastramento de dados. Porém, preciso utilizar o Spinner também para a área de update desses dados.
De que forma eu mantenho um dado selecionado de acordo com seu id no Spinner?
Vi que ele possui o método setSelection(), mas nesse método eu tenho que informar a posição do array que quero selecionar e isso não me atende. Precisaria informar o id do dado para que ele exibisse. Poderia me ajudar?

Responder

Vinícius Thiengo (1) (0)

22/10/2014

Fala Érick, blz?
Então, vc terá de colocar uma lista ou array no spinner, certo? Ai depois disso vc quer deixar já selecionado a opção escolhida anteriormente, certo? Vc está utilizando uma classe Adapter criada por vc para preencher o spinner? Se estiver ou não vc apenas precisa saber a posição do elemento selecionado na lista ou no array, vc pode fazer essa verificação em um loop antes de preencher o spinner, depois que já tiver a posição guardada em uma variavel do tipo int vc pode preencher o spinner e utilizar o setSelection() com a posição guardada anteriormente. Ve se assim vai. Abraço

Responder

Érick Nilson (2) (0)

23/10/2014

Isso mesmo Thiengo! Muito obrgiado!
Eu possuo uma classe adapter e populo o spinner com uma lista. Daí consegui resolver fazendo um loop na lista buscando pelo id desejado e verificando em que posição se encontra esse id. Após encontrar a posição, eu utilizei o setSelection() e deu certinho.
Muito obrigado pela ajuda! Forte abraço!

Responder