Curso Android – Spinners

Existem muitas aplicações em android que utilizam Spinners. Eles são muito úteis e fáceis de programar/usar. Com o tutorial de hoje, pretendemos introduzir ao leitor o conceito de Spinner e, mostrar a utilidade do ficheiro strings.xml bem como usar drawables. Para variar dos tutoriais anteriores, hoje o objetivo é criar um projeto novo com uma “empty activity”. O ficheiro .xml e a pasta drawables são as seguintes selecionadas:

explicacao-209x300

Ficheiro de strings

Para percebermos a utilidade do ficheiro strings.xml, localizado em res -> values -> strings.xml , devemos abrir o mesmo. Lá dentro o utilizador deverá encontrar 1 recurso que será uma string com o nome da aplicação. Para isso, o utilizador deverá acrescentar o seguinte:

<resources>
    (...)
    <string name="clubes_chooser">Escolha o seu clube</string>
    <string-array name="equipas">
        <item>FCPorto</item>
        <item>SportingCP</item>
        <item>SLBenfica</item>
    </string-array>
</resources>

Com isto, estamos a criar uma string com o texto de “Escolha o seu clube” e, um array de strings com três items, neste caso “FCPorto”, “SportingCP”, “SLBenfica”.

Layout

Neste tutorial o layout foi deixado para “segundo plano” pois é necessário chamar o spinner e, no mesmo passar o array de strings que criámos no ficheiro strings.xml. Para isso temos o seguinte layout (colocar dentro das tags “RelativeLayout”):

<Spinner
        android:id="@+id/spinner"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:spinnerMode="dropdown"
        android:prompt="@string/clubes_chooser"
        android:entries="@array/equipas"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="Large Text"
        android:id="@+id/txtNomeClube"
        android:layout_below="@+id/spinner"/>

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_below="@+id/txtNomeClube"
        android:id="@+id/imageView"/>

Como podemos observar, a tag spinner está programada de forma a que seja do tipo de uma dropdown e, como entradas estamos a passar-lhe o array de equipas.

Programação

Na “MainActivity”, o código será simples. Para que este funcione devidamente e, para que os drawables sejam utilizados, pede-se ao utilizador que faça o download das seguintes imagens para a pasta drawables que se localiza em app -> res -> drawable :

E, de seguida coloque o seguinte código na função onCreate da “MainActivity”:

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

        final Spinner spin = (Spinner) findViewById(R.id.spinner);
        spin.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
            @Override
            public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
                TextView tv = (TextView)findViewById(R.id.txtNomeClube);
                tv.setText("O maior clube é: " + spin.getItemAtPosition(position).toString());
                ImageView img = (ImageView)findViewById(R.id.imageView);
                if(spin.getItemAtPosition(position).toString().equals("FCPorto"))
                    img.setImageResource(R.drawable.fcporto);
                if(spin.getItemAtPosition(position).toString().equals("SportingCP"))
                    img.setImageResource(R.drawable.sportingcp);
                if(spin.getItemAtPosition(position).toString().equals("SLBenfica"))
                    img.setImageResource(R.drawable.slbenfica);
            }

            @Override
            public void onNothingSelected(AdapterView<?> parent) {            }
        });
    }

O objetivo deste código e, obter o spinner que foi programado no .xml do layout e programar a sua acção aquando o item selecionado muda. Para isso, existe já um método que é o setOnItemSelectedListener(…) que irá aguardar um novo listener. É exatamente esse que é programado acima. Sempre que existe uma alteração no botão, vamos preencher a TextView com o nome do clube e vamos mudando a imagem com ajuda aos nossos recursos drawable dos quais fizemos o download. O método falado cria automaticamente duas funções novas, o onItemSelected(…) que é o que vai ser usado quando se muda de item e o onNothingSelected(…) que tal como o nome indica é utilizado quando nada é selecionado. Poderá correr e testar a aplicação!

ImageView Listener

Para terminar com o exemplo deste tutorial, temos como objetivo demonstrar que os cliques não são apenas em botões que funcionam. Também podemos registar cliques, por exemplo na imagem. No caso acima programado vamos implementar um listener que irá atuar sempre que clicarmos na imagem mas, não será um simples clique mas sim um clique long, ou seja aqueles cliques que utilizamos no Android em que pressionamos algum tempo com o dedo. Para isso, basta adicionar o seguinte ao método onCreate(…):

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

        ImageView img = (ImageView)findViewById(R.id.imageView);
        img.setOnLongClickListener(new View.OnLongClickListener() {
            @Override
            public boolean onLongClick(View v) {
                Toast.makeText(v.getContext(), "Sou uma ImageView", Toast.LENGTH_LONG).show();
                return false;
            }
        });
(...)

O leitor fica agora, segundo os tutoriais a saber como utilizar um clique apenas e, como se utiliza o clique longo.

Fonte das imagens