title: How to Create a UserControl using MVVM in Xamarin.Forms
body: <p>I have tried to develop a usercontrol in Xamarin.Forms but I am not able to bind the controls of that Usercontrol using ViewModel.</p>
  
  <p>My CustomeEntryUserControl is look like </p>
  
  <pre><code>    &lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;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"&gt;
  
      &lt;Grid.ColumnDefinitions&gt;
          &lt;ColumnDefinition Width="*" /&gt;
          &lt;ColumnDefinition Width="20" /&gt;
      &lt;/Grid.ColumnDefinitions&gt;
      &lt;Entry Grid.Column="0"  x:Name="entry" /&gt;
      &lt;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" /&gt;
  
  &lt;/Grid&gt;
  </code></pre>
  
  <p>Code behind of this usercontrol is look like </p>
  
  <pre><code> 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; }
      }
  }
  </code></pre>
  
  <p>I have tried to use this control in one of my content page is like </p>
  
  <pre><code>    &lt;?xml version="1.0" encoding="utf-8" ?&gt;
  &lt;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"&gt;
      &lt;StackLayout Orientation="Vertical"&gt;
          &lt;Label FontSize="Large" FontAttributes="Bold" Text="{Binding lblText}"&gt;&lt;/Label&gt;
          &lt;local:CustomeEntry   Text="{Binding Name}" Command="{Binding CancelCommand}" PlaceHolder="Enter Name"/&gt;
          &lt;Button Command="{Binding CheckCommand}" Text="Check" /&gt;
  
      &lt;/StackLayout&gt;
  &lt;/ContentPage&gt;
  </code></pre>
  
  <p>code behind of above mentioned content page is </p>
  
  <pre><code> namespace LearningApp.Views.TriggersDemo
  {
      public partial class DataTriggers : ContentPage
      {
          public DataTriggers()
          {
              InitializeComponent();
              this.BindingContext = new TriggersViewModel();
  
          }
  
      }
  }
  </code></pre>
  
  <p>and My ViewModel contain the one Property like </p>
  
  <pre><code> private string _Name;
  
          public string Name
          {
              get { return _Name; }
              set { _Name = value; RaisePropertyChanged(); }
          }
  </code></pre>
  
  <p>Can anyone please guide how I can bind the Entry <code>Text</code> of UserControl to my ViewModel property <code>Name</code> direct?</p>