Xamarin表单选择器绑定

Question

我需要一些关于Xamarin Forms项目的帮助我想实现一个简单的选择器Xaml绑定到3个标签,当我从选择器中选择一个值时,标签将自动填充.(数据来自SQLite).这是我有的:

 <Picker x:Name="ListJobs" Title="Select Job"  ItemsSource="{Binding options}" ItemDisplayBinding="{Binding JobNo}" SelectedItem="{Binding SelectedJobs}"/>

 <Label Text="{Binding JobsId}" IsVisible="True" x:Name="TxtId"/>
 <Label Text="{Binding name}" IsVisible="True" x:Name="TxtName"/>
 <Label Text="{Binding location}" IsVisible="True" x:Name="TxtLoc"/>

模型

public class Jobs
{
public string JobsId {get;set;}
public string name {get;set;}
public string location {get;set;}

public Jobs(){}
}

代码背后:

protected override OnAppearing()
{
 jobsInfo = (List<Jobs>) GetJob();
foreach (var item in jobsInfo)
{
  Jobs options = new Jobs
{
  JobsId = item.JobsId,
  name = item.name,
  location = item.location
};
BindingContext = options;
}
}
 private IEnumerable<Jobs> GetJobsInfo()
        {
            var db = _connection.Table<Jobs>();
            return db.ToList();
        }

我会从选择器(如下拉列表)中选择并填充标签.你们能给出一些线索吗？在此先感谢您的支持

桑托斯

Answer 1

首先,您的代码中存在一些错误.

1.当您完成循环(从db获得的数据)时,选项总是使用新数据更新(因此它使用最后一个对象生成),并将其设置为BindingContext.您应该在此处设置modelView而不是模型.

2.Picker的itemSource必须是a list,但是你在这里设置了一个模型.

3.视图模型必须实现 INotifyPropertyChanged以通知更改.

我认为你最需要理解的不是这个Picker,而是如何使用绑定.

可绑定属性

数据绑定基础知识

从数据绑定到MVVM

好的,让我们回到这个案例.你需要的是这里

我简化了演示,你可以参考它.

• XAML

  <Picker x:Name="picker" 
          Title="Select Job" 
          ItemsSource="{Binding JobList}"
          ItemDisplayBinding="{Binding Name}"
          SelectedItem="{Binding SelectedJob}"/>
  
  <Label Text="{Binding SelectedJob.JobsId}" IsVisible="True" x:Name="TxtId" Margin="0,100,0,0"/>
  <Label Text="{Binding SelectedJob.Name}" IsVisible="True" x:Name="TxtName"/>
  <Label Text="{Binding SelectedJob.Location}" IsVisible="True" x:Name="TxtLoc"/>
  

• 模型和ViewModel:

  public class Jobs
  {
      public string JobsId { get; set; }
      public string Name { get; set; }
      public string Location { get; set; }
  }
  
  public class RootModel : INotifyPropertyChanged
  {
  
      List<Jobs> jobList;
      public List<Jobs> JobList
      {
          get { return jobList; }
          set
          {
              if (jobList != value)
              {
                  jobList = value;
                  OnPropertyChanged();
              }
          }
      }
  
      Jobs selectedJob;
      public Jobs SelectedJob
      {
          get { return selectedJob; }
          set
          {
              if (selectedJob != value)
              {
                  selectedJob = value;
                 OnPropertyChanged();
              }
          }
      }
  
  
      public event PropertyChangedEventHandler PropertyChanged;
  
      protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
      {
          PropertyChangedEventHandler handler = PropertyChanged;
          if (handler != null)
          {
              handler(this, new PropertyChangedEventArgs(propertyName));
          }
      }
  }
  

• 代码背后:

   public MainPage()
   {
        InitializeComponent();
  
        this.BindingContext = new RootModel
        {
            JobList = GetJobsInfo()
        };
   }
  
   private List<Jobs> GetJobsInfo()
   {
        var db = _connection.Table<Jobs>();
        return db.ToList();
   }
  

• 我的测试:

  

Answer 2

XAML：

<Picker x:Name="ListJobs" Title="Select Job" ItemsSource="{Binding AllJobs}"
        ItemDisplayBinding="{Binding Name}" SelectedItem="{Binding SelectedJob}"/>
<Label Text="{Binding SelectedJob.JobId}" IsVisible="True" x:Name="TxtId"/>
<Label Text="{Binding SelectedJob.Name}" IsVisible="True" x:Name="TxtName"/>
<Label Text="{Binding SelectedJob.Location}" IsVisible="True" x:Name="TxtLoc"/>

模型：

public class Job
{
    public string JobId { get; set; }
    public string Name { get; set; }
    public string Location {get; set; }
}

public class JobModel
{
    public List<Job> AllJobs { get; set; }
    public Job SelectedJob { get; set; }
}

背后代码：

protected override OnAppearing()
{
    BindingContext = new JobsModel {
        AllJobs = GetJobs()
    };
}

private List<Jobs> GetJobs()
{
    var db = _connection.Table<Jobs>();
    return db.ToList();
}