web-dev-qa-db-fra.com

Comment styliser la couleur du curseur de SearchView sous AppCompat

Mon SearchView est Android.support.v7.widget.SearchView et AppTheme est présenté ci-dessous.

<style name="AppBaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/primary</item>
    <item name="colorPrimaryDark">@color/primary_dark</item>
    <item name="colorAccent">@color/color_accent</item>
</style>

<style name="AppTheme" parent="AppBaseTheme">
</style>

La couleur de SearchView semble étrange, son curseur et sa ligne inférieure ont montré rapidement des blancs et des trans à la couleur d'accent, comment les gérer? Je veux que le curseur et la ligne du bas restent blancs.

androidappcompatandroid-styles
28
GhostFlying

Après beaucoup d’expérimentation, j’ai finalement pu changer la couleur du curseur en utilisant l’attribut autoCompleteTextViewStyle, ainsi qu’un curseur personnalisé Drawable. En modifiant le code que vous avez fourni dans l'exemple, vous feriez quelque chose comme ce qui suit. Tout d'abord, vous ajoutez l'attribut susmentionné à votre thème principal comme suit:

<style name="AppBaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/primary</item>
    <item name="colorPrimaryDark">@color/primary_dark</item>
    <item name="colorAccent">@color/color_accent</item>
    <item name="autoCompleteTextViewStyle">@style/cursorColor</item>
</style>

Vous créez ensuite le style pour "cursorColor" qui référencera le curseur Drawable que vous créerez (étape suivante):

<style name="cursorColor" parent="Widget.AppCompat.AutoCompleteTextView">
        <item name="Android:textCursorDrawable">@drawable/cursor</item>
</style>

La dernière chose à faire est de créer le curseur dessinable (cursor.xml) qui sera utilisé comme curseur de remplacement:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:shape="rectangle" >
    <solid Android:color="#FFFFFF" />
    <size Android:width="1dp" />
</shape>

Voici à quoi ressemble le curseur avant et après l'application du nouveau thème, respectivement ...

Avant

enter image description here

Après

enter image description here

Pour terminer, vous pouvez toujours modifier la largeur et la couleur du nouveau curseur en modifiant les champs appropriés dans votre Drawable:

<!-- Change this to increase the width -->
<size Android:width="1dp"/>
<!-- Change this to change the color -->
<solid Android:color="#FFFFFF" />
50
Willis

Si tout ce que vous voulez changer est la couleur du curseur/curseur du search-editText, vous pouvez utiliser ceci:

<style name="AppTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
    <item name="actionBarTheme">@style/AppTheme.ActionBarTheme</item>
.... 

<style name="AppTheme.ActionBarTheme" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="colorControlActivated">#FFffffff</item>
</style>
22
android developer

J'ai résolu ce problème très simplement en ajoutant un colorAccent spécifiquement à mon thème de barre d’outils, qui était différent de colorAccent sur le reste de mon application.

par exemple. Pour la base d'applications, j'ai une certaine couleur d'accentuation que je souhaite utiliser dans l'application:

<style name="AppBaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/primary</item>
    <item name="colorPrimaryDark">@color/primary_dark</item>
    <item name="colorAccent">@color/color_accent</item>
</style>

Et puis pour ma barre d’outils, qui contient le searchview, j’ai configuré un thème Android:

<Android.support.v7.widget.Toolbar
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:id="@+id/toolbar"
    Android:layout_width="match_parent"
    Android:layout_height="?attr/actionBarSize"
    Android:background="?attr/toolBarBackgroundColor"
    Android:theme="@style/ToolbarStyle"
    app:popupTheme="@style/ThemeOverlay.AppCompat" />

Dans ce thème de barre d’outils, j’utilise un autre accent de couleur pour colorer spécifiquement les éléments accentués (qui n’est que le curseur dans mon cas) dans la barre d’outils:

<style name="ToolbarStyle" parent="@style/ThemeOverlay.AppCompat.ActionBar">
    ...
    <item name="colorAccent">@color/cursorAccent</item>
</style>
19
tabjsina

Comment je l'ai résolu.

Mon code SearchView:

<Android.support.v7.widget.SearchView
                Android:id="@+id/searchView"
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                Android:theme="@style/SearchViewStyle"
                app:queryHint="@string/action_search"
                app:searchIcon="@drawable/ic_search" />

Et mon style WallSearchView est:

<style name="WallSearchView" parent="Widget.AppCompat.SearchView">
        ...
        <item name="iconifiedByDefault">false</item>
        <item name="colorControlActivated">#FFffffff</item>
    </style>

** remarque: sa seulement pour v21 et au-dessus.

3
Anand Kumar

Cette solution simple a fonctionné pour moi:

1 - Définir un style dans votre fichier Styles.xml

<style name="WhiteCursorSearchView" parent="Widget.AppCompat.SearchView">
    <item name="colorControlActivated">#FFFFFF</item>
</style>

2- Appliquer ce style à votre SearchView

<Android.support.v7.widget.SearchView
    Android:id="@+id/search"
    Android:theme="@style/WhiteCursorSearchView"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    app:iconifiedByDefault="false" />
1
Jacob Hatwell