title: Xamarin.Forms UserControl using XAML and Custom Renderer
body: <p>There are a few good examples already of how to create a "custom control" by -</p>
  
  <ul>
  <li>Deriving a Class from View or an existing built-in control and then creating a custom renderer for it per platform.</li>
  <li><a href="http://blog.xamarin.com/using-custom-controls-in-xamarin.forms-on-android/" rel="noreferrer">http://blog.xamarin.com/using-custom-controls-in-xamarin.forms-on-android/</a></li>
  <li><a href="http://developer.xamarin.com/guides/cross-platform/xamarin-forms/custom-renderer/" rel="noreferrer">http://developer.xamarin.com/guides/cross-platform/xamarin-forms/custom-renderer/</a></li>
  </ul>
  
  <p>I want to create a "compound custom control OR <strong>usercontrol</strong>" which contains multiple elements which are defined in XAML (in the shared code), and then customised with a renderer (to say tweak the styling per platform).</p>
  
  <p>Does anyone have an example of doing this please? A simple example with a view that has a bindable label and an entry box should be enough to show the main principles.</p>
  
  <p>Here is what I have so far -</p>
  
  <p>Defined a ContentView to represent our usercontrols layout and contents.</p>
  
  <pre class="lang-xml prettyprint-override"><code>&lt;ContentView xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="News.Forms.VisualNewsContentView"&gt;
      &lt;ContentView.Content&gt;
          &lt;StackLayout&gt;
              &lt;Label x:Name="MyLabel" Text="Label"&gt;&lt;/Label&gt;
              &lt;Entry x:Name="MyEntry" Text="Entry"&gt;&lt;/Entry&gt;
          &lt;/StackLayout&gt;
      &lt;/ContentView.Content&gt;
  &lt;/ContentView&gt;
  </code></pre>
  
  <p>with codebehind -</p>
  
  <pre class="lang-cs prettyprint-override"><code>public partial class VisualNewsContentView : ContentView
  {
      public VisualNewsContentView ()
      {
          InitializeComponent ();
      }
  
      // Not sure if I need this to access Entry ...
      public Entry GetEntry ()
      {
          return MyEntry;
      }
  }
  </code></pre>
  
  <p>Add an Android Custom Renderer for that ContentView, how do I access and customise natively parts / controls of the ContentView?</p>
  
  <pre class="lang-cs prettyprint-override"><code>[assembly:ExportRenderer (typeof(VisualNewsContentView), typeof(VisualNewsRenderer))]
  
  namespace News.Forms.Android
  {
      public class VisualNewsRenderer: ViewRenderer
      {
          public VisualNewsRenderer () { }
  
          protected override void OnModelChanged (VisualElement oldModel, VisualElement newModel)
          {
              base.OnModelChanged (oldModel, newModel);
  
              if (newModel != null) {
                  VisualNewsContentView newsContentView = newModel as VisualNewsContentView;
  
                  // i.e. How could I get hold of EditText etc so I could natively customise its appearance? When you use a built in renderer like EntryRenderer you can use Control to access native control.
                  Console.WriteLine (newsContentView.GetLabel ().Text);
                  EditText ed = (EditText)newsContentView.GetEntry ().???
              }
          }
      }
  }
  </code></pre>
  
  <p>Just can't quite get the pieces together to work, the ContentView seems to render fine on page but cannot work out how to access its Child Native controls in the viewrenderer.</p>
  
  <p>Be nice to also show how you can use Binding for the Label and Entry Text values.</p>
  
  <p>I do not want to have to define a custom renderer for each single label / entry etc of the usercontrol.</p>