如何：向文本应用变换

更新：2007 年 11 月

变换可以改变应用程序中文本的显示。下面的示例使用不同类型的呈现变换来影响 TextBlock 控件中文本的显示。

示例

下面的示例演示围绕 x-y 二维平面上的一个指定点旋转的文本。

文本旋转 90 度的示例

下面的代码示例使用 RotateTransform 来旋转文本。如果 Angle 值为 90，则按顺时针方向将元素旋转 90 度。

<!-- Rotate the text 90 degrees using a RotateTransform. -->
<TextBlock FontFamily="Arial Black" FontSize="64" Foreground="Moccasin" Margin ="80, 10, 0, 0">
  Text Transforms
  <TextBlock.RenderTransform>
    <RotateTransform Angle="90" />
  </TextBlock.RenderTransform>
</TextBlock>

下面的示例演示三行文本，将第一行文本沿着 X 轴放大 150% 得到第二行文本，沿着 Y 轴放大 150% 得到第三行文本。

缩放的文本的示例

下面的代码示例使用 ScaleTransform 从文本原始大小对文本进行缩放。

<!-- Scale the text using a ScaleTransform. -->
<TextBlock
  Name="textblockScaleMaster" 
  FontSize="32"
  Foreground="SteelBlue"
  Text="Scaled Text"
  Margin="100, 0, 0, 0"
  Grid.Column="0" Grid.Row="0">
</TextBlock>
<TextBlock
  FontSize="32"
  FontWeight="Bold" 
  Foreground="SteelBlue"
  Text="{Binding Path=Text, ElementName=textblockScaleMaster}"
  Margin="100, 0, 0, 0"
  Grid.Column="0" Grid.Row="1">
  <TextBlock.RenderTransform>
    <ScaleTransform ScaleX="1.5" ScaleY="1.0" />
  </TextBlock.RenderTransform>
</TextBlock>
<TextBlock
  FontSize="32"
  FontWeight="Bold" 
  Foreground="SteelBlue"
  Text="{Binding Path=Text, ElementName=textblockScaleMaster}"
  Margin="100, 0, 0, 0"
  Grid.Column="0" Grid.Row="2">
  <TextBlock.RenderTransform>
    <ScaleTransform ScaleX="1.0" ScaleY="1.5" />
  </TextBlock.RenderTransform>
</TextBlock>

说明：
放大文本与增大文本的字号不同。字号的计算相互独立，以便提供针对不同字号的最佳分辨率。另一方面，缩放后的文本将保持原始大小的文本的比例。

下面的示例演示沿 X 轴扭曲的文本。

扭曲的文本的示例

下面的代码示例使用 SkewTransform 来扭曲文本。扭曲（也称为修剪）是一种以非均匀方式拉伸坐标空间的变换。在本示例中，两个文本字符串沿 x 坐标扭曲了 -30° 和 30°。

<!-- Skew the text using a SkewTransform. -->
<TextBlock
  Name="textblockSkewMaster" 
  FontSize="32"
  FontWeight="Bold" 
  Foreground="Maroon"
  Text="Skewed Text"
  Margin="125, 0, 0, 0"
  Grid.Column="0" Grid.Row="0">
  <TextBlock.RenderTransform>
    <SkewTransform AngleX="-30" AngleY="0" />
  </TextBlock.RenderTransform>
</TextBlock>
<TextBlock
  FontSize="32"
  FontWeight="Bold" 
  Foreground="Maroon"
  Text="{Binding Path=Text, ElementName=textblockSkewMaster}"
  Margin="100, 0, 0, 0"
  Grid.Column="0" Grid.Row="1">
  <TextBlock.RenderTransform>
    <SkewTransform AngleX="30" AngleY="0" />
  </TextBlock.RenderTransform>
</TextBlock>

下面的示例演示沿 x 轴和 y 轴平移或移动的文本。

平移的文本的示例

下面的代码示例使用 TranslateTransform 来偏移文本。在本示例中，原始文本下方略微偏移的文本副本产生了阴影效果。

<!-- Skew the text using a TranslateTransform. -->
<TextBlock
  FontSize="32"
  FontWeight="Bold" 
  Foreground="Black"
  Text="{Binding Path=Text, ElementName=textblockTranslateMaster}"
  Margin="100, 0, 0, 0"
  Grid.Column="0" Grid.Row="0">
  <TextBlock.RenderTransform>
    <TranslateTransform X="2" Y="2" />
  </TextBlock.RenderTransform>
</TextBlock>
<TextBlock
  Name="textblockTranslateMaster" 
  FontSize="32"
  FontWeight="Bold" 
  Foreground="Coral"
  Text="Translated Text"
  Margin="100, 0, 0, 0"
  Grid.Column="0" Grid.Row="0"/>

说明：
DropShadowBitmapEffect 提供了一组丰富的功能来产生阴影效果。有关更多信息，请参见如何：创建具有阴影的文本。

请参见

任务

如何：向文本应用动画