title: Binding custom control to parent datacontext property
body: <p>I have tried many of the solutions posed by similar questions but still cant seem to get this working.</p>
  
  <p>I have a custom TabControl called LayoutView (see below XAML)
  It uses a viewmodel called LayoutViewModel ( see below that {excluding converters}) </p>
  
  <p>By itself the designer displays fine (see below image)
  My problem is how to inject the correct DataContext into the custom control.
  I have tried adding a LayoutViewModel property master viewmodel and referencing that but all I get is a blank screen/control.</p>
  
  <p>I suspect it might be something to do with setting the DataContext in the Custom TabControl but if I remove it things go badly awry.</p>
  
  <p>Could someone please enlighten me as to the correct way to do this.</p>
  
  <p>Cheers
  Geoff</p>
  
  <p><em>Master Control</em></p>
  
  <pre><code>&lt;UserControl x:Class="Layout.Performances.Views.LT"
               xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
               xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
               xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
               xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
              xmlns:v="clr-namespace:Layout.Performances.Views"
              xmlns:vm="clr-namespace:Layout.Performances.ViewModels"
              mc:Ignorable="d"
              DataContext="{Binding RelativeSource={RelativeSource Mode=Self}}"
              d:DataContext="{d:DesignInstance IsDesignTimeCreatable=True, 
                      Type={x:Type vm:PerformanceGraphicViewModelDesignData}}"
               d:DesignHeight="491" d:DesignWidth="502"&gt;
      &lt;Grid&gt;
          &lt;!--&lt;v:LayoutView x:Name="Lv" ItemsSource="{Binding Layout}" /&gt;--&gt;
          &lt;!--&lt;v:LayoutView DataContext="DataContext.Lvm" /&gt;--&gt;
          &lt;v:LayoutView DataContext="{Binding ElementName=LT, Path=DataContext.Lvm}" /&gt;
      &lt;/Grid&gt;
  &lt;/UserControl&gt; 
  </code></pre>
  
  <p><em>Custom TabControl</em></p>
  
  <pre><code>&lt;TabControl x:Class="Layout.Performances.Views.LayoutView"
           xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
           xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
           xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
           xmlns:sys="clr-namespace:System;assembly=mscorlib"
           xmlns:pbs="clr-namespace:Layout;assembly=Layout"
           mc:Ignorable="d"
           xmlns:localcvt="clr-namespace:Layout.Performances.Views.Converters"
           xmlns:vm="clr-namespace:Layout.Performances.ViewModels"
           xmlns:muibehav="clr-namespace:Layout.MUI.Windows.Behaviors;assembly=Layout.MUI"
           DataContext="{Binding RelativeSource={RelativeSource Self}}"
           d:DataContext="{d:DesignInstance IsDesignTimeCreatable=True, Type={x:Type vm:LayoutViewModelDesignData}}"
           ItemsSource="{Binding Layout.PerformanceSections}"
           SelectedItem="{Binding SelectedSection, Mode=TwoWay}"
           ItemTemplate="{DynamicResource HeaderTemplate}"
           muibehav:TabContent.IsCached="True"
           Height="1000" Width="1000"
           &gt;
  
  &lt;TabControl.Resources&gt;
      &lt;ResourceDictionary&gt;
          &lt;ResourceDictionary.MergedDictionaries&gt;
              &lt;ResourceDictionary Source="/Layout.MUI;component/AssetsPB/ModernUI.xaml" /&gt;
          &lt;/ResourceDictionary.MergedDictionaries&gt;
          &lt;localcvt:SeatPositionConverter x:Key="SeatPositionConverter" /&gt;
          &lt;localcvt:AreaSizeConverter x:Key="AreaSizeConverter" /&gt;
          &lt;localcvt:ColorFromArgbConverter x:Key="ColorFromArgbConverter" /&gt;
          &lt;sys:Double x:Key="Buttonwidth"&gt;24&lt;/sys:Double&gt;
          &lt;sys:Double x:Key="Buttonpadding"&gt;2&lt;/sys:Double&gt;
  
          &lt;DataTemplate x:Key="HeaderTemplate"&gt;
              &lt;Grid&gt;
                  &lt;TextBlock TextWrapping="Wrap" Text="{Binding Description, Mode=OneWay}" /&gt;
              &lt;/Grid&gt;
          &lt;/DataTemplate&gt;
  
          &lt;ControlTemplate x:Key="TabItemControlTemplate" TargetType="{x:Type TabItem}"&gt;
              &lt;Grid SnapsToDevicePixels="True"&gt;
                  &lt;Border CornerRadius="12" x:Name="Bd" BorderBrush="Red" BorderThickness="1" Padding="{TemplateBinding Padding}"&gt;
                      &lt;ContentPresenter x:Name="Content" ContentTemplate="{TemplateBinding HeaderTemplate}" 
                                    Content="{TemplateBinding Header}" ContentStringFormat="{TemplateBinding HeaderStringFormat}" 
                                    ContentSource="Header" 
                                    HorizontalAlignment="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
                                    VerticalAlignment="{Binding VerticalContentAlignment, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type ItemsControl}}}"/&gt;
                  &lt;/Border&gt;
              &lt;/Grid&gt;
          &lt;/ControlTemplate&gt;
      &lt;/ResourceDictionary&gt;
  
  &lt;/TabControl.Resources&gt;
  
  &lt;!--Sections--&gt;
  &lt;muibehav:TabContent.Template&gt;
      &lt;!--Section--&gt;
      &lt;DataTemplate x:Name="SectionContentTemplate" DataType="{x:Type pbs:PerformanceSection}"&gt;
          &lt;Canvas&gt;
              &lt;Canvas.RenderTransform&gt;
                  &lt;ScaleTransform ScaleX="1" ScaleY="1"  &gt;&lt;/ScaleTransform&gt;
              &lt;/Canvas.RenderTransform&gt;
              &lt;!--Stage--&gt;
              &lt;Grid&gt;
                  &lt;Grid.Style&gt;
                      &lt;Style TargetType="Grid"&gt;
                          &lt;Setter Property="Canvas.Top" Value ="{Binding StageTopPos}"/&gt;
                          &lt;Setter Property="Canvas.Left" Value ="{Binding StageLeftPos}"/&gt;
                      &lt;/Style&gt;
                  &lt;/Grid.Style&gt;
                  &lt;Label BorderBrush="BlueViolet" BorderThickness="2"&gt;This is another the Stage&lt;/Label&gt;
              &lt;/Grid&gt;
              &lt;!--Areas--&gt;
              &lt;ItemsControl ItemsSource="{Binding PerformanceAreas}"&gt;
                  &lt;ItemsControl.ItemsPanel&gt;
                      &lt;ItemsPanelTemplate&gt;
                          &lt;Canvas&gt;
  
                          &lt;/Canvas&gt;
                      &lt;/ItemsPanelTemplate&gt;
                  &lt;/ItemsControl.ItemsPanel&gt;
                  &lt;ItemsControl.ItemContainerStyle&gt;
                      &lt;Style TargetType="ContentPresenter"&gt;
                          &lt;Setter Property="Canvas.Top" Value ="{Binding TopPos}"/&gt;
                          &lt;Setter Property="Canvas.Left" Value ="{Binding  LeftPos}"/&gt;
                      &lt;/Style&gt;
                  &lt;/ItemsControl.ItemContainerStyle&gt;
                  &lt;ItemsControl.ItemTemplate&gt;
                      &lt;!--Area--&gt;
                      &lt;DataTemplate DataType="{x:Type pbs:PerformanceArea}"&gt;
                          &lt;Canvas&gt;
                              &lt;Canvas.RenderTransform&gt;
                                  &lt;RotateTransform CenterX="0.5" CenterY="0.5" Angle="-10"&gt;&lt;/RotateTransform&gt;
                              &lt;/Canvas.RenderTransform&gt;
                              &lt;Border Padding="1,0" BorderBrush="LightGray" BorderThickness="1" CornerRadius="5,5,0,0" 
                                      Canvas.Left="{StaticResource Buttonpadding}"&gt;
                                  &lt;TextBlock Text="{Binding Description}" FontSize="10"/&gt;
                              &lt;/Border&gt;
                              &lt;Grid Margin="0" Canvas.Top="14"&gt;
                                  &lt;Grid.Height&gt;
                                      &lt;MultiBinding Converter="{StaticResource AreaSizeConverter}"&gt;
                                          &lt;Binding Path="Height" /&gt;
                                          &lt;Binding Path="Width" /&gt;
                                          &lt;Binding Path="Orientation" /&gt;
                                          &lt;Binding Source="{StaticResource Buttonwidth}" /&gt;
                                          &lt;Binding Source="{StaticResource Buttonpadding}" /&gt;
                                      &lt;/MultiBinding&gt;
                                  &lt;/Grid.Height&gt;
                                  &lt;Grid.Width&gt;
                                      &lt;MultiBinding Converter="{StaticResource AreaSizeConverter}"&gt;
                                          &lt;Binding Path="Width" /&gt;
                                          &lt;Binding Path="Height" /&gt;
                                          &lt;Binding Path="Orientation" /&gt;
                                          &lt;Binding Source="{StaticResource Buttonwidth}" /&gt;
                                          &lt;Binding Source="{StaticResource Buttonpadding}" /&gt;
                                      &lt;/MultiBinding&gt;
                                  &lt;/Grid.Width&gt;
                                  &lt;Border  BorderBrush="LightGray" BorderThickness="1" CornerRadius="2"&gt;
                                      &lt;!--Seats--&gt;
                                      &lt;ItemsControl ItemsSource="{Binding PerformanceSeats}" 
                                              HorizontalAlignment="Left" VerticalAlignment="Top" &gt;
                                          &lt;ItemsControl.ItemsPanel&gt;
                                              &lt;ItemsPanelTemplate&gt;
                                                  &lt;Canvas&gt;&lt;/Canvas&gt;
                                              &lt;/ItemsPanelTemplate&gt;
                                          &lt;/ItemsControl.ItemsPanel&gt;
                                          &lt;ItemsControl.ItemContainerStyle&gt;
                                              &lt;Style TargetType="ContentPresenter"&gt;
                                                  &lt;Setter Property="Canvas.Top" &gt;
                                                      &lt;Setter.Value&gt;
                                                          &lt;MultiBinding Converter="{StaticResource SeatPositionConverter}"&gt;
                                                              &lt;Binding Path="TopPos" /&gt;
                                                              &lt;Binding Source="{StaticResource Buttonwidth}" /&gt;
                                                              &lt;Binding Source="{StaticResource Buttonpadding}" /&gt;
                                                          &lt;/MultiBinding&gt;
                                                      &lt;/Setter.Value&gt;
                                                  &lt;/Setter&gt;
                                                  &lt;Setter Property="Canvas.Left" &gt;
                                                      &lt;Setter.Value&gt;
                                                          &lt;MultiBinding Converter="{StaticResource SeatPositionConverter}"&gt;
                                                              &lt;Binding Path="LeftPos" /&gt;
                                                              &lt;Binding Source="{StaticResource Buttonwidth}" /&gt;
                                                              &lt;Binding Source="{StaticResource Buttonpadding}" /&gt;
                                                          &lt;/MultiBinding&gt;
                                                      &lt;/Setter.Value&gt;
                                                  &lt;/Setter&gt;
                                              &lt;/Style&gt;
                                          &lt;/ItemsControl.ItemContainerStyle&gt;
                                          &lt;ItemsControl.ItemTemplate&gt;
                                              &lt;DataTemplate DataType="{x:Type pbs:PerformanceSeat}"&gt;
                                                  &lt;Button  HorizontalContentAlignment="Center"
                                                  VerticalContentAlignment="Center"
                                                  Width="{StaticResource Buttonwidth}"
                                                  Height="{StaticResource Buttonwidth}"
                                                  Padding="0"&gt;
                                                      &lt;Button.Style&gt;
                                                          &lt;Style TargetType="Button" &gt;
                                                              &lt;Setter Property="Background" &gt;
                                                                  &lt;Setter.Value&gt;
                                                                      &lt;MultiBinding Converter="{StaticResource ColorFromArgbConverter}"&gt;
                                                                          &lt;Binding Path="SeatStatus" /&gt;
                                                                          &lt;Binding RelativeSource="{RelativeSource FindAncestor, AncestorType={x:Type TabControl}}" Path="DataContext.StatusColors"/&gt;
                                                                          &lt;Binding Path="OperatorID" /&gt;
                                                                          &lt;Binding RelativeSource="{RelativeSource FindAncestor, AncestorType={x:Type TabControl}}"  Path="DataContext.CurrentOperator"/&gt;
                                                                      &lt;/MultiBinding&gt;
                                                                  &lt;/Setter.Value&gt;
                                                              &lt;/Setter&gt;
                                                              &lt;Setter Property="BorderBrush" &gt;
                                                                  &lt;Setter.Value&gt;
                                                                      &lt;MultiBinding Converter="{StaticResource ColorFromArgbConverter}"&gt;
                                                                          &lt;Binding Path="SeatType.ColorARGB" /&gt;
                                                                      &lt;/MultiBinding&gt;
                                                                  &lt;/Setter.Value&gt;
                                                              &lt;/Setter&gt;
                                                              &lt;Setter Property="BorderThickness" &gt;
                                                                  &lt;Setter.Value&gt;
                                                                      &lt;Binding RelativeSource="{RelativeSource FindAncestor, AncestorType={x:Type TabControl}}"  Path="DataContext.SeatTypeBorder" /&gt;
                                                                  &lt;/Setter.Value&gt;
                                                              &lt;/Setter&gt;
                                                          &lt;/Style&gt;
                                                      &lt;/Button.Style&gt;
                                                      &lt;TextBlock&gt;
                                                          &lt;TextBlock.RenderTransform&gt;
                                                              &lt;RotateTransform CenterX="0.5" CenterY="0.5" Angle="10"&gt;&lt;/RotateTransform&gt;
                                                          &lt;/TextBlock.RenderTransform&gt;
                                                          &lt;TextBlock.Text&gt;
                                                              &lt;MultiBinding StringFormat="{}{0}{1:F0}"&gt;
                                                                  &lt;Binding Path="RowID"/&gt;
                                                                  &lt;Binding Path="SeatID"/&gt;
                                                              &lt;/MultiBinding&gt;
                                                          &lt;/TextBlock.Text&gt;
                                                      &lt;/TextBlock&gt;
                                                  &lt;/Button&gt;
                                              &lt;/DataTemplate&gt;
                                          &lt;/ItemsControl.ItemTemplate&gt;
                                      &lt;/ItemsControl&gt;
                                  &lt;/Border&gt;
                              &lt;/Grid&gt;
                          &lt;/Canvas&gt;
  
  
                      &lt;/DataTemplate&gt;
                  &lt;/ItemsControl.ItemTemplate&gt;
              &lt;/ItemsControl&gt;
          &lt;/Canvas&gt;
      &lt;/DataTemplate&gt;
  
  &lt;/muibehav:TabContent.Template&gt;
  
  &lt;/TabControl&gt;
  </code></pre>
  
  <p><em>Its ViewModel</em></p>
  
  <pre><code>using System.Collections.Generic;
  using System.Data.Objects.DataClasses;
  using System.Linq;
  using Layout.ViewModels;
  
  namespace Layout.Performances.ViewModels
  {
      public class LayoutViewModel : ViewModelBase
      {
          public string CurrentOperator { get; set; }
          private Performance _layout;
          public Performance Layout { 
              get {
                      if (_layout == null) _layout = new Performance();
                      return _layout;
                  } 
              set { _layout = value; } 
          }
  
          private PerformanceSection _selectedSection;
  
          public PerformanceSection SelectedSection
          {
              get { return _selectedSection; }
              set
              {
                  _selectedSection = value;
                  RaisePropertyChanged("SelectedSection");
              }
          }
  
  
          private int _seatBoarder;
  
          public int SeatTypeBorder
          {
              get { return _seatBoarder; }
              set { _seatBoarder = value; }
          }
  
          private Dictionary&lt;string, int&gt; _statusColors;
  
          public Dictionary&lt;string,int&gt; StatusColors
          {
              get { return _statusColors; }
              set { _statusColors = value; }
          }
          public LayoutViewModel()
          {
          }
      }
      public class LayoutViewModelDesignData : LayoutViewModel
      {
  #if DEBUG
          private Dictionary&lt;string, int&gt; _typeCodes;
  
          public LayoutViewModelDesignData()
          {
              AddSections(Layout.PerformanceSections);
              SelectedSection = Layout.PerformanceSections.FirstOrDefault();
          }
  
          public void AddSections(EntityCollection&lt;PerformanceSection&gt; sections)
          {
  
              CurrentOperator = "PBS";
              StatusColors = new Dictionary&lt;string, int&gt;
              {
                  {"A",-8323200},
                  {"B",-32704},
                  {"H",-51401},
                  {"O",-13421773},
                  {"R",-6710887},
                  {"S",-14108161},
                  {"V",-2236963},
                  {"W",-6710887}
              };
  
              //_typeCodes = new Dictionary&lt;string, Int32&gt;
              //{
              //    {"AR",Convert.ToInt32(-16744193)},
              //    {"BA", Convert.ToInt32(4294902015)},
              //    {"BB", Convert.ToInt32(4278190335)},
              //    {"BC",Convert.ToInt32(4294934656)},
              //    {"D",Convert.ToInt32(-12582784)},
              //    {"PR",Convert.ToInt32(-8388544)},
              //    {"S",Convert.ToInt32(4294967295)}
              //};
  
              SeatTypeBorder = 2;
  
  
              var section1 = new PerformanceSection
              {
                  Description = "Section 1",
                  SectionID = "Section1",
                  GenAdmit = "N",
                  StageTopPos = 14,
                  StageLeftPos = 17,
                  PerformanceAreas = new EntityCollection&lt;PerformanceArea&gt;()
              };
  
              short r = 4;
              short c = 6;
              section1.PerformanceAreas.Add(new PerformanceArea
              {
                  PerformanceSection = section1,
                  SectionID = section1.SectionID,
                  AreaID = "Area1",
                  Description = "Area 1",
                  LeftPos = 10,
                  TopPos = 150,
                  Height = r,
                  Width = c,
                  FillDirection = "H", // "H", "L", "M"
                  Orientation = "H", // "H", "V"
                  PerformanceSeats = CreateSeats("Area1", r, c)
              });
  
              section1.PerformanceAreas.Add(new PerformanceArea
              {
                  PerformanceSection = section1,
                  SectionID = section1.SectionID,
                  AreaID = "Area2",
                  Description = "Area 2",
                  LeftPos = 600,
                  TopPos = 10,
                  Height = r,
                  Width = c,
                  FillDirection = "H", // "H", "L", "M"
                  Orientation = "H", // "H", "V"
                  PerformanceSeats = CreateSeats("Area2", r, c)
              });
  
              r = 10;
              c = 6;
              section1.PerformanceAreas.Add(new PerformanceArea
              {
                  PerformanceSection = section1,
                  SectionID = section1.SectionID,
                  AreaID = "Area3",
                  Description = "Area 3",
                  LeftPos = 10,
                  TopPos = 400,
                  Height = r,
                  Width = c,
                  FillDirection = "H", // "H", "L", "M"
                  Orientation = "H", // "H", "V", "N"
                  PerformanceSeats = CreateSeats("Area3", r, c)
              });
  
              r = 100;
              c = 12;
              section1.PerformanceAreas.Add(new PerformanceArea
              {
                  PerformanceSection = section1,
                  SectionID = section1.SectionID,
                  AreaID = "Area4",
                  Description = "Area 4",
                  LeftPos = 160,
                  TopPos = 50,
                  Height = r,
                  Width = c,
                  FillDirection = "H", // "H", "L", "M"
                  Orientation = "H", // "H", "V"
                  PerformanceSeats = CreateSeats("Area4", r, c)
              });
  
              var section2 = new PerformanceSection
              {
                  Description = "Section 2",
                  SectionID = "Section2",
                  GenAdmit = "N",
                  PerformanceAreas = new EntityCollection&lt;PerformanceArea&gt;()
              }; 
  
              section2.PerformanceAreas.Add(new PerformanceArea
              {
                  PerformanceSection = section2,
                  SectionID = section2.SectionID,
                  AreaID = "Area1",
                  Description = "Area 1",
                  LeftPos = 10,
                  TopPos = 10,
                  Height = 4,
                  Width = 6,
                  FillDirection = "H", // "H", "L", "M"
                  Orientation = "H", // "H", "V"
                  PerformanceSeats = CreateSeats("Area1", 4, 6)
              });
  
              section2.PerformanceAreas.Add(new PerformanceArea
              {
                  PerformanceSection = section2,
                  SectionID = section2.SectionID,
                  AreaID = "Area2",
                  Description = "Area 2",
                  LeftPos = 400,
                  TopPos = 10,
                  Height = 4,
                  Width = 6,
                  FillDirection = "H", // "H", "L", "M"
                  Orientation = "H", // "H", "V"
                  PerformanceSeats = CreateSeats("Area2", 4, 6)
              });
  
              section2.PerformanceAreas.Add(new PerformanceArea
              {
                  PerformanceSection = section2,
                  SectionID = section2.SectionID,
                  AreaID = "Area3",
                  Description = "Area 3",
                  LeftPos = 10,
                  TopPos = 700,
                  Height = 4,
                  Width = 6,
                  FillDirection = "H", // "H", "L", "M"
                  Orientation = "H", // "H", "V"
                  PerformanceSeats = CreateSeats("Area3", 4, 6)
              });
  
              sections.Add(section1);
              sections.Add(section2);
  
          }
  
          private static EntityCollection&lt;PerformanceSeat&gt; CreateSeats(string areaId, int rows, int columns)
          {
              const string rowIds = "ABCDEFGHIJKLNMOPQRSTUVWXYZ";
              const string statuses = "ABHORSVW";
              var seats = new EntityCollection&lt;PerformanceSeat&gt;();
              for (short row = 0; row &lt; rows; row++)
              {
                  var rowbaseidx = (int)(row/rowIds.Length);
                  var rowbase = rowbaseidx == 0 ? "" : rowIds.Substring(rowbaseidx - 1, 1);
                  var rowchar = rowIds.Substring((row % rowIds.Length), 1);
  
                  for (short col = 1; col &lt;= columns; col++)
                  {
                      seats.Add(new PerformanceSeat
                      {
                          AreaID = areaId,
                          RowID = rowbase + rowchar,
                          SeatID = col,
                          SeatType = new SeatType { ColorARGB = (col % 2) == 0 ? -16744193 : -65281 },
                          SeatStatus = statuses.Substring(row % statuses.Length, 1),
                          OperatorID = (col % 2) == 0 ? "PBS" : null,
                          TopPos = (short)(row + 1),
                          LeftPos = col
                      });
                  }
  
              }
              return seats;
          }
  #endif
      }
  }
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/AedIl.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/AedIl.jpg" alt="enter image description here"></a></p>