SearchView-Widget n'affiche pas le caret et souligne dans Xamarin.Forms (Android)

Question

J'essaie de mettre une barre de recherche dans la navigation d'une page de contenu sur Xamarin.Forms (Android). J'utilise le code suivant (de https://www.linkedin.com/pulse/xamarin-forms-contentpage-searchbar-navigation-bar-vipin-mathews):

Tout d'abord je définir ma ressource searchbar:

<?xml version="1.0" encoding="utf-8" ?> 
<menu xmlns:android="http://schemas.android.com/apk/res/android" 
     xmlns:app="http://schemas.android.com/apk/res-auto"> 
    <item android:id="@+id/action_search" 
     android:title="Search" 
     android:icon="@android:drawable/ic_menu_search" 
     app:showAsAction="always|collapseActionView" 
     app:actionViewClass="android.support.v7.widget.SearchView"/> 
</menu> 

Puis-je utiliser un moteur de rendu personnalisé pour l'afficher dans la barre de navigation en-tête d'un ContentPage:

[assembly: ExportRenderer(typeof(SearchPage), typeof(SearchPageRenderer))] 

namespace Muellerchur.Xamos.Streckenkontrolle.Droid.CustomRenderer 
{ 
    using Android.Runtime; 
    using Android.Support.V7.Widget; 
    using Android.Text; 
    using Android.Views.InputMethods; 

    using Muellerchur.Xamos.Streckenkontrolle.Droid; 

    using Plugin.CurrentActivity; 

    using Xamarin.Forms; 
    using Xamarin.Forms.Platform.Android; 

    using Resource = Muellerchur.Xamos.Streckenkontrolle.Droid.Resource; 

    /// <summary> 
    ///  The search page renderer. 
    /// </summary> 
    public class SearchPageRenderer : PageRenderer 
    { 
     /// <summary> 
     ///  Gets or sets the search view. 
     /// </summary> 
     private SearchView searchView; 

     /// <summary> 
     ///  Gets or sets the toolbar. 
     /// </summary> 
     private Toolbar toolbar; 

     /// <summary> 
     ///  Reaction on the disposing of the page. 
     /// </summary> 
     /// <param name="disposing">A value indicating whether disposing.</param> 


     /// <summary> 
     ///  Reaction on the element changed event. 
     /// </summary> 
     /// <param name="e">The event argument.</param> 
     protected override void OnElementChanged(ElementChangedEventArgs<Page> e) 
     { 
      base.OnElementChanged(e); 

      if (e?.NewElement == null || e.OldElement != null) 
      { 
       return; 
      } 

      this.AddSearchToToolBar(); 
     } 

     /// <summary> 
     ///  Adds a search item to the toolbar. 
     /// </summary> 
     private void AddSearchToToolBar() 
     { 
      this.toolbar = (CrossCurrentActivity.Current?.Activity as MainActivity)?.FindViewById<Toolbar>(Resource.Id.toolbar); 

      if (this.toolbar != null) 
      { 
       this.toolbar.Title = this.Element.Title; 
       this.toolbar.InflateMenu(Resource.Menu.mainmenu); 

       this.searchView = this.toolbar.Menu?.FindItem(Resource.Id.action_search)?.ActionView?.JavaCast<SearchView>(); 

       if (this.searchView != null) 
       { 
        this.searchView.ImeOptions = (int)ImeAction.Search; 
        this.searchView.InputType = (int)InputTypes.TextVariationNormal; 
        this.searchView.MaxWidth = int.MaxValue; 
       } 
      } 
     } 

    } 
} 

Toutefois, si l'utilisateur entre le SearchView ne caret et aucun soulignement apparaît:

Je veux afficher quelque chose comme ça (sans icônes)

Comment puis-je archieve cette mise en page? Ou est-ce dépendant du téléphone? J'utilise un HUAWEI P9 Android-Phone.

Answer 1

SearchView-Widget n'affiche pas caret et souligné dans Xamarin.Forms (Android)

Je reproduis votre problème et je pense que ce n'est pas phone-dependant. Des problèmes sont survenus dans votre méthode AddSearchToToolBar.

1. Afficher caret:

Supprimer le this.searchView.InputType = (int)InputTypes.TextVariationNormal, le caret affiche normalement.

2. Affichage underline:

Merci pour advice de Vardø, vous pouvez définir un arrière-plan qui contient un soulignement pour SearchView. Pour créer un sélecteur drawable, afin que l'image correcte soit affichée en fonction de l'état d'affichage, une pour l'état lorsque le champ de texte est sélectionné (nommé textfield_search_selected_holo_light.9.png) et l'autre pour l'emplacement non défini (nommé textfield_search_default_holo_light.9.png).

Créer un fichier res/drawable/texfield_searchview_holo_light.xml avec le contenu suivant:

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:state_focused="true" android:drawable="@drawable/textfield_search_selected_holo_light" /> 
    <item android:drawable="@drawable/textfield_search_default_holo_light" /> 
</selector> 

Set Drawable sélecteur pour SearchView:

this.searchView.SetBackgroundResource(Resource.Drawable.texfield_searchview_holo_light); 

effet comme ceci: