如何在Xamarin.Forms中使用MVVM创建UserControl

Question

我试图在Xamarin.Forms中开发一个usercontrol，但是我无法使用ViewModel绑定该Usercontrol的控件。

我的CustomeEntryUserControl看起来像

    <?xml version="1.0" encoding="UTF-8"?>
<Grid xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="LearningApp.UserControls.CustomeEntry"
             xmlns:local="clr-namespace:LearningApp.Extension">

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="20" />
    </Grid.ColumnDefinitions>
    <Entry Grid.Column="0"  x:Name="entry" />
    <local:RoundedButton Grid.Column="1" Text="X" BackgroundColor="Gray" TextColor="White" HeightRequest="20" WidthRequest="10" VerticalOptions="Center" Margin="-30,0,30,0" x:Name="cancelbtn" />

</Grid>

该用户控件后面的代码如下所示

 public partial class CustomeEntry : Grid
{
    public CustomeEntry()
    {
        InitializeComponent();

    }

    public static readonly BindableProperty TextProperty = BindableProperty.Create(nameof(Text), typeof(string), typeof(CustomeEntry), default(string));

    public static readonly BindableProperty CommandProperty = BindableProperty.Create(nameof(Command), typeof(CustomeEntry), typeof(ICommand), default(ICommand));

    public ICommand Command
    {
        get { return (ICommand)GetValue(CommandProperty); }
        set { SetValue(CommandProperty, value); }
    }
    public string Text
    {
        get { return (string)GetValue(TextProperty); }
        set { SetValue(TextProperty, value); }
    }

    public string PlaceHolder
    {
        get { return entry.Placeholder; }
        set { entry.Placeholder = value; }
    }
}

我试图在我的内容页面之一中使用此控件，例如

    <?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="LearningApp.Views.TriggersDemo.DataTriggers"
             xmlns:local="clr-namespace:LearningApp.UserControls">
    <StackLayout Orientation="Vertical">
        <Label FontSize="Large" FontAttributes="Bold" Text="{Binding lblText}"></Label>
        <local:CustomeEntry   Text="{Binding Name}" Command="{Binding CancelCommand}" PlaceHolder="Enter Name"/>
        <Button Command="{Binding CheckCommand}" Text="Check" />

    </StackLayout>
</ContentPage>

上述内容页面后面的代码是

 namespace LearningApp.Views.TriggersDemo
{
    public partial class DataTriggers : ContentPage
    {
        public DataTriggers()
        {
            InitializeComponent();
            this.BindingContext = new TriggersViewModel();

        }

    }
}

和My ViewModel包含一个属性，例如

 private string _Name;

        public string Name
        {
            get { return _Name; }
            set { _Name = value; RaisePropertyChanged(); }
        }

谁能指导我如何将UserControl的输入Text直接绑定到我的ViewModel属性Name ？

Answer 1

在CustomerEntry ，没有控件显示要绑定的文本。

您还必须在自定义控件中设置所有绑定。

您还可以将处理程序传递给TextProperty的`propertyChanged'参数，并代表其他视图设置属性。

从自定义控件中删除属性，并直接绑定到将传递的BindingContext （包含viewmodel）。
然后在自定义控件的条目中设置Text="{Binding Text=.}" （与Button的Command相同），以使其绑定到BindingContext的文本，实际上，您可以从自定义控件中删除所有属性，并且直接绑定到ViewModel。