Skip to main content

Microsoft Silverlight

Answered Question How to set a textblock to vertical orientation?RSS Feed

(0)

Frank Wu
Frank Wu

Member

Member

76 points

96 Posts

How to set a textblock to vertical orientation?

I don't think that using StackPanel is the answer.

g.k.
g.k.

Member

Member

16 points

9 Posts

Re: How to set a textblock to vertical orientation?

How about this:

<TextBlock x:Name="YAxisTitle" HorizontalAlignment="Center" VerticalAlignment="Center" Text="Y-Axis Label" RenderTransformOrigin="0.5,0.5">
  <TextBlock.RenderTransform>                
    <RotateTransform Angle="-90"/>
  </TextBlock.RenderTransform>
</TextBlock>

It works, but beware of the mysterious clipping described in this thread: http://silverlight.net/forums/t/16035.aspx

The text is clipped if it does not fit in the space provided by the parent grid or stackpanel. To solve this put it inside a canvas. Oh silverlight :(. Mark this an answered if it works for you. It should.

jeetAbhi
jeetAbhi

Member

Member

424 points

81 Posts

Re: How to set a textblock to vertical orientation?

<UserControl x:Class="SilverlightPositioningTest.Page"

xmlns="http://schemas.microsoft.com/client/2007"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="400" Height="500">

<Border BorderThickness="1" BorderBrush="White">

<Grid ShowGridLines="True" Width="400" Height="500">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="50"></ColumnDefinition>

<ColumnDefinition></ColumnDefinition>

</Grid.ColumnDefinitions>

<Border BorderThickness="1" BorderBrush="Blue">

<TextBlock VerticalAlignment="Bottom" Text="This text should fit" TextWrapping="Wrap" Width="10" Height="auto">

</TextBlock>

</Border>

</Grid>

</Border>

</UserControl>

 You can adjust your textblock width and font-size to see how much text you want in that narrow container. If this has helped please MARK AS ANSWER......

Frank Wu
Frank Wu

Member

Member

76 points

96 Posts

Re: How to set a textblock to vertical orientation?

Thank you for your replying. Yes, it can work using TextWrapping in TextBlock, this is a new feature in SL2 Beta 2.

jeetAbhi
jeetAbhi

Member

Member

424 points

81 Posts

Answered Question

Re: Re: How to set a textblock to vertical orientation?

<UserControl x:Class="SilverlightPositioningTest.Page"

xmlns="http://schemas.microsoft.com/client/2007"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="400" Height="500">

<Border BorderThickness="1" BorderBrush="White">

<Grid ShowGridLines="True" Width="400" Height="500">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="50"></ColumnDefinition>

<ColumnDefinition></ColumnDefinition>

</Grid.ColumnDefinitions>

<Border BorderThickness="1" BorderBrush="Blue">

<TextBlock VerticalAlignment="Bottom" Text="This text should fit" TextWrapping="Wrap" Width="10" Height="auto">

</TextBlock>

</Border>

</Grid>

</Border>

</UserControl>

 You can adjust your textblock width and font-size to see how much text you want in that narrow container

or also you can play with your margin properties to overcome the problem you just mentioned above here is the code......

<UserControl x:Class="SilverlightPositioningTest.Page"

xmlns="http://schemas.microsoft.com/client/2007"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="400" Height="300" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">

<Grid ShowGridLines="True" Width="400" Height="300">

<Grid.ColumnDefinitions>

<ColumnDefinition Width="50"/>

<ColumnDefinition/>

</Grid.ColumnDefinitions>

<TextBlock Margin="-158,0,-153,0" VerticalAlignment="Center" Text="This text should fit here"

TextWrapping="Wrap" Foreground="#FFE1B3B3" RenderTransformOrigin="0.5,0.5"

Grid.ColumnSpan="1" HorizontalAlignment="Center" Width="189" Height="20" d:LayoutOverrides="Height" Grid.Column="0">

<TextBlock.RenderTransform>

<TransformGroup>

<ScaleTransform/>

<SkewTransform/>

<RotateTransform Angle="-90"/>

<TranslateTransform/>

</TransformGroup>

</TextBlock.RenderTransform>

</TextBlock>

 

</Grid>

 

</UserControl>

 

. If this has helped please MARK AS ANSWER......

Frank Wu
Frank Wu

Member

Member

76 points

96 Posts

Re: Re: How to set a textblock to vertical orientation?

Thank you for your answer, I use LineHeight="18" and LineStackingStrategy="BlockLineHeight":

<TextBlock Canvas.Left="100" Canvas.Top="10" FontSize="20" VerticalAlignment="Bottom" Text="This text should fit" LineHeight="18" LineStackingStrategy="BlockLineHeight" TextWrapping="Wrap" Width="2" Height="auto" FontFamily="Verdana">

</TextBlock>

slyi
slyi

Participant

Participant

824 points

254 Posts

Re: How to set a textblock to vertical orientation?

 

Please see http://blogs.msdn.com/delay/archive/2008/06/19/text-from-a-slightly-different-perspective-verticaltextblock-control-sample-for-silverlight-2.aspx

These methods seem handy for japanese or other asian text 

  • Unanswered Question
  • Answered Question
  • Announcement
Microsoft Communities