WPF - How to right align a textblock inside a horizontally oriented stackpanel?

Question

This should be so simple - I've been hitting my head against my desk for so long trying to make a seemlingly simple task work (makes me feel like WPF is un-intuitive or buggy)...

In any case, I've got a Stackpanel which is set to horizontal orientation. Inside it I've got two TextBlocks. I want the 2nd one to display it's text to the right.

How do I accomplish it?

Doing all this reminds me why I walked away from Silverlight. :p

Answer 1

You need to use a DockPanel if you don't want all elements to be stacked like the StackPanel do. To cause the second TextBlock to right-align, you can add an extra dummy TextBlock to fill the area between them:

    <DockPanel>
        <TextBlock>Left text</TextBlock>
        <TextBlock DockPanel.Dock="Right">Right text</TextBlock>
        <TextBlock />
    </DockPanel>

Or you can use the TextAlignment attribute:

    <DockPanel>
        <TextBlock>Left text</TextBlock>
        <TextBlock TextAlignment="Right">Right text</TextBlock>
    </DockPanel>

Answer 2

It can be archived very easily by using grid as I've got the same problem :)

<Grid>
    <TextBlock>Left text</TextBlock>
    <TextBlock TextAlignment="Right">Right text</TextBlock>
</Grid>

Answer 3

In light of your comments, here is another example showing a couple of ways of accomplishing what you want, Grid layout and DockPanel layout. From the sounds of it, the DockPanel layout is probably what you're looking for. If this doesn't work, you may need to provide a clearer description of your desired layout and properties.

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Grid>
  <Grid.RowDefinitions>
    <RowDefinition Height="0.45*" />   
    <RowDefinition Height="0.05*" />
    <RowDefinition Height="0.45*" />
  </Grid.RowDefinitions>
   <Grid Grid.Row="0">
      <Grid.ColumnDefinitions>
        <!-- note: you don't need to declare ColumnDefintion
         widths here; added for clarity. -->
         <ColumnDefinition Width="0.5*" />
         <ColumnDefinition Width="0.5*" />
      </Grid.ColumnDefinitions>
      <TextBlock 
          Grid.Column="0" 
          Background="Tomato" 
          TextWrapping="Wrap">I'm on the left</TextBlock>
      <TextBlock
          Grid.Column="1"
          Background="Yellow"
          TextAlignment="Right"
          TextWrapping="Wrap">I'm on the right</TextBlock>
   </Grid>

   <Grid Grid.Row="1" Background="Gray" />

   <DockPanel Grid.Row="2">
      <TextBlock
          DockPanel.Dock="Left"
          Background="Tomato" 
          TextWrapping="Wrap">I'm on the left</TextBlock>
      <TextBlock
          DockPanel.Dock="Right"
          Background="Yellow"
          TextAlignment="Right"
          TextWrapping="Wrap">I'm on the right</TextBlock>
   </DockPanel>
</Grid>
</Page>