Xamarin 表单选择器绑定 [英] Xamarin Forms Picker Binding

问题描述

我想实现一个简单的选择器 XAML 绑定到 3 个标签，当我从选择器中选择一个值时，标签将自动填充(数据来自 SQLite).这是我所拥有的:

 <Label Text="{Binding JobsId}";IsVisible=真"x:Name=TxtId"/><Label Text="{绑定名称}";IsVisible=真"x:Name=TxtName"/><Label Text="{绑定位置}";IsVisible=真"x:Name=TxtLoc"/>

型号

公开课工作{公共字符串 JobsId {get;set;}公共字符串名称 {get;set;}公共字符串位置 {get;set;}公共作业(){}}

背后的代码:

protected override OnAppearing(){jobsInfo = (List) GetJob();foreach(jobsInfo 中的 var 项目){工作选项 = 新工作{JobsId = item.JobsId,名称 = 项目名称，位置 = 项目.位置};BindingContext = 选项；}}私有 IEnumerable获取工作信息(){var db = _connection.Table();返回 db.ToList();}

我想从选择器(如下拉菜单)中进行选择并填充标签.

解决方案

首先，你的代码有一些错误.

1.当你通过循环(你从db获得的数据)时，选项总是用新数据更新(所以它使用最后一个对象生成)，并将其设置为BindingContext.你应该在这里设置一个模型视图而不是模型.

2.Picker的itemSource必须是一个list，不过你在这里设置了一个model.

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

我觉得你最需要了解的不是这个 Picker ，而是 How to work with binding.

I'd like to implement a simple picker XAML binded to 3 labels, where when I choose a value from the picker the labels will be populated automatically (the data comes from SQLite). Here is what I have:

 <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"/>

Model

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

public Jobs(){}
}

Code Behind:

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();
        }

I would to select from picker (like dropdown) and populate the labels.

解决方案

First, there are some mistakes in your code.

1.When you go through the loop (the data you gained from db), options is always updated with new data(so it generates using last object), and you set it to BindingContext. You should set a modelView here rather a model.

2.The itemSource of Picker must be a list, however you set a model here.

3.The viewmodel must implement INotifyPropertyChanged to notify the changes.

I think what you need understanding most is not this Picker , it is How to work with binding.

Bindable Properties

Data Binding Basics

From Data Bindings to MVVM

Okay, let us come back to this case. What you need is here

I simplified the demo and you can refer to it.

• 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"/>
  

• Model and 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));
          }
      }
  }
  

• Code behind:

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

• My Test:

这篇关于Xamarin 表单选择器绑定的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！