Getting Started with Android Spinners

Udemy Editor

Getting Started with Android Spinners

The Android platform is used to build mobile applications for the Android OS. These applications inherit some specific functionalities, and the design is created by using different types of layouts and view objects. This is defined as the User interface, which in turn, interacts with the user on a mobile screen. The user interface, also known as UI, has many sub divisions in the form of a layout, an input control and input events. The combination of these user-interface objects is used to design beautiful and interactive applications. The basic implementation of any application comes from fundamental input controls like text boxes, radio buttons, checkboxes and spinners. These objects are used to derive input from a user.

Learn Android development from scratch at Udemy.com.

What is an Android Spinner ?

The spinner is nothing but a label with a dropdown list often seen on web page forms. When the user clicks this label, the dropdown list appears, and this allows the users to make a selection based on this list. The “ItemClick” event is triggered when the user makes a selection. The Android Spinner control is a mobile version of the standard dropdown list used on a website. It’s effective in input control and makes the developer’s work easier and reduces overhead of complex designs. The most important feature of the spinner is that it prevents excessive space utilization, which otherwise would be required to list items.

Syntax

<Spinner

android:id=”@+id/list”

android:layout_width=”match_parent”

android:layout_height=”wrap_content”

android:layout_marginTop=”5dp” />

This is the basic syntax used to declare a spinner, but it is incomplete. The spinner values that pop up on the screen for a selection are yet to be defined.

Learn more about Android programming with a class at Udemy.com.

Generally, a Spinner Adapter is required to pass the values to the spinner. A Spinner Adapter acts as a bridge between the spinner and the data to be listed. It lists the values in the form of a drop down list.

The types of Adapters are:

ArrayAdapter: The value stored or predefined in the array is passed through arrayAdapter to get listed on the spinner.

CursorAdapter: The spinner can also hold values that are retrieved from the database. These values are listed using a CursorAdapter control.

Other Adapters are BaseAdapter, ResourceCursorAdapter, SimpleAdapter, and SimpleCursorAdapter.

Attributes of Spinners:

A spinner has various XML attributes or functionalities:

DropDownHorizontalOffset: This attribute runs the setdropDownHorizontalOffset method. It aligns a dropdown list in a horizontal manner.
DropDownSelector: This shown the dropdown display.
DropDownVerticalOffset: It aligns the dropdown list in a vertical manner.
dropDownWidth: Defines the width of the dropdown list of spinner using setDropDownWidth() method.
Gravity: Defines the positioning of the selected item using setGravity() method.
popupBackground: Makes the background drawable to be used for a dropdown through setPopupBackgroundResource() method.
Prompt: Prompts the display when the spinner’s dialog is shown.
SpinnerMode: Display different modes of the spinner options.

Steps Involved in Spinner Implementation:

The spinner can be added in three simple steps in the application:

Step 1:

Declaring the array of the stored values in the string.xml file.

<?xml version=”1.0″ encoding=”utf-8″?>

<string name=”app_name”>MySpinner</string>

<string name=”chocolates_popup”>Choose a chocolate</string>

<string-array name=”chocolates”>

<item>Bournville</item>

<item>Butterfinger</item>

<item>Hershey</item>

</string-array>

</resources>

Step 2

Declaring the spinner widget in the layout XML file.

<?xml version=”1.0″ encoding=”utf-8″?>

<LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android”

android:layout_width=”fill_parent”

android:layout_height=”fill_parent”

android:orientation=”vertical” >

<Spinner

android:id=”@+id/choclates”

android:layout_width=”match_parent”

android:layout_height=”wrap_content”

android:entries=”@array/chocolates”

android:prompt=”@string/chocolates_popup” />

<Spinner

android:id=”@+id/spinner_Database”

android:layout_width=”match_parent”

android:layout_height=”wrap_content” />

</LinerLayout>

Step 3:

Declaring the spinner in the Activity.

package com.myspinner;

import java.util.ArrayList;

import java.util.List;

import android.app.Activity;

import android.os.Bundle;

import android.view.View;

import android.view.View.OnClickListener;

import android.widget.ArrayAdapter;

import android.widget.Button;

import android.widget.Spinner;

import android.widget.Toast;

public class myspinner extends Activity {

private Spinner spiner1, spiner2;

private Button btnSubmit;

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

addItemsOnSpinner2();

addListenerOnButton();

addListenerOnSpinnerItemSelection();

}

// Dynamically add the Values

public void addItemsOnSpinner2() {

spinner2 = (Spinner) findViewById(R.id.spinner_database);

List<String> list1 = new ArrayList<String>();

List1.add(“list 1”);

List1.add(“list 2”);

List1.add(“list 3”);

ArrayAdapter<String> dataAdapter = new ArrayAdapter<String>(this,

android.R.layout.simple_spinner_item, list1);

dataAdapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);

spinner2.setAdapter(dataAdapter);

}

public void addListenerOnSpinnerItemSelection() {

spinner1 = (Spinner) findViewById(R.id.chocolates);

spinner1.setOnItemSelectedListener(new CustomOnItemSelectedListener());

}

// get the selected dropdown list value

public void addListenerOnButton() {

spinner1 = (Spinner) findViewById(R.id.chocolates);

spinner2 = (Spinner) findViewById(R.id.spinner_database);

btnSubmit = (Button) findViewById(R.id.btnSubmit);

btnSubmit.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View v) {

Toast.makeText(MyAndroidAppActivity.this,

“OnClickListener : ” +

“\nSpinner 1 : “+ String.valueOf(spinner1.getSelectedItem()) +

“\nSpinner 2 : “+ String.valueOf(spinner2.getSelectedItem()),

Toast.LENGTH_SHORT).show();

}

});

}

In the first step, the values are listed directly in string.xml file. This is an example of the static spinner in which the values are fixed. The user can also retrieve values from the database in the spinner.

Want to build mobile apps? Take a course at Udemy.com.

In the second step, the user-interface displayed on the screen is defined. All the UI elements are declared in the main.xml file.

The third and last step is where you define the event handling. In this step, you will define the way the values are going to be displayed on the spinner. The two ways are shown in the example. First, the spinner retrieves values from the array created in the string.xml file and this is a static process. The second spinner displays the value dynamically retrieved from the database.

Following these steps will make you add a simple spinner in your app. Note that in order to respond to click events, onItemListener() interface has to be implemented. This interface contains two methods including onItemSelected and onNothingSelected. On the basis of the event, the respective method is called.

package myspinner;

import android.view.View;

import android.widget.AdapterView;

import android.widget.AdapterView.OnItemSelectedListener;

import android.widget.Toast;

public class CustomOnItemSelectedListener implements OnItemSelectedListener

{

public void onItemSelected(AdapterView<?> parent, View view, int pos,long id)

{

Toast.makeText(parent.getContext(),

“OnItemSelectedListener : ” + parent.getItemAtPosition(pos).toString(),

Toast.LENGTH_SHORT).show();