XAML格式化工具：XAML Styler

XAML格式化的意義

在開發WPF應用過程中，編寫XAML時需要手動去縮進或者換行，隨著時間的推移或者參與開發的人增多，XAML文件內容的格式會越來越亂。要麼屬性全都寫在一行，內容太寬一屏無法完整展現；要麼屬性單獨占一行，難以直觀的看清結構；另外xaml元素的屬性無序，重要屬性查找困難，手動維護屬性使之規律有序也比較費時。

格式化XAML代碼可以使代碼佈局整齊，減少冗餘空格和換行符，使代碼結構清晰、縮進一致。使代碼更易於閱讀和理解，開發人員能夠更快速地編寫和修改代碼。此外，還可以確保整個項目中的代碼風格一致，對於團隊協作和代碼維護非常重要。然而微軟官方並未提供很好的XAML格式化方案，不過Visual Studio Marketplace中有個非常好用的插件XAML Styler。

安裝配置XAML Styler

在Visual Studio的擴展管理視窗中，搜索XAML Styler下載安裝後重啟Visual Studio即可完成安裝。在"工具"->"選項"中找到"XAML Styler"可以進行詳細配置。每一項具體含義參見配置項說明

如果需要在XAML編輯器執行保存時自動格式化，需要把Format XAML on save設置為true。如果想手動格式化，則直接在XAML編輯器中右鍵菜單點擊Format XAML或者使用快捷鍵進行格式化。

統一格式化標準

在團隊開發中，即便所有的人都使用XAML Styler,也可能因個人習慣不同選擇不同的設置，也會帶來很多麻煩。針對這個問題，XAML Styler也提供瞭解決方案。

在項目的根目錄創建一個名為"Settings.XamlStyler"的文件（不必引入到項目中），內容可參考Default Configuration,XAML Styler會根據這個文件而不是Visual Studio中的全局配置進行格式化，既解決了項目的統一格式化標準問題，也允許開發人員按照自己的習慣開發非團隊項目。

"Settings.XamlStyler"配置項及註釋如下,大家可根據自身習慣酌情修改

{
    "IndentSize": 4,  //縮進空格數，4【預設】
    "IndentWithTabs": false   //是否使用製表符進行縮進，false【預設】
    "AttributesTolerance": 2, //單行最大屬性數，2【預設】，如果元素屬性數不大於此數就不會換行
    "KeepFirstAttributeOnSameLine": false, //第一個屬性是否與開始標記在同一行，false【預設】
    "MaxAttributeCharactersPerLine": 0, //多個屬性大於多少個字元就該換行，0【預設】
    "MaxAttributesPerLine": 1, //大於幾個屬性就該換行，1【預設】
    "NewlineExemptionElements": "RadialGradientBrush, GradientStop, LinearGradientBrush, ScaleTransform, SkewTransform, RotateTransform, TranslateTransform, Trigger, Condition, Setter", //屬性不應該跨行中斷的元素
    "SeparateByGroups": false, //是否應該按照屬性的分組進行分行，false【預設】
    "AttributeIndentation": 0,  //屬性縮進空格字元數（-1不縮進；0【預設】縮進4個空格；其它個數則指定）
    "AttributeIndentationStyle": 1, //屬性縮進風格（0混合，視情況使用製表符和空格；1【預設】使用空格）
    "RemoveDesignTimeReferences":  false, //是否移除自動添加的控制項和設計時引用內容，false【預設】
    "IgnoreDesignTimeReferencePrefix": false, //排序時是否忽略帶有設計時引用命名空間首碼的屬性，false【預設】
    "EnableAttributeReordering": true, //是否啟用屬性的自動排序，true【預設】
    /*屬性排序和分組規則*/
    "AttributeOrderingRuleGroups": [
        "x:Class",
        "xmlns, xmlns:x",
        "xmlns:*",
        "x:Key, Key, x:Name, Name, x:Uid, Uid, Title",
        "Grid.Row, Grid.RowSpan, Grid.Column, Grid.ColumnSpan, Canvas.Left, Canvas.Top, Canvas.Right, Canvas.Bottom",
        "Width, Height, MinWidth, MinHeight, MaxWidth, MaxHeight",
        "Margin, Padding, HorizontalAlignment, VerticalAlignment, HorizontalContentAlignment, VerticalContentAlignment, Panel.ZIndex",
        "*:*, *",
        "PageSource, PageIndex, Offset, Color, TargetName, Property, Value, StartPoint, EndPoint",
        "mc:Ignorable, d:IsDataSource, d:LayoutOverrides, d:IsStaticText",
        "Storyboard.*, From, To, Duration",
        "TargetType",
        "BasedOn"
    ],
    "FirstLineAttributes": "x:Name,Grid.Row,Grid.Column",  //應該在第一行的屬性，例如x:Name 和x:Uid等等,None【預設】
    "OrderAttributesByName": true, //是否按照屬性名稱進行排序
    "PutEndingBracketOnNewLine": false, //結束括弧是否獨占一行，false【預設】
    "RemoveEndingTagOfEmptyElement": true, //是否移除空元素的結束標簽，true【預設】
    "SpaceBeforeClosingSlash": true, //自閉合元素的末尾斜杠前是否要有空格，true【預設】
    "RootElementLineBreakRule": 0, //是否將根元素的屬性分成多行（0【預設】；1始終；2從不）
    "ReorderVSM": 2, //是否重新排序visualstateManager（0未定義；1移到最前；2【預設】移到最後）
    "ReorderGridChildren": false, //是否重新排序Grid的子元素，false【預設】
    "ReorderCanvasChildren": false, //是否重新排序Canvas的子元素，false【預設】
    "ReorderSetters": 0, //是否重新排序Setter（0【預設】不排序；1按屬性名；2按目標名；3先按目標名再按屬性名）
    "FormatMarkupExtension": true, //是否格式化標記擴展的屬性，true【預設】
    "NoNewLineMarkupExtensions": "x:Bind, Binding",     //始終放在一行上的標記擴展，"x:Bind, Binding"【預設】
    "ThicknessSeparator": 2, //Thickness類型的屬性應該用哪種分隔符(0不格式化；1空格；2【預設】逗號）
    "ThicknessAttributes": "Margin, Padding, BorderThickness, ThumbnailClipMargin",     //被認定為Thickness的元素應該是哪些，"Margin, Padding, BorderThickness, ThumbnailClipMargin"【預設】
    "FormatOnSave": true, //是否在保存時進行格式化，true【預設】
    "CommentPadding": 2, //註釋的間距應該是幾個空格，2【預設】
}

部分屬性配置選項

• AttributeIndentationStyle
  • Mixed = 0 混合，視情況使用製表符和空格
  • Spaces = 1 【預設】使用空格
• RootElementLineBreakRule
  • Default = 0 【預設】
  • Always = 1 始終
  • Never = 2 從不
• ReorderVSM
  • None = 0 未定義
  • First = 1 移到最前
  • Last = 2 【預設】移到最後
• ReorderSetters
  • None = 0 【預設】不排序
  • Property = 1 按屬性名
  • TargetName = 2 按屬性名
  • TargetNameThenProperty = 3 先按目標名再按屬性名
• ThicknessSeparator
  • None = 0 不格式化
  • Space = 1 空格
  • Comma = 2 【預設】逗號

如果對於上述配置中每一項的註釋沒有直觀的感受，可以通過wiki查看每項配置對應代碼格式化後的效果。