如何在 SearchBar Xamarin 表单上触发事件取消按钮答案

【问题标题】：How to Trigger event Cancel Button on SearchBar Xamarin Form如何在 SearchBar Xamarin 表单上触发事件取消按钮
【发布时间】：2021-09-11 03:01:42
【问题描述】：

Xamarin 表单视图模型可以触发搜索栏的 onTextChange 事件，但没有 OnCancelButtonClicked 的事件处理程序。

我想要什么：

点击取消/关闭按钮时应触发事件，如下所示。

【问题讨论】：

您要么需要编写自定义渲染器来执行此操作，要么使用 TextChanged 事件并检查空/空字符串
@Jason 它永远不会为空，是的，它会为空，但是当搜索框退格为空时也会发生这种情况。那是不同的情况。我们怎么做自定义渲染器呢？
或者将结果绑定到SearchText，有点像public List<string> ResultList => string.IsNullOrWhiteSpace(searchText) ? List1 : List2，不需要额外的事件。

标签： xamarin xamarin.forms xamarin.android xamarin.ios xamarin-studio

【解决方案1】：

您可以在 SearchBar 自定义渲染中获取 Searchbar CloseButton 事件，但我认为这对您的目标没有用。

我建议你可以点击搜索图标来刷新数据源。我用 Searchbar 和 ListView 做了一个示例，你可以看看：

[assembly: ExportRenderer(typeof(SearchBar), typeof(CustomSearchBarRenderer))]
namespace FormsSample.Droid
{
 public class CustomSearchBarRenderer: SearchBarRenderer
{
    public CustomSearchBarRenderer(Context context):base(context)
    {

    }
    protected override void OnElementChanged(ElementChangedEventArgs<SearchBar> e)
    {
        base.OnElementChanged(e);

        if (Control != null)
        {
            var searchView = Control;
            searchView.Iconified = true;
            searchView.SetIconifiedByDefault(false);
            int searchCloseButtonId = Context.Resources.GetIdentifier("android:id/search_close_btn", null, null);

           // search close button icon, you can add event for closeIcon.click.
            var closeIcon = searchView.FindViewById(searchCloseButtonId);

            int searchViewSearchButtonId = Control.Resources.GetIdentifier("android:id/search_mag_icon", null, null);
            var searchIcon = searchView.FindViewById(searchViewSearchButtonId);
            searchIcon.Click += SearchIcon_Click;
        }        
       
    }

    private void SearchIcon_Click(object sender, EventArgs e)
    {
        Element.OnSearchButtonPressed();
       
    }
  
}
 }



 <StackLayout>
        <SearchBar
            x:Name="searchBar"
            HorizontalOptions="Fill"
            Placeholder="Search fruits..."
            SearchButtonPressed="OnSearchButtonPressed"
            VerticalOptions="CenterAndExpand" />
        <Label
            HorizontalOptions="Fill"
            Text="Enter a search term and press enter or click the magnifying glass to perform a search."
            VerticalOptions="CenterAndExpand" />
        <ListView
            x:Name="searchResults"
            HorizontalOptions="Fill"
            VerticalOptions="CenterAndExpand" />
    </StackLayout>

 public partial class Page23 : ContentPage
{
    public Page23()
    {
        InitializeComponent();
        searchResults.ItemsSource = DataService.Fruits;
    }

    private void OnSearchButtonPressed(object sender, EventArgs e)
    {
        if(string.IsNullOrEmpty(searchBar.Text))
        {
            searchResults.ItemsSource = DataService.Fruits;
        }
        else
        {
            searchResults.ItemsSource = DataService.GetSearchResults(searchBar.Text);
        }
       
    }
}

您可以先点击搜索关闭按钮移动SearchBar中的文本，然后点击SearchButton刷新listView的数据。

【讨论】：