WPF 轉換系統：RenderTransform vs LayoutTransform、TransformGroup、字串簡寫、任意階層套用

轉換支援高解析度獨立性的基石

WPF 將縮放/旋轉/傾斜整合在基礎圖形架構，任意 UI 元素皆可套用轉換，實現真正的解析度獨立。

兩種轉換屬性：渲染 vs 版面

基本用法：TransformGroup 組合多重轉換

<TextBlock RenderTransform="scale 2,2 rotate 10">Hello,</TextBlock>
<TextBlock>world</TextBlock>

• 字串簡寫：scale Sx,Sy、rotate Angle、translate X,Y、skewX Angle、skewY Angle、matrix ...。
• 等同於 XAML 完整寫法：

<TextBlock.RenderTransform>
    <TransformGroup>
        <ScaleTransform ScaleX="2" ScaleY="2" />
        <RotateTransform Angle="10" />
    </TransformGroup>
</TextBlock.RenderTransform>

RenderTransform 導致視覺與版面脫節

• 範例：StackPanel 水平排列，第一個 TextBlock 縮放 2x 旋轉 10°，RenderTransform 不影響版面 → 第二個 "world" 重疊在第一個上方。
• 改用 LayoutTransform → StackPanel 為變形後大小配置空間，兩元素不再重疊。

任意階層套用轉換

• 可在視覺樹任意節點套用轉換，巢狀疊加（矩陣相乘）。
• 圖 7-55：外層 Grid 旋轉放大，內層 Grid 反向縮小旋轉，版面配置仍正常運作。

轉換類型總覽

• ScaleTransform、RotateTransform、TranslateTransform、SkewTransform：便利類別。
• MatrixTransform：3x3 矩陣，可表達任意仿射轉換（所有上述皆可轉為矩陣）。
• 仿射轉換保持直線性；3D 視圖轉換不保持（透視投影）。

可靠性的重要性

徹底支援轉換不只是為古怪視覺，而是保證在動畫、縮放、高 DPI、觸控縮放等情境下，版面與渲染始終一致、可預期。