Comment puis-je corriger le style Spinner pour Android 4.x placé au-dessus de la barre d'outils

Question

Selon documentation Android , le style Matériau est pris en charge pour le widget Spinner.

J'ai donc décidé de l'utiliser dans mon application en le plaçant au-dessus de la barre d'outils.

layout/activity_base.xml

<Android.support.v7.widget.Toolbar
    Android:id="@+id/my_awesome_toolbar"
    Android:layout_height="wrap_content"
    Android:layout_width="match_parent"
    Android:minHeight="?attr/actionBarSize"
    Android:background="?attr/colorPrimary"
    Android:elevation="5dp"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
    <Spinner
        Android:id="@+id/spinner"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"/>
 </Android.support.v7.widget.Toolbar>

Thème de l'activité

<style name="BaseAppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/omni_primary_color</item>
    <item name="colorPrimaryDark">@color/omni_primary_color_dark</item>
    <item name="colorAccent">@color/omni_accent_color</item>
</style>

BaseActivity.Java

public class BaseActivity extends ActionBarActivity {

    @InjectView(R.id.my_awesome_toolbar)
    Toolbar mToolbar;

    @InjectView(R.id.spinner)
    Spinner spinner;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_base);
        ButterKnife.inject(this);
        //setup toolbar
        setSupportActionBar(mToolbar);
        getSupportActionBar().setDisplayShowTitleEnabled(false);
        mToolbar.setNavigationIcon(R.drawable.ic_action_navigation_menu);

        ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(mToolbar.getContext(),
                R.array.planets_array, R.layout.support_simple_spinner_dropdown_item);
        adapter.setDropDownViewResource(R.layout.support_simple_spinner_dropdown_item);
        spinner.setAdapter(adapter);
    }
}

Sur Lollipop, le menu déroulant et la liste déroulante semblent bien, même si la couleur d’arrière-plan de la liste déroulante est noire comparée à celle du menu déroulant qui est blanc. Je suppose que app:popupTheme="@style/ThemeOverlay.AppCompat.Light" ne se propage pas au cinéaste.

Android 5.0

Maintenant, le gros problème est avec Android 4.x où la couleur d’arrière-plan déroulante est en blanc (popupTheme propagé?) Et l’icône en regard de la roulette en noir est noire.

Android 4.4

Comment puis-je le définir correctement dans le XML ou implémenter dans le code pour le faire fonctionner à la fois Android 5 et 4? Idéalement, je voudrais avoir les deux ressemble à sur Android 5 mais avec une liste déroulante blanche (comme dans le menu déroulant Paramètre).

Mettre à jour

J'ai remarqué que définir la propriété colorControlNormal affecte l'icône du filtre de spinner. Si quelqu'un découvre comment utiliser cela pour Spinner (sans changer les autres contrôles de contenu), ma solution serait alors combinée à celle de @Sven.

Mettre à jour

La modification suivante résout le problème du texte en incrustation et de la couleur contextuelle. Donc, le seul problème de la solution finale est l’icône du filtre.

ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(getSupportActionBar().getThemedContext(),
                R.array.planets_array, R.layout.support_simple_spinner_dropdown_item);
        adapter.setDropDownViewResource(Android.R.layout.simple_spinner_dropdown_item);

Mettre à jour

J'ai trouvé que l'icône du filtre faisait en fait partie de Android:background spécifié pour le casserole et c'est transparent. Fournir son propre arrière-plan le corrigerait, par exemple.

<item name="Android:background">?android:selectableItemBackground</item>

Mystère résolu!

La dernière pièce du puzzle est le popup sur Android 5 qui a un fond noir et du texte blanc mais je suppose que cela peut être résolu avec une mise en page personnalisée. Si personne ne fournit une réponse complète, je le ferai moi-même et marquer comme accepté.

Answer 1

Je sais que c'est tard, mais je suis tombé sur cette question lorsque j'ai rencontré ce problème moi-même et que j'ai trouvé une solution dans le BrowseSessionsActivity du application Google I/O 2014 et l'a adapté. .

Layouts

toolbar_spinner.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="wrap_content"
    Android:layout_height="match_parent"
    Android:orientation="vertical">

    <Spinner
        Android:id="@+id/toolbar_spinner"
        style="@style/Widget.MyApp.HeaderBar.Spinner"
        Android:layout_width="wrap_content"
        Android:layout_height="match_parent"/>

</LinearLayout>

toolbar_spinner_item_actionbar.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="200dp"
    Android:layout_height="wrap_content"
    Android:orientation="vertical">

    <TextView
        Android:id="@Android:id/text1"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:drawablePadding="8dp"
        Android:drawableRight="@drawable/spinner_triangle"
        Android:fontFamily="sans-serif"
        Android:paddingLeft="16dp"
        Android:paddingRight="4dp"
        Android:textColor="#ffffffff"
        Android:textSize="18dp"
        Android:textStyle="bold"/>

</LinearLayout>

Le dessinable spinner_triangle Peut être trouvé ici .

toolbar_spinner_item_dropdown.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="200dp"
    Android:layout_height="wrap_content"
    Android:orientation="vertical">

    <TextView
        Android:id="@Android:id/text1"
        Android:layout_width="match_parent"
        Android:layout_height="48dp"
        Android:drawablePadding="8dp"
        Android:gravity="center_vertical|start"
        Android:paddingLeft="16dp"
        Android:paddingRight="16dp"
        Android:textColor="#ff333333"
        Android:textSize="16sp"/>

</LinearLayout>

Modes

toolbar_spinner.xml Utilise le style suivant.

<style name="Widget.MyApp.HeaderBar.Spinner" parent="Widget.AppCompat.Light.Spinner.DropDown.ActionBar">
        <item name="Android:background">?android:selectableItemBackground</item>
        <item name="Android:dropDownSelector">?android:selectableItemBackground</item>
        <item name="Android:divider">@null</item>
        <item name="Android:overlapAnchor">true</item>
</style>

Adaptateur

Cet adaptateur devra être modifié pour répondre à vos propres besoins. getTitle() renvoie le texte de chaque élément affiché dans le compteur.

private class YourObjectSpinnerAdapter extends BaseAdapter {
    private List<YourObject> mItems = new ArrayList<>();

    public void clear() {
        mItems.clear();
    }

    public void addItem(YourObject yourObject) {
        mItems.add(yourObject);
    }

    public void addItems(List<YourObject> yourObjectList) {
        mItems.addAll(yourObjectList);
    }

    @Override
    public int getCount() {
        return mItems.size();
    }

    @Override
    public Object getItem(int position) {
        return mItems.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getDropDownView(int position, View view, ViewGroup parent) {
        if (view == null || !view.getTag().toString().equals("DROPDOWN")) {
            view = getLayoutInflater().inflate(R.layout.toolbar_spinner_item_dropdown, parent, false);
            view.setTag("DROPDOWN");
        }

        TextView textView = (TextView) view.findViewById(Android.R.id.text1);
        textView.setText(getTitle(position));

        return view;
    }

    @Override
    public View getView(int position, View view, ViewGroup parent) {
        if (view == null || !view.getTag().toString().equals("NON_DROPDOWN")) {
            view = getLayoutInflater().inflate(R.layout.
                    toolbar_spinner_item_actionbar, parent, false);
            view.setTag("NON_DROPDOWN");
        }
        TextView textView = (TextView) view.findViewById(Android.R.id.text1);
        textView.setText(getTitle(position));
        return view;
    }

    private String getTitle(int position) {
        return position >= 0 && position < mItems.size() ? mItems.get(position).title : "";
    }
}

Ajout de la roulette à votre barre d’outils

Toolbar toolbar = getActionBarToolbar();

View spinnerContainer = LayoutInflater.from(this).inflate(R.layout.toolbar_spinner,
        toolbar, false);
ActionBar.LayoutParams lp = new ActionBar.LayoutParams(
        ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
toolbar.addView(spinnerContainer, lp);

YourObjectSpinnerAdapter spinnerAdapter = new YourObjectSpinnerAdapter();
spinnerAdapter.addItems(getMyObjectSpinnerData());

Spinner spinner = (Spinner) spinnerContainer.findViewById(R.id.toolbar_spinner);
spinner.setAdapter(spinnerAdapter);

Résultat

Answer 2

Désolé pour mon mauvais anglais. :) Je pense qu'il est préférable de créer directement le spinner dans la barre d'outils.

Voici un exemple dans mon fragment.

public class Testfragment1 extends Fragment {

    Toolbar mToolbar;
    Spinner mSpinner;
    .....

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
        .......                  
        mToolbar = (Toolbar) getActivity().findViewById(R.id.toolbar);
        //you can also set the style with the constructor
        mSpinner = new Spinner(getActivity());
        String[] frags = new String[]{
                "category1",
                "category2",
                "category3",
        };
        ArrayAdapter<String> arrayAdapter = new ArrayAdapter<String>(getActivity(),Android.R.layout.simple_list_item_1,frags);
        mSpinner.setAdapter(arrayAdapter);
        mToolbar.addView(mSpinner);
        return inflater.inflate(R.layout.fragment_testfragment1, container, false);
    }

    .........

    @Override
    public void onDestroyView() {
        super.onDestroyView();
        if (mToolbar != null && mSpinner != null) {
            mToolbar.removeView(mSpinner);
        }
    }
}

Il semble bien sur mon appareil Android-4.1: Android-4.1-spinner

Answer 3

Ne pas implémenter Spinner en XML

final ArrayAdapter spinnerAdapter = ArrayAdapter.createFromResource(getSupportActionBar().getThemedContext(),
            R.array.main_navigation_list, R.layout.spinner_text);
    spinnerAdapter.setDropDownViewResource(R.layout.spinner_dropdown_item);
    mNavigationTags = getResources().getStringArray(R.array.main_navigation_list);


    mNavigationSpinner = new Spinner(getSupportActionBar().getThemedContext());
    mNavigationSpinner.setAdapter(spinnerAdapter);

    mNavigationSpinner.setOnItemSelectedListener(this);
    mToolbar.addView(mNavigationSpinner);

De cette façon, l'icône à côté de spinner sera blanche

Answer 4

Je me bats avec exactement le même problème.

Essayez de changer la ressource de vue déroulante. Au moins, le problème de couleur du texte a été résolu, mais la couleur de l'icône en forme de flèche est toujours sombre. Donc, ceci est juste une solution de contournement partielle.

setDropDownViewResource(Android.R.layout.simple_spinner_dropdown_item);

Answer 5

Un moyen simple qui n'est pas parfait, mais suffisamment uniforme pour les versions 4.x et 5.0

J'ai enlevé le <Spinner> à partir des fichiers de mise en page et l'a ajouté par programme - cela a permis au triangle blanc de s'afficher correctement.

J'ai également créé une présentation d'élément déroulant en utilisant la couleur requise par appcompat.

layout/spinner_dropdown_item.xml, notez le Android:background="@color/primaryColor"

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:Android="http://schemas.Android.com/apk/res/Android"
      Android:id="@Android:id/text1"
      Android:layout_width="match_parent"
      Android:layout_height="wrap_content"
      Android:textAppearance="?android:attr/textAppearanceListItemSmall"
      Android:gravity="center_vertical"
      Android:paddingLeft="12dp"
      Android:paddingRight="12dp"
      Android:background="@color/primaryColor"
      Android:minHeight="?android:attr/listPreferredItemHeightSmall" />

Et dans l'activité:

    SpinnerAdapter spinnerAdapter = ArrayAdapter.createFromResource(getApplicationContext(), R.array.your_array, R.layout.spinner_dropdown_item);
    Spinner navigationSpinner = new Spinner(getSupportActionBar().getThemedContext());
    navigationSpinner.setAdapter(spinnerAdapter);
    toolbar.addView(navigationSpinner, 0);

Ce n'est pas parfait et les éléments ne sont pas mis en surbrillance lorsque vous cliquez dessus, mais c'est suffisant en attendant que les futures bibliothèques appcompat résolvent ces problèmes (j'espère de toute façon).

Answer 6

J'ai passé deux jours sur ce problème, mais maintenant, après avoir lu de nombreuses réponses, je peux poster ma solution. J'ai implémenté deux mises en page personnalisées pour l'élément spinner et popup. Définir cet attribut pour spinner: Android:background="?android:selectableItemBackground" la flèche noire spinner par défaut est masquée et nous pouvons utiliser ce que nous préférons. J'ai utilisé la méthode setDropDownVerticalOffset (int) pour gérer la position contextuelle sur les versions antérieures à Lollipop Android.

Le thème global de mon application est

<style name="AppTheme" parent="AppTheme.Base">

</style>

<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/primary</item>
    <item name="colorPrimaryDark">@color/primary_dark</item>
    <item name="colorAccent">@color/accent</item>
    <item name="Android:windowBackground">@color/window_background</item>
</style>

Maintenant, la présentation de l'activité qui contient la barre d'outils et le compteur:

activity_main.xml

<RelativeLayout
    Android:layout_width="match_parent" 
    Android:layout_height="match_parent"

    Android:clickable="true" >

    <Android.support.v7.widget.Toolbar
        Android:id="@+id/toolbar"
        Android:layout_width="match_parent"
        Android:layout_height="?attr/actionBarSize"
        Android:background="?attr/colorPrimary"
        Android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        Android:elevation="4dp"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light" >

            <Spinner 
                Android:id="@+id/spinner_rss"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:theme="@style/ThemeOverlay.AppCompat.Light"
                Android:background="?android:selectableItemBackground" />

         </Android.support.v7.widget.Toolbar>
</RelativeLayout>

custom_spinner_toolbar.xml

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

<RelativeLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent" >

<TextView
    Android:id="@+id/spinner_item_text"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_centerVertical="true"
    Android:singleLine="true"
    Android:textColor="@Android:color/white"
    Android:textAppearance="@style/TextAppearance.AppCompat.Title"
     />

<ImageView
    Android:contentDescription="@string/content_description_arrow_dropdown"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_toRightOf="@+id/spinner_item_text"
    Android:layout_toEndOf="@+id/spinner_item_text"
    Android:paddingTop="6dp"
    Android:src="@drawable/ic_arrow_drop_down_white_24dp" />

</RelativeLayout>

custom_spinner_dropdown_item.xml

<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:orientation="vertical" >

    <CheckedTextView
        Android:id="@+id/spinner_item_text"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:padding="16dp"
        Android:singleLine="true"
        Android:textColor="@Android:color/black"
        Android:textSize="16sp" />

</LinearLayout>

SpinnerAdapter.Java

public class SpinnerAdapter extends BaseAdapter
{
   private Context mContext;
   private List<String> mValuesList;

   public SpinnerAdapter(Context mContext, List<String> mValuesList)
   {
       this.mContext = mContext;
       this.mValuesList = mValuesList;
   }

   @Override
   public int getCount() 
   {
       return mValuesList.size();
   }

   @Override
   public Object getItem(int position) 
   {
       return mValuesList.get(position);
   }

   @Override
   public long getItemId(int position) {
       // TODO Auto-generated method stub
       return 0;
   }

   @Override
   public View getDropDownView(int position, View view, ViewGroup parent) 
   {
      if (view == null || !view.getTag().toString().equals("DROPDOWN")) 
      {
         LayoutInflater inflater = LayoutInflater.from(mContext);
         view = inflater.inflate(R.layout.custom_spinner_dropdown_item, parent, false);
         view.setTag("DROPDOWN");
      }

      TextView textView = (TextView) view.findViewById(R.id.spinner_item_text);
      textView.setText(getTitle(position));

      return view;
  }

  @Override
  public View getView(int position, View view, ViewGroup parent) 
  { 
      if (view == null || !view.getTag().toString().equals("NON_DROPDOWN")) 
      {
         LayoutInflater inflater = LayoutInflater.from(mContext);
         view = inflater.inflate(R.layout.custom_spinner_toolbar, parent, false);
         view.setTag("NON_DROPDOWN");
      }

      TextView textView = (TextView) view.findViewById(R.id.spinner_item_text);
      textView.setText(getTitle(position));
      return view;
   }

   private String getTitle(int position) 
   {
      return position >= 0 && position < mValuesList.size() ?   mValuesList.get(position) : "";
   }
}

Enfin, la partie pertinente du code source de l’activité:

@Override
protected void onCreate(Bundle savedInstanceState) 
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    mToolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(mToolbar);

    final ActionBar actionBar = getSupportActionBar();
    actionBar.setDisplayShowTitleEnabled(false);
    actionBar.setHomeAsUpIndicator(R.drawable.ic_menu);
    actionBar.setDisplayHomeAsUpEnabled(true);

    mSpinner = (Spinner) findViewById(R.id.spinner_rss);

    String[] items = getResources().getStringArray(R.array.spinner_rss_items);
    List<String> spinnerItems = new ArrayList<String>();

    for(int i = 0; i < items.length; i++)
    {
        spinnerItems.add(items[i]);
    }

    SpinnerAdapter adapter = new SpinnerAdapter(actionBar.getThemedContext(), spinnerItems);
    mSpinner.setAdapter(adapter);

    if(Build.VERSION.SDK_INT < Build.VERSION_CODES.Lollipop)
    {
        mSpinner.setDropDownVerticalOffset(-116);
    }
}

Voici les résultats sur Lollipop et KitKat:

J'espère que ça aide! :)

Answer 7

Utilisez Android: dropDownVerticalOffset propriété à l'intérieur de spinner pour donner un espacement à partir du haut.

<Spinner
        Android:id="@+id/spnrLanguage"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:layout_marginTop="5dp"
        Android:background="@drawable/ic_dropdown"
        Android:padding="5dp"
        Android:spinnerMode="dropdown"
        Android:dropDownVerticalOffset="50dp"
        />

N'oubliez pas de définir Android: spinnerMode = "dropdown" bien que cela ne fonctionne pas dans spinnerMode= dialogue

Answer 8

Eu exactement le même problème avec le spinner

Ce que j'ai fait a été d'ajouter un thème personnalisé à spinner

 <Spinner
                Android:id="@+id/spinner1"
                Android:layout_width="match_parent"
                Android:layout_height="30sp"
                Android:entries="@array/guest_type"
                Android:Prompt="@string/guesttype"
                Android:theme="@style/AppTheme1"   />

styles.xml

  <style name="AppTheme1" parent="Theme.AppCompat.Light">
    <item name="Android:spinnerDropDownItemStyle">@style/mySpinnerItemStyle</item>
</style>

<style name="mySpinnerItemStyle" parent="@Android:style/Widget.Holo.DropDownItem.Spinner">
    <item name="Android:textColor">#000000</item>
</style>

Answer 9

Tu ne peux pas faire ça?

Fichier xml personnalisé pour l'élément spinner: your_spinner.xml:

<?xml version="1.0" encoding="utf-8"?>
<TextView  
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent" 
    Android:layout_height="wrap_content" 
    Android:textColor="#000"         
    Android:background="#FFF"
    />

Utilisez cette option pour afficher les éléments de spinner:

ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, R.layout.your_spinner,list);

Ensuite, supprimez la ressource déroulante.

Answer 10

Quand j'ai utilisé spinner, il s'est écrasé (Android 2.3.3 - 2.3.7).

Donc, j'essaie d'utiliser TintSpinner maintenant, ça ne plante pas, essayez-vous comme une solution facultative

 <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout
        xmlns:Android="http://schemas.Android.com/apk/res/Android"
        Android:layout_width="wrap_content"
        Android:layout_height="match_parent"
        Android:orientation="vertical">

        <Android.support.v7.internal.widget.TintSpinner
            Android:id="@+id/toolbar_spinner"
            style="@style/HeaderBar.Spinner"
            Android:layout_width="wrap_content"
            Android:layout_height="match_parent"/>
    </LinearLayout>

Et utilisez le code ci-dessous pour lancer votre barre d’outils

 View spinnerContainer = LayoutInflater.from(this).inflate(R.layout.toolbar_spinner, toolbarTop, false);
        ActionBar.LayoutParams lp = new ActionBar.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.MATCH_PARENT);
        toolbarTop.addView(spinnerContainer, lp);

        ToolBarSpinnerAdapter spinnerAdapter = new ToolBarSpinnerAdapter(getLayoutInflater());
        String[] items = getResources().getStringArray(R.array.action_dropdown);
        spinnerAdapter.addItems(items);

        TintSpinner mNavigationSpinner = (TintSpinner) spinnerContainer.findViewById(R.id.toolbar_spinner);
        mNavigationSpinner.setAdapter(spinnerAdapter);

Answer 11

Pour continuer sur ce sujet, j'avais des problèmes similaires. Mon problème principal était que le texte de ma barre d'outils était plus petit que les dimensions de titre habituelles et que la couleur était mauvaise. Capture d'écran ici http://s27.postimg.org/v24x1aw43/Screen_Shot_2015_01_11_at_13_36_04.png

Le menu déroulant était ok, mais je vais aussi passer à la personnalisation de cela.

Permettez-moi également de préciser que ce correctif est principalement basé sur le correctif de @Daniel B. Toutefois, il ne nécessite pas d'adaptateur personnalisé, pour autant que je sache, rien n'est cassé, mais je ne donne aucune garantie!

1. Ajoutez un élément spinner normal dans le fichier de présentation XML (dans la barre d’outils).

<Android.support.v7.widget.Toolbar
        Android:id="@+id/toolbar"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:elevation="5dp"
        Android:minHeight="?attr/actionBarSize"
        Android:background="@color/colorPrimary"
        app:theme="@style/GalaxyZooThemeToolbarDarkOverflow"
        app:popupTheme="@style/Theme.AppCompat"
        >

    <Spinner
        Android:id="@+id/spinner_nav"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"/>


    </Android.support.v7.widget.Toolbar>

2. Créez un nouveau fichier de présentation toolbar_spinner_item_actionbar.xml (ce sera le contenu affiché pour le compteur dans la barre d’outils)

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

<TextView
    Android:id="@Android:id/text1"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:drawablePadding="20dp"
    Android:fontFamily="sans-serif"
    Android:paddingLeft="@dimen/abc_action_bar_default_padding_material"
    Android:paddingRight="4dp"
    Android:textColor="@color/colorDark"
    Android:textSize="@dimen/abc_text_size_title_material_toolbar"
    xmlns:Android="http://schemas.Android.com/apk/res/Android"/>

    <!-- Android:drawableRight="@drawable/spinner_triangle" -->

3. L'adaptateur de votre spinner reste à peu près le même, mais passez de la mise en page standard à Android.R.layout.simple_spinner_dropdown_item à R.layout.toolbar_spinner_item_actionbar. Cela appliquera votre apparence personnalisée pour le texte de la barre d’outils.

Dans cet exemple, j'ai défini adapter.setDropDownViewResource sur Android.R.layout.simple_spinner_dropdown_item, cela applique les valeurs par défaut du thème standard à la liste déroulante, ce qui me satisfait.

ArrayAdapter<String> set1Adapter = new ArrayAdapter<String>(RoutineDetailsActivity.this, R.layout.toolbar_spinner_item_actionbar, set1Actual);
        set1Adapter.setDropDownViewResource(Android.R.layout.simple_spinner_dropdown_item);

        mWeekSpinner.setAdapter(set1Adapter);

C'est fondamentalement ça, résultat ici [impossible d'attacher une image ou d'ajouter un autre lien car mon représentant est trop bas! Va ajouter dans le commentaire]. Vous pouvez vous arrêter ici, mais vous voudrez peut-être changer la couleur de la flèche déroulante.

Techniquement, il s'agit de la bonne teinte pour mon application. Toutefois, comme ma couleur principale correspond déjà à la couleur de la barre d'outils, il serait logique de personnaliser la flèche.

Configuration d'une flèche personnalisée dessinable

1. Ajoutez cette ligne "Android: drawableRight =" @ drawable/spinner_triangle "dans la barre d'outils_spinner_item_actionbar.xml créée précédemment. Il peut s'agir de n'importe quelle image. Pour l'instant, vous pouvez utiliser la flèche blanche de Daniel B ici https: // raw.githubusercontent.com/google/iosched/master/Android/src/main/res/drawable-xxhdpi/spinner_triangle.png .

Cela entraînera deux flèches, la flèche blanche et le thème par défaut. Pour résoudre ce problème, ajoutez le style ci-dessous. Encore une fois, cela est tiré du code de Daniel B et pourrait probablement être abrégé, mais pour l'instant cela fonctionne ....

    <style name="Widget.MyApp.HeaderBar.Spinner" parent="Widget.AppCompat.Light.Spinner.DropDown.ActionBar">
        <item name="Android:background">?android:selectableItemBackground</item>
        <item name="Android:dropDownSelector">?android:selectableItemBackground</item>
        <item name="Android:divider">@null</item>
        <item name="Android:overlapAnchor">true</item>
    </style>

2. Appliquez le style créé à la roulette ...

<Android.support.v7.widget.Toolbar
        Android:id="@+id/toolbar"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:elevation="5dp"
        Android:minHeight="?attr/actionBarSize"
        Android:background="@color/colorPrimary"
        app:theme="@style/GalaxyZooThemeToolbarDarkOverflow"
        app:popupTheme="@style/Theme.AppCompat"
        >

    <Spinner
        Android:id="@+id/spinner_nav"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        style="@style/Widget.MyApp.HeaderBar.Spinner"/>


    </Android.support.v7.widget.Toolbar>

Le résultat sera quelque chose comme ceci [à nouveau ne peut pas attacher ou lien, va ajouter au commentaire]. Le remplissage peut être défini à partir de la configuration du fichier plus tôt, dans mon cas, je devrais changer la flèche pour qu'elle corresponde aux icônes.

J'espère que cela a du sens.

Answer 12

J'ai perdu des heures sur cette question. Autant que je sache, les solutions ci-dessus nécessitent toutes un copier/coller de gros morceaux de code de style appcompat pour réimplémenter les détails de base tels que les états tactiles.

Un moyen relativement facile d’obtenir un comportement de type natif consiste à gonfler la vue par programme afin d’obtenir le bon thème, par exemple:

// Activity has context with 'Theme.AppCompat.Light.NoActionBar'
spinner = new AppCompatSpinner(getActivity());
toolbar.addView(spinner);

Pour que le triangle soit blanc plutôt que colorControlNormal, j'ai appliqué une teinte ColorStateList à l'arrière-plan:

ViewCompat.setBackgroundTintList(spinner, resources.getColorStateList(R.drawable.bg_toolbar_spinner)

bg_toolbar_spinner.xml

<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:color="@color/accent" Android:state_pressed="true"/>
    <item Android:color="@Android:color/white"/>
</selector>

Answer 13

Je l'ai résolu en créant de nouvelles valeurs pour les versions 21 et 23 et en ajoutant un nouvel attribut dans le style spinner Android: dropDownVerticalOffset et en le supprimant du fichier de style par défaut. (mon cas n'est pas lié à la barre d'outils) c'est pour spinner normal.

Ajouter ce style dans les dossiers 23 et 21

<style name="spinner_style">
    <item name="Android:background">@drawable/background_spinner</item>
    <item name="Android:dropDownVerticalOffset">30dip</item>
</style>

Cela fonctionne parfaitement sur toutes les versions. J'espère que cela fonctionne avec vous!

Answer 14

Vous pouvez corriger la position de la liste déroulante (apparaîtra en haut de la barre d’outils, comme dans le menu) pour Android 4 en utilisant ce code:

<Spinner
        Android:id="@+id/spinner"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:dropDownVerticalOffset="-56dp"/>

Answer 15

Pour colorer correctement l’icône Spinner, vous pouvez également simplement gonfler le filtre à partir du code:

spinner_toolbar.xml:

<?xml version="1.0" encoding="utf-8"?>
<Spinner xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@+id/spinner_toolbar"
    Android:layout_width="wrap_content"
    Android:layout_height="match_parent"/>

Ensuite, vous devez attacher le fileur à la barre d’outils de votre activité:

ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(getSupportActionBar().getThemedContext(),
            R.array.planets_array, R.layout.support_simple_spinner_dropdown_item);
adapter.setDropDownViewResource(R.layout.support_simple_spinner_dropdown_item);
spinner.setAdapter(adapter);

// we inflate the spinner with the themed Toolbar context -> correct icon tinting
LayoutInflater.from(getSupportActionBar().getThemedContext()).inflate(R.layout.spinner_toolbar, tb, true);

Spinner spinner = (Spinner) toolbar.findViewById(R.id.spinner_toolbar);
spinner.setAdapter(adapter);

Toutefois, cela utilise l’application: thème au lieu de l’application: popupTheme pour tout Spinner, y compris le menu déroulant. Par conséquent, l'icône Spinner et le texte seront colorés correctement, mais le menu déroulant a également le style de la barre d'outils et non celui du popupTheme.

Donc, si vous voulez avoir une barre d'outils sombre et un menu déroulant clair, vous devez corriger le style de menu déroulant, par exemple en créant un style personnalisé pour le compteur qui spécifie un arrière-plan blanc et une vue déroulante personnalisée avec une couleur de texte sombre .

Peut-être que quelqu'un d'autre a une meilleure solution sur la façon dont l'application: popupTheme peut être propagée au menu déroulant Spinner.