如何将占位符颜色属性添加到 xamarin 表单中的自动完成字段？

Posted 2023-04-13

【中文标题】如何将占位符颜色属性添加到 xamarin 表单中的自动完成字段？

【英文标题】：How to add placeholder color property to Autocomplete field in xamarin forms?

【发布时间】：2018-07-31 18:57:35

【问题描述】：

我想将占位符颜色属性添加到我的自动完成字段。我使用以下代码在我的表单中显示自动完成功能。我的 Xmal 代码如下，我使用了 xmlns:auto="clr-namespace:XLabs.Forms.Controls;assembly=XLabs.Forms"。 我无法将 placeholderColor 属性绑定到我的 xmal 页面。但 AutoCompleteViewModel 包含 placeholderColor 属性的定义。如何解决此问题。

<StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"  Margin="20,10,20,0"  BackgroundColor="#91BC47">     
    <auto:AutoCompleteView x:Name="Auto_Area" Text="Select Area"  TextColor="White" IsVisible="True" Placeholder="select Area" PlaceholderColor="Binding PlaceholderColor"
        HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"
        SearchCommand="Binding SearchCommand"
        SearchTextColor="Yellow" 
        SelectedCommand="Binding CellSelectedCommand"
        SelectedItem="Binding SelectedItem"
        ShowSearchButton="False"
        SuggestionBackgroundColor="#91BC47"
        Margin="5,0,0,0"
        SuggestionItemDataTemplate="StaticResource SugestionItemTemplate"
        Suggestions="Binding Items,
        Mode=TwoWay" />                  
</StackLayout>   


public class AutoCompleteViewModel : XLabs.Forms.Mvvm.ViewModel

    private ObservableCollection<AutoComplete> _items;
    private Command<string> _searchCommand;
    private Command<AutoComplete> _cellSelectedCommand;
    private AutoComplete _selectedItem;
    private Color _placeholderColor;

    public AutoCompleteViewModel()
    
        Items = new ObservableCollection<AutoComplete>();

        Items = App._areas1.OrderBy(p => p).Select(p => new AutoComplete
        
            Name = p,
            ID = 1
        ).ToObservableCollection();
    

    public static BindableProperty PlaceholderColorProperty
        = BindableProperty.Create(nameof(PlaceholderColor), typeof(Color), typeof(EditorControl), Color.White);

    public Color PlaceholderColor
    
        get
        
            return  _placeholderColor;
        
        set
        
            SetProperty(ref _placeholderColor, value);
        
    

    public ObservableCollection<AutoComplete> Items
    
        get
        
            return _items;
        
        set
        
            SetProperty(ref _items, value);
        
    

    public Command<AutoComplete> CellSelectedCommand
    
        get
        
            return _cellSelectedCommand ?? (_cellSelectedCommand = new Command<AutoComplete>(parameter => Debug.WriteLine(parameter.ID + parameter.Name)));
        
    

    public Command<string> SearchCommand
    
        get
        
            return _searchCommand ?? (_searchCommand = new Command<string>(
                obj =>  ,
                obj => !string.IsNullOrEmpty(obj.ToString())));
        
    

    public AutoComplete SelectedItem
    
        get
        
            return _selectedItem;
        
        set
        
            SetProperty(ref _selectedItem, value);
        
    

【问题讨论】：

可能是缺少命名空间。除此之外，BindableProperties 应该在视图中实现，例如页面或按钮。 ViewModel 是之后绑定到这些的那个

@Csharpest 32 你能分享代码或链接以在自动完成字段中设置占位符颜色属性吗？

将 BindableProperty 放入您的视图中，并在视图模型中创建一个属性：private Color _placeholderColor; public Color PlaceholderColor get => _placeholderColor; set => SetProperty(ref _placeholderColor, value); 然后在您视图的 xaml 中：PlaceholderColor = "Binding YourViewModel" 或在视图的代码隐藏中ctor:this.SetBinding(PlaceholderColorProperty, "Placeholder");“PlaceholderColor”代表viewmodel中属性的名称，就像你在xaml中做的那样

@Csharpest 32 我将 BindableProperty 放入 View.But 我没有在 xmal 或 c# 页面中获得 PlaceholderColor 属性

你没有按照我说的那样做。以下应该在自动完成视图中：public static BindableProperty PlaceholderColorProperty = BindableProperty.Create(nameof(PlaceholderColor), typeof(Color), typeof(AutoCompleteView), Color.White); 这很重要：（你没有那个）public Color PlaceholderColor get return (Color)GetValue(PlaceholderColorProperty); set SetValue(PlaceholderColorProperty, value);

【参考方案1】：

您的BindableProperty 需要添加到您的AutoCompleteView 而不是您的AutoCompleteViewModel

public class AutoCompleteView

    public static BindableProperty PlaceholderColorProperty = BindableProperty.Create(nameof(PlaceholderColor), typeof(Color), typeof(AutoCompleteView), Color.White);

    public Color PlaceholderColor
    
        get
        
            return (Color)GetValue(PlaceholderColorProperty);
        
        set
        
            SetValue(PlaceholderColorProperty, value);
        
    

然后它只需要绑定到 ViewModel 中的 PlaceholderColor。

public class AutoCompleteViewModel : XLabs.Forms.Mvvm.ViewModel

    private Color _placeholderColor = Color.White;

    public Color PlaceholderColor
    
        get
        
           return  _placeholderColor;
        
        set
        
            SetProperty(ref _placeholderColor, value);
        
    

【讨论】：

@Nick AutoCompleteView 类来自 XLabs.Forms.Controls。我不能编辑或添加任何东西。我只有 AutoCompleteViewModel 类，ViewModelLocator.cs 和 MainViewModel.cs 在我的项目中支持 AutoCompleteView。我添加了 BindableProperty

Xlabs 是 opensource，所以没有什么可以阻止您编辑它或将课程复制到您的项目中

或者您可以创建一个扩展 AutoCompleteView 的新控件并在那里完成