Question

大家好日子。我目前正在做一个允许用户对客户进行CRUD记录并将其保存在数据库中的应用程序。所有创建的记录都显示在ListView上。

我想要做的是创建一个SearchBar，它允许我搜索ListView中的客户记录。在一个单独的程序中，我试图创建一个搜索栏，但我只能从预定义的ListView中搜索记录。

我需要做的搜索栏应该允许我搜索来自数据库的ListView。

希望你能帮助我。

以下是我的一些代码。如果你需要了解更多。请告诉我。非常感谢。

CustomerViewModel.cs

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Runtime.CompilerServices;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
using XamarinFormsDemo.Models;
using XamarinFormsDemo.Services;

    namespace XamarinFormsDemo.ViewModels
    {
    public class CustomerVM : INotifyPropertyChanged
    {

        private List<Customer> _customerList;


    public List<Customer> CustomerList
    {
        get { return _customerList; }
        set
        {
            _customerList = value;
            OnPropertyChanged();
        }
    }




    public CustomerVM()
    {
        InitializeDataAsync();
    }

    private async Task InitializeDataAsync()
    {
        var customerServices = new CustomerServices();

        CustomerList = await customerServices.GetCustomerAsync();
    }


    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        var handler = PropertyChanged;
        if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
        }


    }
}

CustomerPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         x:Class="XamarinFormsDemo.Views.ClientListPage"
         xmlns:ViewModels="clr-namespace:XamarinFormsDemo.ViewModels;assembly=XamarinFormsDemo"
         xmlns:controls="clr-namespace:ImageCircle.Forms.Plugin.Abstractions;assembly=ImageCircle.Forms.Plugin.Abstractions"
         BackgroundImage="bg3.jpg"
         Title="Client List">


  <ContentPage.BindingContext>
    <ViewModels:CustomerVM/>
  </ContentPage.BindingContext>


  <StackLayout Orientation="Vertical">



    <ListView x:Name="CustomerListView"
          ItemsSource="{Binding CustomerList}"
          HasUnevenRows="True">
      <ListView.ItemTemplate>
        <DataTemplate>
         <ViewCell>
            <Grid Padding="10" RowSpacing="10" ColumnSpacing="5">
              <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
              </Grid.RowDefinitions>
              <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="*"/>
              </Grid.ColumnDefinitions>

              <controls:CircleImage Source="icon.png"
                 HeightRequest="66"
                 HorizontalOptions="CenterAndExpand"
                 Aspect="AspectFill"
                 WidthRequest="66"
                 Grid.RowSpan="2"
               />


              <Label Grid.Column="1"
                 Text="{Binding CUSTOMER_NAME}"
                 TextColor="#24e97d"
                 FontSize="24"/>



          <Label Grid.Column="1"
                  Grid.Row="1"
                   Text="{Binding CUSTOMER_CODE}"
                   TextColor="White"
                   FontSize="18"
                   Opacity="0.6"/>


          <Label Grid.Column="1"
              Grid.Row="2"
              Text="{Binding CUSTOMER_CONTACT}"
               TextColor="White"
               FontSize="18"
               Opacity="0.6"/>



        </Grid>
      </ViewCell>
    </DataTemplate>
  </ListView.ItemTemplate>

</ListView>


<StackLayout Orientation="Vertical"
         Padding="30,10,30,10"
         HeightRequest="20"
         BackgroundColor="#24e97d"
         VerticalOptions="Center"
         Opacity="0.5">
  <Label Text="© Copyright 2016   SMESOFT.COM.PH   All Rights Reserved "
         HorizontalTextAlignment="Center"
         VerticalOptions="Center"
         HorizontalOptions="Center" />
    </StackLayout>
  </StackLayout>



</ContentPage>

Answer 1

SearchBar具有SearchCommand属性。将其绑定到您的ICommand视图模型上。还要在视图模型上将Text的{{1}}属性绑定到SearchBar属性。将所有记录保留在一些常见集合string中，并在UI上仅显示_allCustomers。在此命令的执行方法中，您可以添加：

ObservableCollection<Customer> Customers

Answer 2

这基本上是对Egor Gromadskiy答案的补充，但由于其他主题的评论很多，我在这里发布。

请记住，当在搜索栏中按下X按钮或取消按钮时，将不会触发搜索命令。因此，如果要显示此事件的所有结果，请从SearchText属性调用此命令（在这种情况下，SearchText设置为null，至少在iOS上，对于Android，请参考this forum）。

如果你想要一个按类型搜索并且不等到搜索按钮被点击，也可以这样做。

public string SearchText
{
  get { ... }
  set { 
        ... = value;
        SearchCommand.Execute();
      }
}

Xamarin.Forms：创建SearchBar并在ListView上搜索

2 个答案: