web-dev-qa-db-fra.com

Flèche Dropdown Spinner

J'essaie d'obtenir un spinner personnalisé tel que celui-ci:

mais j'ai seulement pu obtenir ceci:

enter image description here

Comme vous pouvez le constater, je rencontre plusieurs problèmes. 

  1. Bien que j'aie ajouté une flèche personnalisée, je vois toujours l'original.
  2. Ma flèche personnalisée est affichée à chaque ligne.
  3. Comment ajuster les dimensions de ma flèche personnalisée et la position de sa disposition?
  4. Comment générer des lignes soulignées?

Ceci est mon code:

onCreateView():

Spinner spinner = (Spinner) rootView.findViewById(R.id.spinner);
this.arraySpinner = new String[]{
    "Seleziona una data",
    "03 Agosto 2015",
    "13 Giugno 2015",
    "27 Novembre 2015",
    "30 Dicembre 2015",
};
ArrayAdapter<String> adapter = new ArrayAdapter<>(
        getActivity(),
        R.layout.row_spinner,
        R.id.weekofday,
        arraySpinner);

spinner.setAdapter(adapter);

res/layout/row_spinner.xml:

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

    <TextView Android:id="@+id/weekofday"
        Android:singleLine="true"
        Android:textSize="@dimen/textSize"
        style="@style/SpinnerDropdown"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"/>

    <ImageView Android:id="@+id/icon"
        Android:paddingStart="8dp"
        Android:paddingLeft="8dp"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:src="@drawable/spinner_arrow"/>

</LinearLayout>

MODIFIER

J'ai supprimé la ImageView et ajouté une seconde Spinnercreated à partir de la ressource:

ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(
        getActivity(),
        R.array.date,
        R.layout.spinner_layout);
spinnerDate.setAdapter(adapter);

Spinner spinnerTime = (Spinner) rootView.findViewById(R.id.spinnerTime);
ArrayAdapter<CharSequence> adapterTime = ArrayAdapter.createFromResource(
        getActivity(),
        R.array.ore,
        R.layout.spinner_layout);
spinnerTime.setAdapter(adapterTime);

avec cette mise en page:

<TextView xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@Android:id/text1"
    Android:padding="8dp"
    Android:singleLine="true"
    Android:layout_height="wrap_content" Android:layout_width="match_parent"/>

J'ai ajouté ceci à mon style.xml:

<style name="AppTheme" parent="@style/_AppTheme"/>
<!-- Base application theme. -->
<style name="_AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="Android:dropDownSpinnerStyle">@style/SpinnerTheme   </item>

    <item name="Android:windowActionBarOverlay">false</item>
    <item name="colorPrimary">@color/ColorPrimary</item>
    <item name="colorPrimaryDark">@color/ColorPrimaryDark</item>
</style>

....
.... 
....

<!--Spinner styles 2-->
<style name="SpinnerTheme" parent="Android:Widget.Spinner">
    <item name="Android:background">@drawable/apptheme_spinner_background_holo_light</item>
    <item name="Android:dropDownSelector">@drawable/apptheme_list_selector_holo_light</item>
</style>

<style name="SpinnerTheme.DropDown">
    <item name="Android:spinnerMode">dropdown</item>
</style>

<!-- Changes the spinner drop down item radio button style -->
<style name="DropDownItemSpinnerTheme" parent="Android:Widget.DropDownItem.Spinner">
    <item name="Android:checkMark">@drawable/apptheme_btn_radio_holo_light</item>
</style>

<style name="ListViewSpinnerTheme" parent="Android:Widget.ListView">
    <item name="Android:listSelector">@drawable/apptheme_list_selector_holo_light</item>
</style>

<style name="ListViewSpinnerTheme.White" parent="Android:Widget.ListView.White">
    <item name="Android:listSelector">@drawable/apptheme_list_selector_holo_light</item>
</style>

<style name="SpinnerItemTheme"
    parent="Android:TextAppearance.Widget.TextView.SpinnerItem">
    <item name="Android:textColor">#000000</item>
</style>

mais il n'y a pas de résultat! Je vois encore ceci:

enter image description here

EDIT 2

J'ai changé le style.xml en:

http://pastie.org/private/es40xgebcajajltksyeow

et voici ce que je reçois: 

enter image description here

Maintenant, au lieu de remplacer l’icône de flèche déroulante, j’ai même une deuxième icône, la case à cocher holo (qui fonctionne bien et est sélectionnée lorsque j’ai choisi un élément), mais comment puis-je obtenir uniquement celui que je veux?

manifest.xml

http://pastie.org/private/tu0izusbvvxe91lwmh9vnw

6

Vous devez supprimer la Imageview dans votre modèle personnalisé row_spinner.xml. Dans ce cas, vous n'avez pas besoin de créer une flèche dans votre mise en page personnalisée, car si vous le faites, elle sera créée dans chaque ligne comme vous l'avez fait. Pour faire la même chose que vous nous avez montré, vous devez changer le style Spinner en votre styles.xml.

Par exemple:

<resources>

    <style name="SpinnerTheme" parent="Android:Widget.Spinner">
        <item name="Android:background">@drawable/spinner_background_holo_light</item>
        <item name="Android:dropDownSelector">@drawable/list_selector_holo_light</item>
    </style>

    <style name="SpinnerTheme.DropDown">
        <item name="Android:spinnerMode">dropdown</item>
    </style>

    <!-- Changes the spinner drop down item radio button style -->
    <style name="DropDownItemSpinnerTheme" parent="Android:Widget.DropDownItem.Spinner">
        <item name="Android:checkMark">@drawable/btn_radio_holo_light</item>
    </style>

    <style name="ListViewSpinnerTheme" parent="Android:Widget.ListView">
        <item name="Android:listSelector">@drawable/list_selector_holo_light</item>
    </style>

    <style name="ListViewSpinnerTheme.White" parent="Android:Widget.ListView.White">
        <item name="Android:listSelector">@drawable/list_selector_holo_light</item>
    </style>

    <style name="SpinnerItemTheme" 
            parent="Android:TextAppearance.Widget.TextView.SpinnerItem">
        <item name="Android:textColor">#000000</item>
    </style>

</resources>

Pour plus d'informations, consultez: http://androidopentutorials.com/Android-how-to-get-holo-spinner-theme-in-Android-2-x/

MODIFIER

selector_spinner.xml:

<?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:endColor="#ffffff" Android:startColor="#ffffff" Android:type="linear" />

                    <stroke Android:width="1dp" Android:color="#504a4b" />

                    <corners Android:radius="5dp" />

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

            <item>

                <bitmap Android:gravity="bottom|right" Android:src="@Android:drawable/arrow_up_float" />

            </item>

        </layer-list>

    </item>

</selector>

styles.xml:

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Android:Theme.Holo.Light.DarkActionBar">
        <item name="Android:spinnerStyle">@style/SpinnerTheme</item>
    </style>

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

</resources>

À la fin, le spinner ressemblera à enter image description here

EDIT 2

Le code suivant est dans details_fragment_three.xml

<Spinner
    Android:id="@+id/spinnerDate"
    Android:layout_marginLeft="-8dp"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:background="@drawable/spinner_item_drawable"/> 
9
Lennon Petrick

Vous pouvez utiliser votre propre image déroulante. 

 

        <item>

            <layer-list>

                <item>
                    <color Android:color="@Android:color/white" />
                </item>

                <item>
                    <bitmap Android:gravity="center_vertical|right" Android:src="@drawable/down_arrow" /> // down_arrow replace your image
                </item>

            </layer-list>

        </item>

    </selector>
0
siddharth patel