Spinner with border

Question

I would like to design a simple spinner like below:

Below is my code: sinnerBg.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item
      android:state_window_focused="false" android:state_enabled="true"
      android:drawable="@android:color/black" />
  <item>
    <layer-list>
      <item>
        <shape>

          <solid android:color="#ffffff" />
          <stroke android:width="1dp" android:color="#000000" />



          <padding android:bottom="3dp" android:left="3dp" android:right="3dp" android:top="3dp" />
        </shape>
      </item>
      <item >
        <bitmap android:gravity="right" android:src="@drawable/arrow_down" />
      </item>
    </layer-list>
  </item>

</selector>

In style.xml:

 <style name="spinner_style">
    <item name="android:layout_width">match_parent</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:background">@drawable/spinnerBg</item>
    <item name="android:layout_margin">10dp</item>
    <item name="android:paddingLeft">8dp</item>
    <item name="android:paddingRight">20dp</item>
    <item name="android:paddingTop">5dp</item>
    <item name="android:paddingBottom">5dp</item>
    <item name="android:popupBackground">#000000</item>
    <item name="backgroundTint">#ffffff</item>
    <item name="android:textColor">#000000</item>
  </style>

Spinner in my axml file:

<Spinner
            android:layout_width="64.0dp"
            android:layout_height="wrap_content"
            android:layout_weight="0.75"
            android:ems="10"
            android:spinnerMode="dropdown"
            android:layout_marginRight="6.0dp"
            android:id="@+id/PIC"
            android:layout_marginTop="12.5dp"
            style="@style/spinner_style" />

The code to populate the spinner:

ArrayAdapter<ViewModel> myAdapter = new ArrayAdapter<ViewModel>(this, Android.Resource.Layout.SimpleSpinnerDropDownItem, InfoList);
_spinner.Adapter = myAdapter;

The selected text color of my spinner is coming white which is why the spinner selected text is not displayed in my page:

What am I missing? Any help?

EDIT This is happening because my spinner is inside linear layout which has background color white:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">
android:background="@color/white">

I want my page to be white. That is the reason I had set white background for root linearlayout.

Answer 1

You can use

android:spinnerItemStyle
android:spinnerDropDownItemStyle

You are missing to set

textAppearanceSmallPopupMenu

 <item name="android:textAppearanceSmallPopupMenu">@style/my_style</item>

Finally

<style name="my_style" parent="@android:style/TextAppearance.DeviceDefault.Widget.PopupMenu.Small">
        <item name="android:textColor">#000000</item>
        <item name="android:textSize">12sp</item>
    </style>

Answer 2

I managed to solve the issue. Hope it helps. Here is my solution for it:

style.xml:

<style name="spinner_style">
    <item name="android:layout_width">match_parent</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:background">@drawable/gradient_spinner</item>
    <item name="android:layout_marginTop">2dp</item>
  </style>

gradient_spinner.xml

<?xml version="1.0" encoding="utf-8" ?>

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

  <item>
    <layer-list>
      <item>
        <shape>
          <solid android:color="#ffffff" />
          <stroke android:width="1dp" android:color="#000000" />
          <padding android:bottom="3dp" android:left="3dp" android:right="3dp" android:top="3dp" />
        </shape>
      </item>
      <item >
        <bitmap android:gravity="bottom|right" android:src="@drawable/ic_arrow_down" />
      </item>
    </layer-list>
  </item>

</selector>

I made a change here, added SetDropDownViewResource with custom layout:

ArrayAdapter<AgentViewModel> agentAdapter = new ArrayAdapter<AgentViewModel>(this, Resource.Layout.custom_spinner_item, InfoList);
agentAdapter.SetDropDownViewResource(Resource.Layout.spinner_dropDowm_item_view);
_spinner.Adapter = agentAdapter;

spinner_dropDowm_item_view.xml

<TextView
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:gravity="left"
  android:textColor="@color/white"
  android:padding="10dp"
/>

And added spinner_style style to the spinner:

<Spinner
 android:layout_width="64.0dp"
 android:layout_weight="0.75"
 android:ems="10"
 android:spinnerMode="dropdown"
 android:id="@+id/spinner"
 android:layout_marginTop="12.5dp"
 android:layout_column="1"
 android:layout_columnSpan="3"
 android:layout_row="0"
 android:layout_columnWeight="3"
 android:layout_marginRight="7.0dp"
 android:layout_marginBottom="4.5dp"
 style="@style/spinner_style" />