Condividi tramite

Procedura: Applicare trasformazioni al testo

  • Articolo

Le trasformazioni possono modificare la visualizzazione del testo nell'applicazione. Negli esempi seguenti vengono usati diversi tipi di trasformazioni di rendering per influire sulla visualizzazione del testo in un TextBlock controllo .

Esempio

L'esempio seguente illustra la rotazione del testo intorno a un punto specifico del piano x-y bidimensionale.

Text rotated using a RotateTransform

Nell'esempio di codice seguente viene utilizzato un oggetto RotateTransform per ruotare il testo. Un Angle valore pari a 90 ruota l'elemento 90 gradi in senso orario.

<!-- 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>

Nell'esempio seguente la seconda riga del testo è ridimensionata del 150% lungo l'asse x, mentre la terza riga del testo è ridimensionata del 150% lungo l'asse y.

Text scaled using a ScaleTransform

Nell'esempio di codice seguente viene usato un ScaleTransform oggetto per ridimensionare il testo dalle dimensioni originali.

<!-- 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>

Nota

Il ridimensionamento del testo non coincide con l'aumento delle dimensioni dei caratteri del testo. Le dimensioni dei caratteri vengono calcolate in modo indipendente per fornire la migliore risoluzione a dimensioni diverse. Il testo ridimensionato mantiene invece le proporzioni del testo nelle dimensioni originali.

Nell'esempio seguente il testo è inclinato lungo l'asse x.

Text skewed using a SkewTransform

Nell'esempio di codice seguente viene utilizzato un oggetto SkewTransform per asimmetria del testo. L'inclinazione, nota anche come distorsione, è una trasformazione che estende lo spazio delle coordinate in modo non uniforme. In questo esempio le due stringhe di testo sono inclinate di -30° e 30° lungo la coordinata x.

<!-- 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>

Nell'esempio seguente il testo è traslato, o spostato, lungo l'asse x e y.

Text offset using a TranslateTransform

Nell'esempio di codice seguente viene utilizzato un oggetto TranslateTransform per sfalsare il testo. In questo esempio una copia del testo con un leggero offset sotto il testo primario crea un effetto di ombreggiatura.

<!-- 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"/>

Nota

DropShadowBitmapEffect fornisce un set completo di funzionalità per fornire effetti ombreggiatura. Per altre informazioni, vedere Creare testo con ombreggiatura.

Vedi anche