user3925079
user3925079

Reputation:

How to wrap text in textblock?

I`m trying to get a textbox to auto fill it's text and to align it in the center of the app. I know how to align it in the center, but not how I can get the text to autofill.

For example:

I have some text in a textblock (see the code below), and the problem is that it only shows the first five words. I've been trying to set every Text Alignment property. So far no good. Can anyone help me with this?

        <TextBlock Text="Het Commerciële Huis uit Aalten (Achterhoek) is een instituut op het gebied van optimalisatie van commercie en communicatie. Wij werken met passie aan uw resultaat" Margin="0,50,0,0" HorizontalAlignment="Center" TextAlignment="Center" />

P.S.

It would also be nice if anyone can tell me how I can give the textbox a width equal to 50% of the client width.

With kind regards!

Upvotes: 2

Views: 112

Answers (2)

StepUp
StepUp

Reputation: 38199

Stackpanel can help to wrap textblock properly:

<Viewbox>
   <StackPanel Orientation="Vertical" Width="400">
       <TextBlock x:Name="subHeaderText" Text="Het Commerciële Huis uit Aalten (Achterhoek) is een instituut op het gebied van optimalisatie van commercie en communicatie. Wij werken met passie aan uw resultaat" FontSize="10" TextWrapping="Wrap" Foreground="Black" />
   </StackPanel>
</Viewbox>

or just use the TextWrapping property of the TextBlock control:

<TextBlock TextWrapping="Wrap">Het Commerciële Huis uit Aalten (Achterhoek) is een instituut op het gebied van optimalisatie van commercie en communicatie. Wij werken met passie aan uw resultaat</TextBlock>

There are many techniques to split window on two similar parts. In my view the most flexible technique dividing on two parts of the window is using Layout control called Grid:

<Grid>
   <!-- Define Columns -->
   <Grid.ColumnDefinitions>
      <ColumnDefinition Width="*"/>
      <ColumnDefinition Width="*"/>
   </Grid.ColumnDefinitions>    

   <TextBlock Grid.Column="0" TextWrapping="Wrap">Het Commerciële Huis uit Aalten (Achterhoek) is een instituut op het gebied van optimalisatie van commercie en communicatie. Wij werken met passie aan uw resultaat</TextBlock>       
   <TextBox Grid.Column="1" Text="Second Part"/>
</Grid>

Upvotes: 1

kirotab
kirotab

Reputation: 1306

I would do it using some grids.

*First grid defines two rows - one for header one for content

*Content grid defines three columns - one is central and is with 50% size, the other two are each 25% size

*And you have your content grid that is on the second row where you put the rest of your page's content.

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid Background="Purple" x:Name="header" HorizontalAlignment="Stretch">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="2*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <TextBlock Text="ADSADASDSADSADSADSADSA adasdsadasd asdad dsadasd sa ADSADASDSADSADSADSADSA adasdsadasd asdad dsadasd sa ADSADASDSADSADSADSADSA adasdsadasd asdad dsadasd sa"
                   Grid.Column="1"
                   Foreground="White"
                   HorizontalAlignment="Center" 
                   TextAlignment="Center" 
                   TextWrapping="WrapWholeWords"/>
    </Grid>
    <Grid Grid.Row="1" x:Name="content" Background="Green">
        <!--Page content goes here-->
    </Grid>
</Grid>

Upvotes: 1

Related Questions