I have created a custom view and I would like to set its content by binding. This is what I have:
<ContentView.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="30"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="30"/>
</Grid.ColumnDefinitions>
<ffimageloadingsvg:SvgCachedImage Source="resource://CTP.SVG.exit.svg"
Grid.Row="0" Grid.Column="1"
HeightRequest="30"
WidthRequest="30"
HorizontalOptions="Center"
VerticalOptions="Center">
</ffimageloadingsvg:SvgCachedImage>
<redefinitions:BindableView Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2"
Content="{Binding View, Source={x:Reference this}, Mode=OneWay}"/>
</Grid>
</ContentView.Content>
And following this tutorial I have defined my BindableView:
[ContentProperty(nameof(Content))]
public class BindableView : View
{
public static readonly BindableProperty ContentProperty =
BindableProperty.Create(
propertyName: nameof(Content),
returnType: typeof(View),
declaringType: typeof(BindableView),
defaultValue: default(View));
public View Content
{
get { return (View)GetValue(ContentProperty); }
set { SetValue(ContentProperty, value); }
}
}
But the BindableView is never showing, even if I define its Content statically.
What am I missing?
Easiest way to solve it is to use ContentView instead the custom BindableView.
Related
I am proceeding further and generating new ticket as it is quite different from this issue How to prevent Editor to go behind the keyboard in Xamarin.Forms?
I have chat page and autosize editor. When user type more than 1-2 lines, Editor expand correctly but it goes behind the keyboard.
However, if user add multiple lines using "return" it works correctly. I think I am missing something in Xaml page to play with Editor and StackLayout.
Please suggest
Please note that I don't use Xam.Plugins.Forms.KeyboardOverlap. To manage layout on keyboard visibility, I use custom stacklayout WrapperStackLayoutRenderer which set bottom padding on appear and disappear of keyboard.
Page Xaml
<ContentPage.Content>
<local1:WrapperStackLayout>
<Grid Margin="0" Padding="0" RowSpacing="0">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<ListView x:Name="MessagesListView"
ItemTemplate="{StaticResource MessageTemplateSelector}"
ItemsSource="{Binding Conversations}"
HasUnevenRows="True"
Margin="0"
Grid.Row="0"
SeparatorVisibility="None"/>
<Grid RowSpacing="1" ColumnSpacing="2" Padding="5" Grid.Row="1" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<local1:EditorWithAutoSize x:Name="txtMessage" Text="{Binding SendingText}" TextChanged="EnableSend"/>
<Frame x:Name="SendButton" Grid.Column="1" Margin= "0" Padding="0" HasShadow="false" HeightRequest="25"
BackgroundColor="Transparent" HorizontalOptions="FillAndExpand">
<Frame.GestureRecognizers>
<TapGestureRecognizer Tapped="SendMessage_Click" NumberOfTapsRequired="1" />
</Frame.GestureRecognizers>
<Label Text="Send" x:Name="sendButton" HeightRequest="20"
HorizontalOptions="Center" VerticalOptions="Center"/>
</Frame>
</Grid>
</Grid>
</local1:WrapperStackLayout>
</ContentPage.Content>
EditorWithAutoSize
public class EditorWithAutoSize : Editor
{
public EditorWithAutoSize()
{
this.TextChanged += (sender, e) => {
this.InvalidateMeasure();
};
}
}
WrapperStackLayout
public class WrapperStackLayout : StackLayout
{
}
WrapperStackLayoutRenderer
public class WrapperStackLayoutRenderer : VisualElementRenderer<StackLayout>
{
public WrapperStackLayoutRenderer()
{
UIKeyboard.Notifications.ObserveWillShow((sender, args) =>
{
if (Element != null)
{
Element.Margin = new Thickness(0, 0, 0, (args.FrameEnd.Height));
}
});
UIKeyboard.Notifications.ObserveWillHide((sender, args) =>
{
if (Element != null)
{
Element.Margin = new Thickness(0); //set the margins to zero when keyboard is dismissed
}
});
}
}
You have to add RowDefinition Height="auto" in your second Grid, then the editor will auto group with the text you entered:
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
The complete code should be:
<Grid RowSpacing="1" ColumnSpacing="2" Padding="5" Grid.Row="1" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<local:EditorWithAutoSize x:Name="txtMessage" Text="Binding SendingText" />
<Frame x:Name="SendButton" Grid.Column="1" Margin= "0" Padding="0" HasShadow="false" HeightRequest="25"
BackgroundColor="Transparent" HorizontalOptions="FillAndExpand">
<Label Text="Send" x:Name="sendButton" HeightRequest="20"
HorizontalOptions="Center" VerticalOptions="Center"/>
</Frame>
</Grid>
I uploaded my test sample here and you can check it: editor-xamarin.forms
BTW, there is a sample in github that you can refer: ChatUIXForms, you can use the editor and custom renderer code in his project. There are also blogs the author wrote you can read.
i have a nested List Object and i want to bind them to the list all my data is proper also i have implemented INotifyChanged Event but the data on the UI Is not displays
here is my Xaml UI
<ListView x:Name ="lstView" Margin="0,5,0,5" VerticalScrollBarVisibility="Always" HasUnevenRows="True" VerticalOptions="FillAndExpand" ItemsSource="{Binding Grouped}" IsGroupingEnabled="true" SelectionMode="None" SeparatorVisibility="None" GroupDisplayBinding="{Binding LongName}" GroupShortNameBinding="{Binding ShortName}">
<ListView.GroupHeaderTemplate>
<DataTemplate>
<Grid Margin="5,20,0,0" RowSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="5*"/>
<ColumnDefinition Width="95*"/>
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Source="radiochecked.png" VerticalOptions="End" />
<Frame Grid.Column="1" HasShadow="False" HorizontalOptions="Start" Padding="6,2,6,2" BackgroundColor="#608EF6">
<Label Text="{Binding LongName}" TextColor="White" VerticalTextAlignment="Center" ></Label>
</Frame>
</Grid>
</DataTemplate>
</ListView.GroupHeaderTemplate>
<ListView.ItemTemplate>
<DataTemplate>
<Grid Margin="5,0,10,0" HorizontalOptions="FillAndExpand" RowSpacing="0" VerticalOptions="FillAndExpand" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="5*"/>
<ColumnDefinition Width="95*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="10"/>
<RowDefinition Height="70"/>
</Grid.RowDefinitions>
<BoxView
Grid.Column="0" Grid.Row="0"
BackgroundColor="#566781"
HorizontalOptions="Center"
VerticalOptions="Fill"
WidthRequest="2" />
<Image Grid.Column="0" Grid.Row="1" Source="radiochecked.png" />
<BoxView
Grid.Column="0" Grid.Row="2"
BackgroundColor="#566781"
HorizontalOptions="Center"
VerticalOptions="Fill"
WidthRequest="2" />
<Frame Grid.Column="1" Grid.Row="0" HasShadow="False" Grid.RowSpan="3" Padding="0,0,2,0" Margin="0,10,0,5" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<StackLayout HorizontalOptions="FillAndExpand" Orientation="Horizontal" VerticalOptions="FillAndExpand">
<BoxView BackgroundColor="{Binding EncounterFrameColor}" WidthRequest="3"></BoxView>
<Grid Margin="0,8,0,0" HorizontalOptions="FillAndExpand" VerticalOptions="Start">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="10"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="30"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<StackLayout Spacing="0" Grid.Column="0">
<Label Text="{Binding EncounterMonth}" Margin="3,1,0,0" FontSize="10" TextColor="Black" VerticalOptions="Start" HorizontalOptions="Start"></Label>
<Label Text="{Binding MDate}" Margin="3,2,0,0" FontSize="15" TextColor="Black" FontAttributes="Bold" HorizontalTextAlignment="Center" VerticalOptions="Start" HorizontalOptions="Start"></Label>
</StackLayout>
<StackLayout Grid.Column="2" VerticalOptions="Start" Grid.Row="0" HorizontalOptions="FillAndExpand">
<Grid RowSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="15"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="15"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Image Source="{Binding EncounterImage}" Margin="0,2,0,0" VerticalOptions="Start" Grid.Row="0" Grid.Column="0"/>
<Label Text="{Binding Encounter}" TextColor="Black" FontSize="12" Grid.Row="0" VerticalOptions="Start" Grid.Column="1" ></Label>
<StackLayout Margin="0,0,0,5" Spacing="0" BindableLayout.ItemsSource="{Binding UserVitals}" Grid.Row="1" Grid.Column="1" >
<BindableLayout.ItemTemplate>
<DataTemplate>
<Grid RowSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="10"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Label Text="{Binding Description}" Grid.Column="0" FontSize="10" TextColor="Black" />
<Label Text="{Binding Values}" HorizontalOptions="Start" Grid.Column="2" FontSize="10" TextColor="Black"/>
</Grid>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
</Grid>
</StackLayout>
</Grid>
</StackLayout>
</Frame>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
i am trying to create Grouping Listview Which is grouping with the Year
here is my Model
public class EncounterFrameModel
{
public string EncounterMonth { get; set; }
public string MDate { get; set; }
public string Comment { get; set; }
// public bool IsReallyAVeggie { get; set; }
public string EncounterFrameColor { get; set; }
public string Image { get; set; }
public string Encounter { get; set; }
// public List<TotalItem> Totals { get;set; }
public string EncounterImage { get; set; }
public ObservableCollection<UserHealthDetails> UserVitals { get; set; }
public EncounterFrameModel()
{
}
}
public class UserHealthDetails
{
public string Description { get; set; }
public string Values { get; set; }
}
public class EncounteredYear
{
public EncounteredYear()
{
encounterFrameModels = new ObservableCollection<EncounterFrameModel>();
}
public string LongName { get; set; }
public string ShortName { get; set; }
public ObservableCollection<EncounterFrameModel> encounterFrameModels { get; set; }
}
can any one help me in binding this data
you could try this:
change your EncounteredYear model like this:
class EncounteredYear:ObservableCollection<EncounterFrameModel>
{
public string LongName { get; set; }
public string ShortName { get; set; }
}
in your page.xaml.cs set your data(Generate data according to your own situation):
ObservableCollection<EncounteredYear> grouped = new ObservableCollection<EncounteredYear>();
var gounp1 = new EncounteredYear() {...};
var gounp2 = new EncounteredYear() {...};
var gounp3 = new EncounteredYear() {...};
gounp1.Add(new EncounterFrameModel() {...});
gounp1.Add(new EncounterFrameModel() {...});
gounp1.Add(new EncounterFrameModel() {...});
gounp1.Add(new EncounterFrameModel() {...});
gounp2.Add(new EncounterFrameModel() {...});
gounp2.Add(new EncounterFrameModel() {...});
gounp2.Add(new EncounterFrameModel() {...});
gounp2.Add(new EncounterFrameModel() {...});
gounp3.Add(new EncounterFrameModel() {...});
gounp3.Add(new EncounterFrameModel() {...});
gounp3.Add(new EncounterFrameModel() {...});
gounp3.Add(new EncounterFrameModel() {...});
grouped.Add(gounp1);
grouped.Add(gounp2);
grouped.Add(gounp3);
lstView.ItemsSource = grouped;// bind the list of the grouplist
then you page's xaml as your before but delete ItemsSource="{Binding Grouped}" and must add <ViewCell> inside <DataTemplate>:
<ListView x:Name ="lstView" Margin="0,5,0,5" VerticalScrollBarVisibility="Always" HasUnevenRows="True" VerticalOptions="FillAndExpand" IsGroupingEnabled="true" SelectionMode="None" SeparatorVisibility="None" GroupDisplayBinding="{Binding LongName}" GroupShortNameBinding="{Binding ShortName}">
<ListView.GroupHeaderTemplate>
<DataTemplate>
<ViewCell>
...
</ViewCell>
</DataTemplate>
</ListView.GroupHeaderTemplate>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
...
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
I want to insert a syncfusion linearlayout listview, but for some reason it's not displaying any items/data, and I'm not getting any errors at the same time, I tried changing binding syntax and a couple things, but I cannot seem to get it right.
This is my xaml:
<syncfusion:SfListView x:Name="listView"
ItemTemplate="{Binding Source={local2:BandInfoRepository}, Path=BandInfo, Mode=TwoWay}"
ItemSize="100"
AbsoluteLayout.LayoutBounds="1,1,1,1"
AbsoluteLayout.LayoutFlags="All" >
<syncfusion:SfListView.ItemTemplate>
<DataTemplate>
<Grid RowSpacing="0" Padding="0,12,8,0" ColumnSpacing="0" Margin="0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="1" />
</Grid.RowDefinitions>
<Grid RowSpacing="0" Padding="8,0,8,10">
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Image Source="{Binding Path=BandImage}"
Grid.Column="0"
Grid.Row="0"
HeightRequest="80"
WidthRequest="70"
HorizontalOptions="Start"
VerticalOptions="Start"
/>
<StackLayout Orientation="Vertical"
Padding="5,-5,0,0"
VerticalOptions="Start"
Grid.Row="0"
Grid.Column="1">
<Label Text="{Binding Path=BandName}"
FontAttributes="Bold"
FontSize="16"
BackgroundColor="Green"
TextColor="#000000" />
<Label Text="{Binding Path=BandDescription}"
Opacity="0.54"
BackgroundColor="Olive"
TextColor="#000000"
FontSize="13" />
</StackLayout>
</Grid>
<BoxView Grid.Row="1"
HeightRequest="1"
Opacity="0.75"
BackgroundColor="#CECECE" />
</Grid>
</DataTemplate>
</syncfusion:SfListView.ItemTemplate>
</syncfusion:SfListView>
And this is the class where I'm getting the data from:
public class BandInfo : INotifyPropertyChanged
{
private string bandName;
private string bandDesc;
private ImageSource _bandImage;
public string BandName
{
get { return bandName; }
set
{
bandName = value;
OnPropertyChanged("BandName");
}
}
public string BandDescription
{
get { return bandDesc; }
set
{
bandDesc = value;
OnPropertyChanged("BandDescription");
}
}
public ImageSource BandImage
{
get { return _bandImage; }
set
{
_bandImage = value;
OnPropertyChanged("BandImage");
}
}
public event PropertyChangedEventHandler PropertyChanged;
public void OnPropertyChanged(string name)
{
if (this.PropertyChanged != null)
this.PropertyChanged(this, new PropertyChangedEventArgs(name));
}
}
And just in case, this is how I'm filling the collection (BandInfoRepository.cs):
public class BandInfoRepository
{
private ObservableCollection<BandInfo> bandInfo;
public ObservableCollection<BandInfo> BandInfo
{
get { return bandInfo; }
set { this.bandInfo = value; }
}
public BandInfoRepository()
{
GenerateBookInfo();
}
internal void GenerateBookInfo()
{
string[] BandNames = new string[] {
"Nirvana",
"Metallica",
"Frank Sinatra"
};
string[] BandDescriptions = new string[] {
"Description",
"Description",
"Description"
};
bandInfo = new ObservableCollection<BandInfo>();
for (int i = 0; i < BandNames.Count(); i++)
{
var band = new BandInfo()
{
BandName = BandNames[i],
BandDescription = BandDescriptions[i],
BandImage = ImageSource.FromResource("Lim.Images.Image" + i + ".png")
};
bandInfo.Add(band);
}
}
}
I hope you guys can help me out as I've been stuck with this for a while now. Thanks in advance.
Looks like you unintentionally bind ItemTemplate twice and not bind any
ItemsSource even once.
We have looked into your code snippet and we have found that you have binded the underlying collection to ItemTemplate property instead of ItemsSource property. Further to bind the underlying collection you have to set your ViewModel(i.e. BandInfoRepository) as BindingContext for ContentPage. Please refer the below code snippets to know how to set BindingContext for your page and also to bind the underlying collection into the ItemsSource property.
Code Example:[XAML]
<ContentPage>
<ContentPage.BindingContext>
<local:BandInfoRepository/>
</ContentPage.BindingContext>
<ContentPage.Content>
<listView:SfListView x:Name="listView" ItemSize="70" ItemsSource="{Binding BandInfo}" >
<listView:SfListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.View>
<Grid x:Name="grid" RowSpacing="1">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="1" />
</Grid.RowDefinitions>
<Grid RowSpacing="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Source="{Binding BandImage}"
VerticalOptions="Center"
HorizontalOptions="Center"
HeightRequest="50" Aspect="AspectFit"/>
<Grid Grid.Column="1"
RowSpacing="1"
Padding="10,0,0,0"
VerticalOptions="Center">
<Label Text="{Binding ContactName}"/>
</Grid>
</Grid>
<StackLayout Grid.Row="1" BackgroundColor="Gray" HeightRequest="1"/>
</Grid>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</listView:SfListView.ItemTemplate>
</listView:SfListView>
</ContentPage.Content>
</ContentPage>
For your assistance, we have attached the working sample link below.
Sample link: http://www.syncfusion.com/downloads/support/directtrac/186932/ze/ListViewSample905947849
I have a xaml :
<phone:LongListSelector Name="llsSourceNews" ItemsSource="{Binding SourceNews}">
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<Grid x:Name="gridNews">
<Grid.RowDefinitions>
<RowDefinition Height="80" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="120"/>
<ColumnDefinition Width="250"/>
<ColumnDefinition Width="40"/>
</Grid.ColumnDefinitions>
<Image Grid.Row="0" Grid.Column="0" Source="{Binding icon}" Stretch="Fill" Height="35" Width="70"></Image>
<TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding Name}" Foreground="White" TextWrapping="Wrap" FontSize="24" VerticalAlignment="Center"></TextBlock>
<Image Grid.Row="0" Grid.Column="2" Source="/Images/Add-New.png" x:Name="imgAdd" Tap="imgAdd_Tap"></Image>
</Grid>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>
and tap event :
private void imgAdd_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
if(true)
{
this.Visibility = Visibility.Collapsed;
}
}
My problem is : when user tap image,all image is disable.I want to image is disable which is selected.
this in your case refers to the page. If you want to retrieve the image, you have to cast the sender parameter:
private void imgAdd_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
if(true)
{
var element = (FrameworkElement)sender;
element.Visibility = Visibility.Collapsed;
}
}
I have an user control named GraphPanel. It has two dependency properties, one custom, PanelTitle, and the other inherited from the FrameworkElement, Content.
public static readonly DependencyProperty PanelTitleProperty = DependencyProperty.Register(
"PanelTitle",
typeof(string),
typeof(GraphPanel),
new PropertyMetadata("")
);
// ...
public string PanelTitle
{
set { SetValue(PanelTitleProperty, value); }
get { return (string)GetValue(PanelTitleProperty); }
}
The XAML code is as follows:
<UserControl
x:Class="PlaceringsGuiden.Library.Components.GraphPanel"
DataContext="{Binding RelativeSource={RelativeSource self}}">
<UserControl.Resources>
<ResourceDictionary Source="/App;component/Assets/Styles/GraphPanelStyles.xaml" />
</UserControl.Resources>
<Border Style="{StaticResource GraphPanelBorderStyle}">
<Grid Style="{StaticResource GraphPanelGridStyle}">
<Grid.ColumnDefinitions>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="1*" />
<RowDefinition Height="8*" />
</Grid.RowDefinitions>
<Grid Grid.Column="0" Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.02*" />
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="0.02*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="1"
Grid.Row="0"
Text="{Binding Path=PanelTitle}"
Style="{StaticResource GraphPanelHeaderStyle}" />
</Grid>
<Grid Grid.Column="0" Grid.Row="0" x:Name="GraphPanelContentPresenter">
<ContentPresenter Content="{Binding Path=Content}" />
</Grid>
</Grid>
</Border>
</UserControl>
Running this yields an exception:
Value does not fall within the expected range.
at MS.Internal.XcpImports.CheckHResult(UInt32 hr)
What am I doing wrong? What should I do to achieve this binding?
Thanks!
I resolved this issue by removing the binding from the ContentPresenter. That said, this solution is flawed as the custom control is not an element container.
By creating a new class extending ContentControl, styling with ControlTemplate, is this achieved without the need of complicated binding scenarios.
public class GraphPanel : ContentControl
{
#region Properties
public string PanelTitle
{
get { return (string) GetValue(PanelTitleProperty); }
set { SetValue(PanelTitleProperty, value); }
}
#endregion
#region Dependency properties
public static readonly DependencyProperty PanelTitleProperty =
DependencyProperty.Register("PanelTitle", typeof(string), typeof(GraphPanel), new PropertyMetadata(""));
#endregion
public GraphPanel()
: base()
{
DefaultStyleKey = typeof(GraphPanel);
}
}
and XAML code:
<Style TargetType="local:GraphPanel">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="local:GraphPanel">
<Border Style="{StaticResource GraphPanelBorderStyle}">
<Grid Style="{StaticResource GraphPanelGridStyle}">
<Grid.ColumnDefinitions>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="1*" />
<RowDefinition Height="8*" />
</Grid.RowDefinitions>
<Grid Grid.Column="0" Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.02*" />
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="0.02*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="1"
Grid.Row="0"
Text="{TemplateBinding PanelTitle}"
Style="{StaticResource GraphPanelHeaderStyle}" />
</Grid>
<Grid Grid.Column="0" Grid.Row="1">
<ContentPresenter />
</Grid>
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Sometimes it just helps writing it down, and you'd realise your own mistakes. Thanks for giving this a moment's thought though!