web-dev-qa-db-fra.com

Android spinner avec soulignement appcompat

J'utilise un thème appcompat pour mon application. Besoin de savoir comment je peux montrer le soulignement à Spinner. Il montre juste l'ancre. J'ai essayé de mettre en place soulignement avec Android: background mais cela fait disparaître l'ancre.

androidspinnerandroid-appcompatunderline
45
Pritam Kadam

Mettez à jour votre bibliothèque de support et dans l'utilisation de XML

S'il vous plaît ajouter ce style à votre spinner

    style="@style/Base.Widget.AppCompat.Spinner.Underlined"
125
Pritam Kadam

C’est un moyen peu commode (et pas parfait) de changer de couleur et de souligner la couleur dans le thème d’appcompat. Point principal que j'ai personnalisé Android prend en charge les images de bibliothèque et les fichiers xml pour changer de couleur.

1) allez sur support library package et copiez 2 images (ou téléchargez mon fichier personnalisé au bas de cet article)

/your-app/build/intermediates/exploded-aar/com.Android.support/appcompat-v7/23.1.0/res/drawable-hdpi/abc_spinner_mtrl_am_alpha.9.png

et

/your-app/build/intermediates/exploded-aar/com.Android.support/appcompat-v7/23.1.0/res/drawable-hdpi/abc_textfield_default_mtrl_alpha.9.png

2) Faites une copie de ces images

3) Changer la couleur de abc_spinner_mtrl_am_alpha.9.png (attention: laissez les bordures noires comme elles sont, c'est pour le patch 9)

4) Changez la couleur de la deuxième ligne du bas de abc_textfield_default_mtrl_alpha.9.png (vous pouvez le voir dans la petite image ci-jointe ci-dessous)

5) Enregistrez et déplacez les fichiers sur votre projet

6) Créez le fichier bottom_line_color.xml:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item Android:top="-6dp" Android:left="-6dp" Android:right="-6dp">
    <shape>
        <stroke Android:color="@color/brown" Android:width="6dp"/>
    </shape>
</item>

7) Créez spinner_bottom_line.xml

<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:Android="http://schemas.Android.com/apk/res/Android"
   Android:insetLeft="@dimen/abc_control_inset_material"
   Android:insetTop="@dimen/abc_control_inset_material"
   Android:insetBottom="@dimen/abc_control_inset_material"
   Android:insetRight="@dimen/abc_control_inset_material">
<selector>
<item Android:state_checked="false" Android:state_pressed="false">
    <layer-list>
        <item Android:drawable="@drawable/my_custom_abc_textfield_default_mtrl_alpha" />
        <item Android:drawable="@drawable/my_custom_abc_spinner_mtrl_am_alpha" />
    </layer-list>
</item>
<item>
    <layer-list>
        <item Android:drawable="@drawable/my_custom_abc_textfield_default_mtrl_alpha" />
        <item Android:drawable="@drawable/my_custom_abc_spinner_mtrl_am_alpha" />
    </layer-list>
</item>
</selector>
</inset>

P.S. Je ne pouvais pas obtenir le même style visuel que Spinner par défaut (modifications visuelles indiquées ci-dessous). Si vous commencez à utiliser ce thème spinner personnalisé, vous devez l’utiliser dans tous les projets.

Alors ajoutez à values ​​/ styles.xml

<style name="My.Spinner.Style" parent="Base.Widget.AppCompat.Spinner.Underlined">
    <item name="Android:background">@drawable/spinner_bottom_line</item>
</style>

Et utilisez-le dans une application comme celle-ci:

      <Spinner
            Android:id="@+id/account_spinner"
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            style="@style/My.Spinner.Style"
            />

Important: vous devez redimensionner le spinner et le placer dans différents dossiers. Vous pouvez trouver la taille dans le même chemin que j'ai montré ci-dessus. Il y a peu de tailles populaires:

drawables-mdpi   20x26

drawables-hdpi   29x38

drawables-xhdpi  38x50

drawables-xxhdpi 74x98

Vous pouvez prendre mes images personnalisées à partir d'ici:

my_custom_abc_spinner_mtrl_am_alpha:

my_custom_abc_spinner_mtrl_am_alpha

my_custom_abc_textfield_default_mtrl_alpha:

my_custom_abc_textfield_default_mtrl_alpha

L’exemple Spinner est (xxhdpi), la ligne est mdpi (car nous n’avons pas besoin de plusieurs lignes dans différents dossiers pouvant être dessinés, nous ne pouvons donc en avoir qu’une).

La différence visuelle (de Android la fenêtre d’aperçu studio xml) est affichée ici:

enter image description here

La première ligne correspond à mon spinner souligné personnalisé, la seconde à la base par défaut Base.Widget.AppCompat.Spinner.Underlined

7
Ragaisis

dans styles.xml

 <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="Android:spinnerStyle">@style/holoSpinner</item>
</style>

 <style name="holoSpinner" parent="Widget.AppCompat.Spinner.Underlined">
        <item name="Android:textSize">16sp</item>
        <item name="Android:textColor">@color/colorPrimary</item>
    </style>

=========================

en disposition

 <Android.support.design.widget.TextInputLayout
                        Android:layout_width="match_parent"
                        Android:layout_height="wrap_content"
                        Android:layout_marginTop="10dp">

                        <Spinner
                            Android:id="@+id/spinCountry"
                            Android:layout_width="match_parent"
                            Android:layout_height="wrap_content"
                            Android:background="@drawable/edit_text_bottom_border"
                            Android:paddingBottom="10dp" />
                    </Android.support.design.widget.TextInputLayout>

=============================================

fichier edit_text_bottom_border.xml dans Drawable

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
        <item
            Android:bottom="1dp"
            Android:left="-3dp"
            Android:right="-3dp"
            Android:top="-3dp">
            <shape Android:shape="rectangle">
                <stroke
                    Android:width="1dp"
                    Android:color="#535353" />
                <!--Android:color="#535353" />-->
            </shape>
        </item>
    </layer-list>
4
Keshav Gera

Appliquer style="@style/Base.Widget.AppCompat.Spinner.Underlined" n'a pas montré de différence. Puis a donné Android:backgroundTint et Android:backgroundTintMode à spinner et cela a fonctionné.

 <Spinner
     Android:id="@+id/spBookingType"
     Android:spinnerMode="dropdown"
     Android:layout_marginLeft="16dp"
     Android:layout_marginRight="16dp"
     Android:layout_width="match_parent"
     Android:layout_height="wrap_content"
     style="@style/Base.Widget.AppCompat.Spinner.Underlined"
     Android:backgroundTint="#ff000000"
     Android:backgroundTintMode="src_in" />
2
Annu