2017-05-04 68 views
0

我试图在Xamarin.Forms中开发一个用户控件,但我无法使用ViewModel绑定该用户控件的控件。如何在Xamarin.Forms中使用MVVM创建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(); 

     } 

    } 
} 

和我的视图模型包含一个属性像

private string _Name; 

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

任何人都可以请指导我怎么能用户控件的输入Text绑定到我的ViewModel财产Name直接?

回答

1

在你CustomerEntry没有控制显示你绑定的文本。

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

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

从自定义控件中删除属性,并直接绑定到要传递的BindingContext(包含您的viewmodel)。
然后在您的自定义控件条目中设置Text="{Binding Text=.}"(与ButtonCommand相同),以使其绑定到来自BindingContext的文本,事实上,您可以从自定义控件中删除所有属性,并直接绑定到ViewModel。

+0

是的,但我怎么能绑定从我的ContentPage用户控件条目,我已经使用usercontrol –

+1

@DhavalPatel更新。 – Shimmy

+1

谢谢你,我已经改变了它的工作 –

相关问题