UWP文字旋转的锚点 RenderTransformOrigin

在UWP中文字旋转不能再用LayoutTranform了，只能用RenderTransform。在文字旋转过程中，我们会问旋转的锚点在哪里，是在文字的中心，还是文字的左上角呢？这个其实是通过TextBlock的RenderTransformOrigin属性控制的，它的值是两个比率，表明锚点在文字的X,Y方向的什么地方。RenderTransformOrigin=“0，0” 代表旋转锚点在文字的左上角，RenderTransformOrigin=“0.5，0.5”表示旋转的锚点在文字的中心。看下面的例子就比较清楚了。

<Canvas Name="ChartCanvas" Background="Yellow" Grid.Row="1">
            <TextBlock Foreground="Silver" FontSize="16" FontWeight="Light" FontFamily="Segoe UI" 
                                       HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0,0.5" 
                                       Text="Selvakumar Singa">
                <TextBlock.RenderTransform>
                    <RotateTransform Angle="30"/>
                </TextBlock.RenderTransform>
            </TextBlock>
            <TextBlock Foreground="DarkGray" FontSize="16" FontWeight="Light" FontFamily="Segoe UI" 
                                       HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0,0.5" 
                                       Text="Selvakumar Singa">
                <TextBlock.RenderTransform>
                    <RotateTransform Angle="60"/>
                </TextBlock.RenderTransform>
            </TextBlock>
            <TextBlock Foreground="Black" FontSize="16" FontWeight="Light" FontFamily="Segoe UI" 
                                       HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0,0.5" 
                                       Text="Selvakumar Singa">
                <TextBlock.RenderTransform>
                    <RotateTransform Angle="90"/>
                </TextBlock.RenderTransform>
            </TextBlock>
            <TextBlock Foreground="Green" FontSize="16" FontWeight="Light" FontFamily="Segoe UI" 
                                       HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0,0.5" 
                                       Text="Selvakumar Singa">
            </TextBlock>

            <!-- rotate anchor at center -->

            <TextBlock Foreground="Silver" Canvas.Top="300" FontSize="16" FontWeight="Light" FontFamily="Segoe UI" 
                                       HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.5,0.5" 
                                       Text="Selvakumar Singa">
                <TextBlock.RenderTransform>
                    <RotateTransform Angle="30"/>
                </TextBlock.RenderTransform>
            </TextBlock>
            <TextBlock Foreground="DarkGray"  Canvas.Top="300" FontSize="16" FontWeight="Light" FontFamily="Segoe UI" 
                                       HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.5,0.5" 
                                       Text="Selvakumar Singa">
                <TextBlock.RenderTransform>
                    <RotateTransform Angle="60"/>
                </TextBlock.RenderTransform>
            </TextBlock>
            <TextBlock Foreground="Black"  Canvas.Top="300" FontSize="16" FontWeight="Light" FontFamily="Segoe UI" 
                                       HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.5,0.5" 
                                       Text="Selvakumar Singa">
                <TextBlock.RenderTransform>
                    <RotateTransform Angle="90"/>
                </TextBlock.RenderTransform>
            </TextBlock>
            <TextBlock Foreground="Green"  Canvas.Top="300" FontSize="16" FontWeight="Light" FontFamily="Segoe UI" 
                                       HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.5,0.5" 
                                       Text="Selvakumar Singa">
            </TextBlock>
        </Canvas>