Charaf Eddine Mechalikh Charaf Eddine Mechalikh - 4 months ago 46
Android Question

Changing spinner arrow, Appcompat v21

i have activities which i themed with my custom theme, but for spinner i choosed to style it with Appcompat v21 but i got this :
enter image description here

So how to change the Spinner arrow to be black or blue if is there a way ?

i found this as similar question but doesn't have any answer : add custom spinner arrow
here is my spinner :

<Spinner
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/spinner2"
android:layout_marginTop="10dp"
android:layout_centerInParent="true" />


i used this to style the spinner:

<style name="MyTheme.SpinnerAppTheme" parent="Widget.AppCompat.Spinner">
</style>


this is how i use the adapter

ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(
getBaseContext(), R.array.listMedRes, android.R.layout.simple_spinner_item);


i just want to theme the spinner , thanks alot

Answer

Since you are using AppCompat-v21, you can take advantage of the new material design styles attributes:

colorPrimary: your app branding color for the app bar, applies to action bar

colorPrimaryDark: darker variant for the status bar and contextual app bars

colorAccent: lets you define bright complement to the primary branding color. By default, this is the color applied to framework controls (via colorControlActivated)

colorControlNormal: color applied to framework controls in their normal state

colorControlActivated: applied to framework controls in their activated

Here is an example for you

styles.xml

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- colorPrimary is used for the default action bar background -->
    <item name="colorPrimary">@color/primary</item>
    <!-- colorPrimaryDark is used for the status bar -->
    <item name="colorPrimaryDark">@color/primary_dark</item>
    <!-- colorAccent is used as the default value for colorControlActivated which is used to tint widgets -->
    <item name="colorAccent">@color/accent</item>
    <item name="colorControlNormal">@color/primary</item>
</style>

colors.xml

<resources>
    <color name="primary">#ff0000ff</color>
    <color name="primary_dark">#ff0000af</color>
    <color name="accent">#870000ff</color>
    <color name="white">#ffffffff</color>
</resources>

Here is how it looks

enter image description here

Hope this helps.

Comments