XAML CHEAT SHEET

DATABINDING

PEER CONTROL’S PROPERTIES

<Slider Name="myName" />
<TextBox Text="{Binding ElementName=myName, Path=Value}" />
<!-- SAME AS -->
<TextBox Text="{Binding Value, ElementName=myName}" />
<!-- EXAMPLE: -->
<TextBlock Text="{Binding SelectedItem.Header, ElementName=treeView}" />

BINDING MODES
<TextBox Text="{Binding Path=Text, ElementName=txtUsername Mode=TwoWay,
UpdateSourceTrigger=LostFocus}" />
Mode=OneTime
Mode=OneWay
Mode=OneWayToSource
Mode=TwoWay

CLR OBJECTS

PROPERTIES
<!-- Binding to Local Properties -->
<ComboBox ItemsSource="{Binding Path=ClientsList, ElementName=myClass, Mode=Default}" />

<TextBlock Text="{Binding Source={StaticResource CurrentPerson}, ElementName=myClass,

Path=Age}" />

NATIVE OBJECTS
<!-- Namespace Declaration for System namespace -->
xmlns:clr="clr-namespace:System;assembly=mscorlib"
<!-- Regular CLR Object Instantiation -->
<clr:Decimal x:Key="Current">352</clr:Decimal>
<!-- Complex Classes Instantiation -->
<src:Client x:Key="CurrentClient" ClientID="32" Active="True" />
<!-- Binding to CLR Objects -->
<TextBlock Text="{Binding Source={x:Static clr:DateTime.Now}}" />

METHODS
<ObjectDataProvider x:Key="InitializedData" ObjectType="{x:Type src:Person}"
MethodName="GetUserByID">
<ObjectDataProvider.ConstructorParameters>
<clr:Int32>152</clr:Int32>
</ObjectDataProvider.ConstructorParameters>
</ObjectDataProvider>

CONVERTERS
<!-- Converters must impliment IValueConverter -->
<BooleanToVisibilityConverter x:Key="VisConverter" />

<CheckBox Name="chkVisible" Content="Show Text" IsChecked="True" />

<TextBlock Text="Hidden Text" Visibility="{Binding IsChecked, ElementName=chkVisible,
ConvertParameter=n, Converter={StaticResurce VisConverter}}" />

Need some space down here

DATA TEMPLATE
<!-- Data Template -->
<DataTemplate DataType="{x:Type src:Client}">
<TextBlock Text="{Binding CleintName}" />
</DataTemplate>
<!-- The following will display using the data template as it's Listbox.ItemTemplate -->
<ListBox ItemsSource="{Binding Source={StaticResource CurrentClients}}" />
<!-- OR -->
<ListBox ItemsSource="{Binding Source={StaticResource CurrentClients}}" >
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding CleintName}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

<!-- Hierarchical Data Templates for a TreeView -->

<HierarchicalDataTemplate DataType="{x:Type src:Client}"
ItemsSource="{Binding Path=Projects}">

<TextBlock Text="{Binding Path=Name}" />

</HierarchicalDataTemplate>
<HierarchicalDataTemplate DataType="{x:Type src:Project}"
ItemsSource="{Binding Path=Tasks}">

<TextBlock Text="{Binding Path=ProjectName}" />

</HierarchicalDataTemplate>
<DataTemplate DataType="{x:Type src:Task}">
<TextBlock Text="{Binding Path=TaskName}" ToolTip="{Binding Path=TaskName}" />
</DataTemplate>

XPATH
<!-- Binding to XML -->
<XmlDataProvider x:Key="xmlData" XPath="/" Source="Employees.xml" />
<ListBox ItemsSource="{Binding Source={StaticResource xmlData},XPath=Employees/IT}" />

RELATIVE SOURCE
<TextBlock Text="{Binding RelativeSource={RelativeSource FindAncestor,
AncestorType={x:Type TextBlock}}}" />
<!-- FindAncestor Syntax -->
RelativeSource FindAncestor, AncestorLevel=n, AncestorType={x:Type desiredType}}
<!-- To bind to the previous data item in a data-bound collection -->
Text="{Binding RelativeSource={Binding RelativeSource={RelativeSource PreviousData}}}"
<!-- Useful for Templates -->
Text="{Binding RelativeSource={Binding RelativeSource={RelativeSource TemplatedParent}}}"
<!-- Binding to self -->
Text="{Binding RelativeSource={Binding RelativeSource={RelativeSource Self}}}"
<!-- EXAMPLE: -->
<Slider ToolTip="{Binding RelativeSource={RelativeSource Self}, Path=Value}" />

STATIC RESOURCES
<!-- Static Resources set a property with a value only once. -->
<!-- They are resources instantiated when the form loads. -->
<!-- They are very fast and efficent to apply, but you do have -->
<!-- the cost of instantiating the object up front even if you -->
<!-- never use the object. -->
<Window.Resources>
<Image x:Key="expandNode" Source="expand.png" />
</Window.Resources>

Created by Nathan Zaugg. For an updated copy please visit: http://www.InteractiveASP.NET © 2008| Databinding 2
<Button Content="{StaticResource expandNode}" />

DYNAMIC RESOURCES
<!-- Dynamic resources allow the property to be updated when the resource changes -->
<!-- Also, Dynamic resources are not loaded until needed unlike StaticResources that-->
<!-- Load as soon as the XAML is loaded. However, DynamicResources are more expensive.-->
<!-- Perfect for themes because they change when a user changes colors in the CP -->
<Button Background="{DynamicResource {x:Static System.WindowBrush}}" />

STYLE
<Application.Resources>
<!-- Inherit a style by useing BasedOn="{StaticResource GeneralStyle}" -->
<Style x:Key="TopButton" TargetType="{x:Type Button}" >
<Setter Property="Background" Value="#FFDDDDDD" />
</Style>
</Application.Resources>
…
<Button Style="{StaticResource TopButton}" />

TRIGGERS
<Style TargetType="{x:Type Button}">
<Style.Triggers>
<!-- Property Trigger -->
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="Blue" />
</Trigger>

<!-- Multi Trigger -->

<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True" />
<Condition Property="IsFocused" Value="False" />
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter Property="Foreground" Value="Blue" />
</MultiTrigger.Setters>
</MultiTrigger>

<!-- Data Trigger -->

<DataTrigger Binding="{Binding RelativeSource={RelativeSource Self},
Path=Text}" Value="Blue">
<Setter Property="Forecolor" Value="Blue" />
</DataTrigger>

<!-- Event Trigger Example using a Storyboard Animation-->

<EventTrigger RoutedEvent="Loaded">
<EventTrigger.Actions>
<BeginStoryboard>
<!-- Insert Animations here-->
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>

</Style.Triggers>
</Style>

Created by Nathan Zaugg. For an updated copy please visit: http://www.InteractiveASP.NET © 2008| Triggers 3
CONTROL TEMPLATE

<!-- Control Template -->

<Style x:Key="RoundButton">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Border Width="22" Height="22" CornerRadius="15">
<Border.Background>
<RadialGradientBrush GradientOrigin=".3, .3">
<GradientStop Color="White" Offset=".15" />
<GradientStop Color="#888" Offset="1" />
</RadialGradientBrush>
</Border.Background>
<TextBlock Foreground="#333" Text="{Binding Text}" />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

<!-- Control Template for Content Control -->

<Style x:Key="GridListbox" TargetType="ListBox">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Grid>
<ScrollViewer VerticalScrollBarVisibility="Auto">
<ItemsPresenter />
</ScrollViewer>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

TRANSFORMS
<!-- Rotate Transform -->
<Button RenderTransformOrigin="1,0" Content="Exit">
<Button.RenderTransform>
<RotateTransform Angle="90" />
</Button.RenderTransform>
</Button>

<!-- Other Transforms -->

<TranslateTransform <!-- Moves an object from its origin -->
<ScaleTransform <!-- Shrinks or Expands an object -->
<SkewTransform <!-- Skews an object -->
<MatrixTransform <!-- Custom Transform an object -->

Created by Nathan Zaugg. For an updated copy please visit: http://www.InteractiveASP.NET © 2008| Transforms 4