How to customize Spinner Background in android?
Asked Answered
G

4

5

I want to change spinner look in android and I want it to be same for all the devices. I tried to do the same but failed to do so. If I use Tag, I am not able to customize it. I am adding screenshot of image of how I want.

http://prntscr.com/gb3oh9

Gocart answered 21/8, 2017 at 9:18 Comment(2)
Please come up with the code you triedCrab
check this question answerCassandracassandre
L
10

Try something like this:

<selector xmlns:android="http://schemas.android.com/apk/res/android">

  <item>
    <layer-list>
       <item>
            <shape android:shape="rectangle">
                <solid android:color="@color/white" />
                <stroke android:width="2px" android:color="@color/darkgray_7" />
                <corners android:radius="5dp" />
            </shape>
       </item>

       <item>
            <bitmap
                android:gravity="right" android:src="@drawable/arrow" />
       </item>
    </layer-list>
  </item>

</selector>
Lacour answered 21/8, 2017 at 9:22 Comment(0)
L
2

Try following code for custom Spinner

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item><layer-list>
        <item><shape>
            <gradient android:angle="90" android:startColor="@color/white" android:endColor="@color/appblue" />

            <stroke android:width="1dp" android:color="@color/block"  />

            <corners android:radius="4dp" />

            <padding android:bottom="3dp" android:left="3dp" android:right="3dp" android:top="3dp" />
        </shape></item>
        <item ><bitmap android:gravity="right|center" android:src="@drawable/drop_arrow"  android:tint="@color/red" />
        </item>
    </layer-list></item>

</selector>
Lemkul answered 21/8, 2017 at 9:29 Comment(1)
@Deepanshi Gupta This code working for me you will your expecting output.Lemkul
C
0

You can change background color and drop down icon like doing this way

Step1: In drawable folder make background.xml for border of spinner.

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@android:color/transparent" />
<corners android:radius="5dp" />
<stroke
android:width="1dp"
android:color="@color/darkGray" />
</shape>  //edited

Step 2: For layout design

<RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginRight="3dp"
                android:layout_weight=".28"
                android:background="@drawable/spinner_border"
                android:orientation="horizontal">

                <Spinner
                    android:id="@+id/spinner2"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_centerVertical="true"
                    android:layout_gravity="center"
                    android:background="@android:color/transparent"
                    android:gravity="center"
                    android:layout_marginLeft="5dp"
                    android:spinnerMode="dropdown" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_centerVertical="true"
                    android:layout_gravity="center"
                    android:src="@mipmap/drop" />

            </RelativeLayout>

Step ex:And for dropdown arrow(styling) of the spinner you can try applying following style to your spinner using:

style="@style/SpinnerTheme"

//Spinner Style:

<style name="SpinnerTheme" parent="android:Widget.Spinner">
<item name="android:background">@drawable/backgroundg_spinner</item>
</style>

//backgorundg_spinner.xml Replace the arrow_down_gray with your arrow

<item>

    <layer-list>

        <item>
            <shape>
                <gradient android:angle="90" android:endColor="#ffffff" android:startColor="#ffffff" android:type="linear" />

                <stroke android:width="0.33dp" android:color="#0fb1fa" />

                <corners android:radius="0dp" />

                <padding android:bottom="3dp" android:left="3dp" android:right="3dp" android:top="3dp" />
            </shape>
        </item>

        <item android:right="5dp">

            <bitmap android:gravity="center_vertical|right" android:src="@drawable/arrow_down_gray" />

        </item>

    </layer-list>

</item>


Finally just find your particular ColorCode and append it.Here Hope it helps...

Crab answered 21/8, 2017 at 9:32 Comment(0)
M
0

This is how I did it (RTL Spinner):

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <layer-list>
            <item android:drawable="@drawable/ic_down_white" android:gravity="left|center" />
            <item>
                <shape>
                    <corners android:radius="4dp" />
                    <solid android:color="#19FFFFFF" />
                </shape>
            </item>
        </layer-list>
    </item>
</select
Matterhorn answered 3/2, 2020 at 7:22 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.