如何在 xamarin 表单中刷新选择器控件的 UI

Posted 2023-02-25

【中文标题】如何在 xamarin 表单中刷新选择器控件的 UI

【英文标题】：How to refresh UI of a picker control in xamarin forms

【发布时间】：2018-12-26 13:05:15

【问题描述】：

我有 3 个选择器控件，我正在尝试将一个列表绑定到所有 3 个选择器控件。如果在第一个选择器控件中选择了一个选项，则不应在其余 2 个选择器控件中重复相同的选项。我无法弄清楚如何实现它。

我尝试在 MainPage.cs 文件中使用 Security_Question_1_SelectedIndexChanged()，但 UI 没有更新。

MainPage.xaml：

 <Label x:Name="Security_Questions" Margin="0,20,0,0" Grid.Column="0" Grid.ColumnSpan="2" Grid.Row="0" Text="Security Questions" FontSize="Micro" TextColor="MediumVioletRed"></Label>
 <Picker x:Name="Security_Question_1" ItemsSource="Binding SecurityQuestions_List"  Title="Select question one" Grid.Column="0" Grid.Row="1" Margin="-4,0,0,0" FontSize="Micro">                                                                      
 </Picker>                                
 <Entry x:Name="Security_Answer_1" Placeholder="Type answer" Grid.Column="1" Grid.Row="1" FontSize="Micro"/>
 <Picker x:Name="Security_Question_2" ItemsSource="Binding SecurityQuestions_List" Title="Select question two" Grid.Column="0" Grid.Row="2" Margin="-4,0,0,0" FontSize="Micro">                                    
 </Picker>
 <Entry  x:Name="Security_Answer_2" Placeholder="Type answer" Grid.Column="1" Grid.Row="2" FontSize="Micro"/>
 <Picker x:Name="Security_Question_3" ItemsSource="Binding SecurityQuestions_List" SelectedIndexChanged="Security_Question_3_SelectedIndexChanged" Title="Select question three" Grid.Column="0" Grid.Row="3" Margin="-4,0,0,0" FontSize="Micro">                                    

MainPage.cs 文件：

  public MainPage()
    
        InitializeComponent();
        this.BindingContext = new RegistrationPageViewModel();
    

  private void Security_Question_1_SelectedIndexChanged(object sender, EventArgs e)
    
        try
        
            var t1 = ((Xamarin.Forms.Picker)sender).SelectedItem.ToString();
            if (t1 == "What is your first vehicle number?")
                                
                this.Security_Question_2.ItemsSource.Remove("What is your first vehicle number?");
                this.Security_Question_3.ItemsSource.Remove("What is your first vehicle number?");
            
            else if (t1 == "What is your child's nick name?")
            
                this.Security_Question_2.ItemsSource.Remove("What is your child's nick name?");
                this.Security_Question_3.ItemsSource.Remove("What is your first vehicle number?");
            
            else
            
                this.Security_Question_2.ItemsSource.Remove("What is your first school name?");
                this.Security_Question_3.ItemsSource.Remove("What is your first vehicle number?");
            
        
        catch (Exception)
        

            throw;
        
    

注册页面视图模型：

public RegistrationPageViewModel()
    
        _department = new List<string>()

    
        "What is your first vehicle number?",
        "What is your child's nick name?",
        "What is your first school name?"
    ;
    
    List<string> _department;

    public List<string> SecurityQuestions_List
    
        get  return _department; 
        private set
        
            _department = value;
            OnPropertyChanged();
        
    

感谢任何帮助。

【问题讨论】：

您想从其他选择器数据中删除它，还是想避免用户在每个选择器中选择重复值？

我想避免用户在每个选择器中选择重复值

如果你使用同一个ItemSource。如果你多次选择同一个picker会有一些问题。所以我建议你可以使用相同内容的不同ItemSource。

【参考方案1】：

您可以在使用数据绑定时将转换器用于 ItemSource 的其他 2 个条目，将条目中的 SelectedItem 作为转换器参数传递，在转换器内部，您可以删除作为参数传递的选定项目。

【参考方案2】：

“我想避免用户在每个选择器中选择重复值”。

您可以使用属性SelectedItemProperty 做某事，可能不是最好的方法，而是一种方法。

对于每个选择器，您将属性 SelectedItemProperty 绑定到 ViewModel 中的属性。当用户选择已在其他选择器中设置的值时，设置 null 此属性将完成这项工作。假设有两个选择器，您可以轻松地将其调整为三个选择器。

 <Picker x:Name="Security_Question_1" .... SelectedItemProperty="SelectedItemPicker1">                                    
 </Picker>
 <Picker x:Name="Security_Question_2" .... SelectedItemProperty="SelectedItemPicker2"> 
</Picker>

视图模型

 public string SelectedItemPicker1
            
                get => _selectedItemPicker1;
                set
                
                    if (_selectedItemPicker1== value) return;
                    if (value == _selectedItemPicker2)
                    
                        _selectedItemPicker2 = null;
                        OnPropertyChanged("SelectedItemPicker2");
                    
                    _selectedItemPicker1 = value;
                    OnPropertyChanged("SelectedItemPicker1");
                
            

            public string SelectedItemPicker2
            
                get => _selectedItemPicker2;
                set
                
                    if (_selectedItemPicker2 == value) return;
                    _selectedItemPicker2 = value == _selectedItemPicker1 ? null : value;
                    OnPropertyChanged("SelectedItemPicker2");
                
            

我不喜欢在二传手中有这样的逻辑，但正如我所说，应该有更好的方法。