Xaml 表单：创建搜索栏并在ListView上搜索

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

我想做的是创建一个搜索栏，允许我搜索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));
        }


    }
}

使用系统；
使用System.Collections.Generic；
使用系统组件模型；
使用System.Linq；
使用System.Runtime.CompilerServices；
使用系统文本；
使用System.Threading.Tasks；
使用Xamarin.Forms；
使用XamarinFormsDemo.Models；
使用XamarinFormsDemo.Services；
命名空间XamarinFormsDemo.ViewModels
{
公共类CustomerVM:INotifyPropertyChanged
{
私人名单(customerList);；
公共列表客户列表
{
获取{return\u customerList；}
设置
{
_客户列表=价值；
OnPropertyChanged（）；
}
}
公共客户服务
{
InitializeDataAsync（）；
}
专用异步任务InitializeDataAsync（）
{
var customerServices=新customerServices（）；
CustomerList=等待customerServices.getCustomerSync（）；
}
公共事件属性更改事件处理程序属性更改；
受保护的虚拟void OnPropertyChanged（[CallerMemberName]字符串propertyName=null）
{
var handler=PropertyChanged；
if（handler！=null）handler（这是新的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>

---

SearchBar

具有

SearchCommand

属性。将其绑定到视图模型上的某些

ICommand

。还将

SearchBar

的

Text

属性绑定到视图模型上的

string

属性。将所有记录保存在某个公共集合

\u allCustomers

中，并在UI上仅显示

可观察的集合客户

。在该命令的执行方法中，您可以添加：

private void SearchCommandExecute()
{
    var tempRecords = _allCustomers.Where(c=>c.FullName.Contains(Text));
    Customers = new ObservableCollection<Customer>(tempRecords);
}

private void SearchCommandExecute（）
{
var tempRecords=_allCustomers.Where（c=>c.FullName.Contains（Text））；
客户=新的可观察收集（临时记录）；
}

SearchBar

具有

SearchCommand

属性。将其绑定到视图模型上的某些

ICommand

。还将

SearchBar

的

Text

属性绑定到视图模型上的

string

属性。将所有记录保存在某个公共集合

\u allCustomers

中，并在UI上仅显示

可观察的集合客户

。在该命令的执行方法中，您可以添加：

private void SearchCommandExecute()
{
    var tempRecords = _allCustomers.Where(c=>c.FullName.Contains(Text));
    Customers = new ObservableCollection<Customer>(tempRecords);
}

private void SearchCommandExecute（）
{
var tempRecords=_allCustomers.Where（c=>c.FullName.Contains（Text））；
客户=新的可观察收集（临时记录）；
}

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

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

如果您想在键入时进行搜索，而不必等到按下搜索按钮，也可以这样做

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

---

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

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

如果您想在键入时进行搜索，而不必等到按下搜索按钮，也可以这样做

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

---

尝试使用

可观察收集

而不是

列表

@EgorGromadskiy我应该把它放在哪里？它能解决我的问题吗，先生？

公共列表客户列表

到

公共可观察收集客户列表

。我也看不到搜索栏和搜索逻辑。@EgorGromadskiy它并没有解决我的问题，先生。因为我的重点实际上是如何从ListView中搜索记录。来自数据库且不是预定义的记录。请尝试使用

ObservableCollection

而不是

List

@EgorGromadskiy我应该把它放在哪里？它能解决我的问题吗，先生？

公共列表客户列表

到

公共可观察收集客户列表

。我也看不到搜索栏和搜索逻辑。@EgorGromadskiy它并没有解决我的问题，先生。因为我的重点实际上是如何从ListView中搜索记录。来自数据库且未预定义的记录。如何将搜索栏的文本属性绑定到viewmodel中的字符串？

我在XAML中有以下代码：我做的对吗？如何在SearchCommand中使用ICommand代码？我不使用可观察的集合，因为它运行不正常。这是我在viewmodel中的当前代码：您应该将

搜索栏的
文本
绑定到视图模型编号上的
字符串
属性