XAML Guidelines

Use common formatting (HTA2501)

Agree in your team on XAML styling rules and use them. The rules should cover: order of the elements, number of the elements per line, indention etc. It is strongly recommended to use a tool which look after the formatting.

Good one is XAML Styler, it is a Visual Studio extension. Make sure you use the same VS version across the team, hence the same tool version, some formatting rules could have been changed. In STARS VETS we use this configuration. You can use the link to the file in Tools/Options/XAML Styler/XAML Styler Configuration/External configuration file. If the network link does not work, download the file and reference the local copy. Then whenever you edit a xaml, press Ctrl+S to apply the XAML Styler formatting.

Use x:Name rather than Name attribute (HTA2502)

  • All elements support x:Name (except from elements in resource dictionary), but only some support Name.

Use DynamicResource only when it is necessary (HTA2503)

  • DynamicResource has much bigger overhead, so whenever it is possible use StaticResource.

  • Note that in STARS VETS we use resources from other projects and it requires using DynamicResource a lot.

If you ever draw a one pixel thick line use SnapToDevicePixels (HTA2504)

  • Why this is necessary, refer to this article. Simply it can happen that the one pixel line is rendered not like one pixel but across two halfs. It looks blurred.

Use design data context (HTA2505)

  • Specify the design DataContext of every user control in this way:
<UserControl x:Class="MyUserControlView"
   ...
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    mc:Ignorable="d" 
    d:DataContext="{d:DesignInstance MyUserControlViewModel}">
  • This code is removed from compilation, it does not go into the result of the complilation. It only helps developers to see if their binding works and using standard shortcuts to jump directly to the model’s properties/methods. Also if you rename a property/method the change is propagated to the xaml.

Use data type in data templates (HTA2506)

  • Whenever you can use DataType in DataTemplate. It allows the editor to validate bindings and it keeps synchronized when a property is renamed.
<DataTemplate DataType="customActions:CustomActionViewModel">
  ...
</DataTemplate>

Use ContentControl with INamedValueViewModel rather than HeaderedContentControl with IObservableValue (HTA2510)

This only applies to: STARS VETS
  • This is bad
<HeaderedContentControl Header="{Resx String_Coastdown_ComputationMethod}"
		Style="{DynamicResource NamedValueStyle}">
	<ContentControl views:View.Context="{Binding Path=ComputationMethod.State.Value, Mode=OneWay}"
	views:View.Model="{Binding ComputationMethod, Mode=OneTime, IsAsync=True}" />
</HeaderedContentControl>
  • This is good
<ContentControl views:View.Model="{Binding TestProcedureName,Mode=OneTime,IsAsync=True}"/>
  • We have a user control which does all the stuff written in the first (bad) example, no reason to copy-paste it around the code. Moreover, the resource strings used in the code are easier to find and those used in xaml.

Use ResxExtension to shorten the resource string identificatiors (HTA2511)

This only applies to: STARS VETS
  • In the User control definition use
    ResxExtension.DefaultResxName="STARS.Applications.VETS.UI.Properties.Resources"
    
  • Then later in the code you can use just
    Header="{Resx String_RunExportAfterTest}"
    
  • instead of
    Header="{Resx ResxName=STARS.Applications.VETS.UI.Properties.Resources,Key=String_ResourcePathOrCommand}"
    

Common STARS VETS XAML (HTA2512)

This only applies to: STARS VETS

In general DefaultTestEditorView is usually a good place to see good XAML style.