5

When O click on this spinner it gives a big dropdown:

enter image description here

I want a very small view as in the second image. Just like dropdowns in ASP.NET. Like this with width little more reduced.

enter image description here

I used the following code. Any help to change the view of second image will be appreciated.

Spinner spinner = (Spinner) findViewById(R.id.spinner);
ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(
       this, R.array.planets_array, android.R.layout.simple_spinner_item);
adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
spinner.setAdapter(adapter);
Joachim Sauer
  • 302,674
  • 57
  • 556
  • 614
Rockin
  • 723
  • 4
  • 25
  • 51

3 Answers3

10

This is a good article : Customizing the Action Bar

And also you can try this :

Design you own customized drawable for spinner background and apply to it. For spinnerbackground.xml images you can refer the images from the SDK. recreate the images as per your design requirements

"Android-sdk\platforms\android-9\data\res\drawable-hdpi\*.png"

spinnerbackground.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_window_focused="false" android:state_enabled="true"
        android:drawable="@drawable/wlbtn_dropdown_normal" />
    <item
        android:state_window_focused="false" android:state_enabled="false"
        android:drawable="@drawable/wlbtn_dropdown_disabled" />
    <item
        android:state_pressed="true"
        android:drawable="@drawable/wlbtn_dropdown_pressed" />
    <item
        android:state_focused="true" android:state_enabled="true"
        android:drawable="@drawable/wlbtn_dropdown_selected" />
    <item
        android:state_enabled="true"
        android:drawable="@drawable/wlbtn_dropdown_normal" />
    <item
        android:state_focused="true"
        android:drawable="@drawable/wlbtn_dropdown_disabled_focused" />
    <item
        android:drawable="@drawable/wlbtn_dropdown_disabled" />
</selector>

then for spinner widget apply your custom drawable:

<Spinner android:background="@drawable/spinnerbackground"
         android:id="@+id/spinnerIDr"
         android:layout_height="wrap_content" 
         android:layout_width="fill_parent">
    </Spinner>

Edited :

<Spinner android:background="@drawable/spinnerbackground"
         android:id="@+id/spinnerIDr"
         android:popupBackground="@drawable/popup_background"
         android:layout_height="wrap_content" 
         android:layout_width="fill_parent">
    </Spinner>

where popup_background is : enter image description here

and

Design your custom layout for spinner texts as (name : custom_spiner.xml)

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:padding="4dp"
    android:textSize="14sp"
    android:typeface="serif"
    android:singleLine="true"
    android:layout_marginLeft="2dip"
    android:layout_marginRight="5dip"
    android:ellipsize="marquee"
    android:textColor="#000000">
</TextView>

and use it as

adapter.setDropDownViewResource(R.layout.custom_spiner);

in your code.

Edited 2:

if you want to do this using java code read about PopupWindow

And may be useful : custom-spinner

Pankaj Kumar
  • 81,967
  • 29
  • 167
  • 186
  • i think this not a good idea...i am changing inbulit things...also if i debug from some other system..it wont show the changes...customize the view using code... – Rockin Aug 10 '11 at 06:10
  • @Rockin see my updates. And be clear what you are asking. Do you want to do this with java code? – Pankaj Kumar Aug 10 '11 at 06:20
  • i want to reduce the size of the second image...width and all – Rockin Aug 10 '11 at 06:35
  • Which image? Is that popup_background? you don't need to change size of that image, just put android:dropDownHeight="100dip" and android:dropDownWidth="50dip" to spinner. – Pankaj Kumar Aug 10 '11 at 06:40
  • android:dropDownHeight="20dipandroid:dropDownWidth="20dip" i dont see option coming in – Rockin Aug 10 '11 at 06:49
  • Can you post that image, as what you want, and in current what is result image? – Pankaj Kumar Aug 10 '11 at 06:58
  • @Rockin let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/2309/discussion-between-pankaj-and-rockin) – Pankaj Kumar Aug 10 '11 at 06:58
  • This may be useful : http://stackoverflow.com/questions/3033422/how-can-i-manage-the-height-of-android-spinner-items – Pankaj Kumar Aug 10 '11 at 07:32
  • Did you able to achieve width and height like asp.net dropdown. I am also trying the same thing. – shunty Mar 25 '12 at 10:38
1

Add attribute in the Spinner tag

android:dropDownWidth="150dp"

Umar Nafeez
  • 1,011
  • 7
  • 3
1

Follow these steps. I have already implemented this.

(1) Do not use spinner. Instead use a button with background set to "@android:drawable/btn_dropdown". This button will look exactly same as native spinner. If you want it to look any different use your own resource.

(2) You need to override dialog class and invoke it on button click. In the constructor of the extended Dialog class, you can use your own layout resource.

this.setContentView(R.layout.dropdownlist);

You can also change window look and feel using following code

WindowManager.LayoutParams lp = getWindow().getAttributes();
lp.width = dlgWidth;
lp.height = dlgHeight;
lp.dimAmount = 0;
getWindow().setAttributes(lp);
getWindow().setBackgroundDrawableResource(mBackgroundResId);

(3) You can have a list view in your custom layout and on "OnItemClickListener" of the list, dismiss the dialog and do what you need to do further.

I hope this helps.

Yogesh
  • 311
  • 1
  • 10