How to create android spinner without down triangle on the right side of the widget –

Development issue/problem:

I have a screen where the user has to enter many items, so space on the screen is very important.

I want the display of the widget on the screen (before the user clicks on it) to look like EditText or the left side of the spinner widget (without the normal descending triangle) on the right side of the spinner. When the user then clicks on the widget, the usual spinner selection dialog opens.

Is there a spider style attribute I can change to achieve this?

I couldn’t see a code like that.

Thank you.

How can I solve this problem?

Solution 1:

One thing you can do is get the source code of the spinner from the Android database, along with the appropriate layouts and sources, and use it to create your own custom widget (you probably just need to remove the arrow from the layout and tweak the code a bit to suit your needs).

You’re right, after that job it was very easy. You have to do two things.
First create a styles.xml file under res/values, open it and add the following:

Then, in your layout, add the file as follows:

That’s it, now the spinner looks like a normal EditText, without the annoying unused down arrow.

Solution 2:

It’s a pretty old question, but I think it’s still relevant, so here’s my answer:

Simple method

Leninhouse’s answer is correct. It works, but could be made even simpler: Just add another background. The following example uses a standard key background for a more uniform look:

The seal used in the other answer is nothing more than applying a background to a widget. This can be done directly with the widget, eliminating the need for a new xml file. Of course, if you still want to apply the style to the spinner, there’s nothing wrong with this approach.


The key to understanding how this works can be found in the description of the 9 platform PNGs. The lines on the right and bottom are used for padding, i.e. to prevent part of the space from being taken up by the content. In this case, the text is inside. The default rotating top background uses an image with a right arrow that falls outside the text box being used. See Figure 1 below for an illustration:

Figure 1. Original spider ground piece 9-patch PNG
Figure 1. Original Back Pad Spinner 9 patch PNG files.

It is not enough to remove the arrow, as the filling remains in place. You must use a new 9-platform image with reduced padding (see Figure 2 in the example based on Figure 1) or, for example, use one of the precompiled 9-platform images without this padding. B. for EditText (@android:drawable/edit_text) or Button (@android:drawable/btn_default).

Modified backpack tourniquet 9-band PNG with reduced padding

Figure 2. Modified Spinner background 9-patch PNG files with reduced padding.

Once you understand this, you can create your own background for Spinner (and any widget for that matter).

A better explanation of the 9 patch files can be found here.

It’s very easy to create files using the draw9patch executable from the SDK (read about it here), but nothing stops you from using Photoshop or Gimp instead. Remember that a PNG of 9 patches is just a PNG ! The only limitation is that you have to make sure that you only draw the outer pixel lines and that the rest of the pixels are completely transparent. Smoothing the border can produce unexpected results.

Solution 3:

I only got this far because my top didn’t show the triangle indicator, now I understand why: I set the background to white:


This removes the triangular indicator (the background image of the die and the liner claimed by Aleadam).

For my problem, I solved it by adding a LinearLayout parent to set the background to white.

Solution 4:

Give it a background and the arrow will disappear.

android:[email protected]/bg

Solution no. 5:

I had the same problem and changed my style:

[email protected]/Widget.AppCompat.Light.DropDownItem.Spinner

and it worked.

Oddly enough, he’s in the DropDownItem.

While the one with the bottom triangle would be normal.


Solution no. 6:

On a related question about the space taken up by clicking on the router, it appears that you can remove these large selection indicators on the right. You get the main list separated by lines, but you can click on an item and it still works.

Customize such a router to obtain selection indicators:

Spinner s1 = (Spinner) findViewById(;
ArrayAdapter1 = ArrayAdapter.createFromResource(
this, R.array.petals, android.R.layout.simple_spinner_item);
s1.setAdapter(adapt1) ;

For all indicators, the row setDropDownViewResource must not be skipped.

Solution no. 7:

why don’t you go to the dialogue with the list. Depending on your needs, create a text input field, add setOnFocusChangeListener, and then display a dialog with a list of items in the onFocusChange() method. For dialog with list items

new AlertDialog.Builder(this)
.setItems(R.array., new DialogInterface.OnClickListener(){
public void onClick(DialogInterface dialog, wherein) {
// TODO auto-generation methods stub
}}).show() ;

Solution no. 8:

No answer helped me, so here’s a very simple, one-step solution that worked.

//something to initialize the spinner ->
mySpinner.setAdapter ;

//Initialize the router->
mySpinner.getBackground().setColorFilter(Color.TRANSPARENT, PorterDuff.Mode.CLEAR) ;

I can’t say for sure if it only works with the default layout, but it has worked well with my configuration that I created for other needs.

Good luck!

 android-spinner change arrow icon colorandroid-spinner with border and arrowchange spinner dropdown icon androidremove spinner dropdown icon androidadd border to spinner androidchange drawable of spinnerandroid spinner dialog styleandroid spinner dropdown positionandroid spinner style material designandroid spinner hintandroid spinner height problem

You May Also Like