{"id":655,"date":"2016-01-18T13:20:30","date_gmt":"2016-01-18T13:20:30","guid":{"rendered":"http:\/\/abhiandroid.com\/ui\/?page_id=655"},"modified":"2019-06-12T10:40:40","modified_gmt":"2019-06-12T10:40:40","slug":"spinner","status":"publish","type":"page","link":"https:\/\/abhiandroid.com\/ui\/spinner","title":{"rendered":"Spinner Tutorial With Examples In Android Studio"},"content":{"rendered":"

In Android, Spinner provides a quick way to select one value from a set of values. Android spinners are nothing but the drop down-list seen in other programming languages. In a default state, a spinner shows its currently selected value. It provides a easy way to select\u00a0a value from a list of values.<\/p>\n

\"Spinner<\/center>In Simple Words we can say that a spinner is like a combo box of AWT or swing where we can select a particular item from a list of items. Spinner is a sub class of AsbSpinner class.<\/p>\n

Important Note: <\/strong><\/span>Spinner is associated with Adapter view so to fill the data in spinner we need to use one of the Adapter class.<\/p>\n

Here is the XML basic code for Spinner:
\n<\/strong><\/p>\n

<Spinner\r\nandroid:id=\"@+id\/simpleSpinner \"\r\nandroid:layout_width=\"fill_parent\"\r\nandroid:layout_height=\"wrap_content\" \/>\r\n<\/pre>\n
Important Note:<\/strong><\/span> To\u00a0fill the data in a\u00a0spinner we need to implement\u00a0an\u00a0adapter class. A spinner is mainly used to display only text field so we can implement Array Adapter for that. We can also use Base Adapter<\/a> and other custom adapters to display a spinner with more customize list. Suppose if we need\u00a0to display a textview and a imageview in spinner item list then array adapter<\/a> is not enough for that. Here we have to implement custom adapter in our class. Below image of Spinner and Custom Spinner will make it more clear.<\/p>\n
\"Custom<\/center>ArraryAdapter:<\/strong><\/span><\/p>\n
An adapter is a bridge between UI component and data source that helps us to fill data in UI component. It holds the data and send the data to adapter view then view can takes the data from the adapter view and shows the data on different views like as list view, grid view, spinner. Whenever you have a list of single items which is backed by an array, you can use Array Adapter.<\/p>\n
Here is code of ArrayAdapter in Android:<\/strong><\/p>\n
ArrayAdapter(Context context, int resource, int textViewResourceId, T[] objects)\r\n<\/pre>\n
For more details read ArrayAdapter Tutorial<\/a> as here we will use it in the below example to explain how Spinner is created in Android.<\/p>\n
\n
Example of Spinner In Android Studio:<\/strong><\/h4>\n
Example 1:<\/strong><\/span> Below is the example in which we display a list of bank names in a spinner and whenever you select an item the value will be displayed using toast on Mobile screen. Below is the final output and code:<\/p>\n
Download Code<\/a> ? <\/a><\/p>\n
\"Spinner<\/center>Step 1:<\/strong> Create a new project in Android Studio and name it SpinnerExample.<\/p>\n
Select File -> New -> New Project ->. Fill the forms and click \"Finish\" button.<\/pre>\n
Step 2:<\/strong> Open res -> layout -> activity_main.xml (or) main.xml\u00a0and add following code. Here we will create a Spinner inside Relative Layout.<\/p>\n
<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\nxmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\nandroid:layout_width=\"match_parent\"\r\nandroid:layout_height=\"match_parent\"\r\nandroid:paddingBottom=\"@dimen\/activity_vertical_margin\"\r\nandroid:paddingLeft=\"@dimen\/activity_horizontal_margin\"\r\nandroid:paddingRight=\"@dimen\/activity_horizontal_margin\"\r\nandroid:paddingTop=\"@dimen\/activity_vertical_margin\"\r\ntools:context=\".MainActivity\">\r\n\r\n<Spinner\r\nandroid:id=\"@+id\/simpleSpinner\"\r\nandroid:layout_width=\"wrap_content\"\r\nandroid:layout_height=\"wrap_content\"\r\nandroid:layout_centerHorizontal=\"true\"\r\nandroid:layout_marginTop=\"100dp\" \/>\r\n\r\n<\/RelativeLayout><\/pre>\n
Step 3:<\/strong> Now open app-> java -> package ->\u00a0MainActivity.java and add the following code. Here we will use ArrayAdapter to fill the data in Spinner. Also we are using Toast to display when the item in Spinner is selected.
\n<\/strong><\/p>\n
package example.abhiandriod.spinnerexample;\r\n\r\nimport android.support.v7.app.AppCompatActivity;\r\nimport android.os.Bundle;\r\nimport android.view.View;\r\nimport android.widget.AdapterView;\r\nimport android.widget.ArrayAdapter;\r\nimport android.widget.Spinner;\r\nimport android.widget.Toast;\r\n\r\npublic class MainActivity extends AppCompatActivity implements AdapterView.OnItemSelectedListener{\r\n\r\nString[] bankNames={\"BOI\",\"SBI\",\"HDFC\",\"PNB\",\"OBC\"};\r\n@Override\r\nprotected void onCreate(Bundle savedInstanceState) {\r\nsuper.onCreate(savedInstanceState);\r\nsetContentView(R.layout.activity_main<\/em>);\r\n\/\/Getting the instance of Spinner and applying OnItemSelectedListener on it\r\n<\/em>Spinner spin = (Spinner) findViewById(R.id.simpleSpinner<\/em>);\r\nspin.setOnItemSelectedListener(this);\r\n\r\n\/\/Creating the ArrayAdapter instance having the bank name list\r\n<\/em>ArrayAdapter aa = new ArrayAdapter(this,android.R.layout.simple_spinner_item<\/em>,bankNames);\r\naa.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item<\/em>);\r\n\/\/Setting the ArrayAdapter data on the Spinner\r\n<\/em>spin.setAdapter(aa);\r\n}\r\n\r\n\r\n\/\/Performing action onItemSelected and onNothing selected\r\n<\/em>@Override\r\npublic void onItemSelected(AdapterView<?> arg0, View arg1, int position,long id) {\r\nToast.makeText<\/em>(getApplicationContext(), bankNames[position], Toast.LENGTH_LONG<\/em>).show();\r\n}\r\n\r\n@Override\r\npublic void onNothingSelected(AdapterView<?> arg0) {\r\n\/\/ <\/em>TODO Auto-generated method stub\r\n<\/em>\r\n}\r\n}\r\n<\/pre>\n
Output:<\/strong><\/span><\/p>\n
Now the run the program in Emulator and you will see options to choose among bank names present inside drop down list. You will also see Toast message displaying on the screen when you will select the particular bank.<\/p>\n
\"Spinner<\/center><\/p>\n
\n
Custom Spinner:<\/strong><\/h4>\n
Custom Spinner is used to display a spinner item with image, text etc (i.e. creating more custom list item). It is achieved in Android using custom adapter like base adapter. For more details read Custom Spinner Tutorial<\/a>.<\/p>\n
\"Custom<\/center><\/p>\n","protected":false},"excerpt":{"rendered":"
In Android, Spinner provides a quick way to select one value from a set of values. Android spinners are nothing but the drop down-list seen in other programming languages. In a default state, a spinner shows its currently selected value. It provides a easy way to select\u00a0a value from a list of values. In Simple … Continue reading Spinner Tutorial With Examples In Android Studio<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"home.php","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-655","page","type-page","status-publish","hentry"],"acf":[],"psp_head":"Spinner Tutorial With Examples In Android Studio \u2013 Abhi Android<\/title>\r\n<meta name=\"description\" content=\"Tutorial on Spinner which provides a quick way to select one value from a set of values. Learn it with examples in Android Studio and code.\" \/>\r\n<meta name=\"robots\" content=\"index,follow\" \/>\r\n<link rel=\"canonical\" href=\"https:\/\/abhiandroid.com\/ui\/spinner\" \/>\r\n","_links":{"self":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/655","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/comments?post=655"}],"version-history":[{"count":3,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/655\/revisions"}],"predecessor-version":[{"id":2799,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/pages\/655\/revisions\/2799"}],"wp:attachment":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/media?parent=655"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}