NoWar
NoWar

Reputation: 37632

How to bind WPF TextBlock to right top corner?

Please help me to edit XAML so the TextBlock which shows minutes goes to the right top corner.

<StackPanel Orientation="Horizontal" >
   <StackPanel Orientation="Horizontal" >
      <TextBlock Name="UserNameTextBlock"  Margin="0,0,8,0"  VerticalAlignment="Bottom" FontSize="15" Text="{Binding Path=UserName}" FontWeight="Bold"></TextBlock>
      <TextBlock   FontSize="13" VerticalAlignment="Bottom" Padding="0,0,0,1" Foreground="LightGray" >@</TextBlock>
      <TextBlock  FontSize="13"  VerticalAlignment="Bottom" Padding="0,0,0,1" Name="ScreenNameTextBlock"  Text="{Binding Path=ScreenName}" Foreground="Gray" ></TextBlock>
      <TextBlock  FontSize="13"  VerticalAlignment="Bottom" Padding="0,0,0,1" Name="MinAgo"  Text="{Binding Path=MinAgo}" Foreground="Gray" ></TextBlock>    
     </StackPanel>
</StackPanel>

So it should be like

enter image description here

Upvotes: 0

Views: 2732

Answers (3)

davisoa
davisoa

Reputation: 5439

I would use a DockPanel. For the child nodes, just add DockPanel.Dock attributes to indicate where you want the element to go. The last child element will automatically fill the remaining area.

<DockPanel>
    <TextBlock DockPanel.Dock="Right" FontSize="13"  VerticalAlignment="Bottom" Padding="0,0,0,1" Name="MinAgo"  Text="{Binding Path=MinAgo}" Foreground="Gray" ></TextBlock>    
    <StackPanel Orientation="Horizontal" >
        <TextBlock Name="UserNameTextBlock"  Margin="0,0,8,0"  VerticalAlignment="Bottom" FontSize="15" Text="{Binding Path=UserName}" FontWeight="Bold"></TextBlock>
        <TextBlock FontSize="13" VerticalAlignment="Bottom" Padding="0,0,0,1" Foreground="LightGray" >@</TextBlock>
        <TextBlock FontSize="13" VerticalAlignment="Bottom" Padding="0,0,0,1" Name="ScreenNameTextBlock"  Text="{Binding Path=ScreenName}" Foreground="Gray" ></TextBlock>
    </StackPanel>
</DockPanel>

Upvotes: 5

Stephen Holt
Stephen Holt

Reputation: 2368

If I were doing this I would use a grid rather than a horizontal stack panel:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>
    <TextBlock Grid.Column="0" Name="UserNameTextBlock"  Margin="0,0,8,0"  VerticalAlignment="Bottom" FontSize="15" Text="{Binding Path=UserName}" FontWeight="Bold"></TextBlock>
    <TextBlock Grid.Column="1" FontSize="13" VerticalAlignment="Bottom" Padding="0,0,0,1" Foreground="LightGray" >@</TextBlock>
    <TextBlock Grid.Column="2"  FontSize="13"  VerticalAlignment="Bottom" Padding="0,0,0,1" Name="ScreenNameTextBlock"  Text="{Binding Path=ScreenName}" Foreground="Gray" ></TextBlock>
    <TextBlock Grid.Column="4"  FontSize="13"  VerticalAlignment="Bottom" Padding="0,0,0,1" Name="MinAgo"  Text="{Binding Path=MinAgo}" Foreground="Gray" ></TextBlock>
</Grid>

Note the * in the column 3 which means that column will use all available space after column 2, except for what is needed by column 4.

Upvotes: 4

brunnerh
brunnerh

Reputation: 185047

Don't use a StackPanel but a Grid with columns?

Upvotes: 3

Related Questions