user1102610
user1102610

Reputation: 106

How to right align RadioButton in WPF

Trying this tutorial http://www.wpftutorial.net/ListBoxDataTemplate.html

and thought of adding a radio button as follows

   <ListBox Margin="10" ItemsSource="{Binding}">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="60"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="20"/>
                    </Grid.ColumnDefinitions>
                    <Border Grid.Column="0" Margin="5" BorderBrush="Black" BorderThickness="1">
                        <Image Source="{Binding Path=Image}" Stretch="Fill" Width="50" Height="50" />
                    </Border>
                    <StackPanel Grid.Column="1" Margin="5" >
                        <StackPanel Orientation="Horizontal" TextBlock.FontWeight="Bold" >
                            <TextBlock Text="{Binding Path=Some1}" />
                            <TextBlock Text="{Binding Path=Firstname, FallbackValue=FirstName}" />
                            <TextBlock Text="{Binding Path=Lastname, FallbackValue=LastName}" Padding="3,0,0,0"/>
                        </StackPanel>
                        <TextBlock Text="{Binding Path=Age, FallbackValue=Age}" />
                        <TextBlock Text="{Binding Path=Role, FallbackValue=Role}" />
                    </StackPanel>

                    <RadioButton Grid.Column="2" Margin="5" HorizontalAlignment="Right" GroupName="A1"/>
                </Grid>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

but the resulting output is

enter image description here

Any help in aligning the radio button to the right next to the edge of listbox? thanks

Upvotes: 2

Views: 2716

Answers (3)

Uri London
Uri London

Reputation: 10797

Adding more details to @ColinE answer...

Use SharedSizeGroup.

<ListBox ... Grid.IsSharedSizeScope="True">
   ...
   <Grid.ColumnDefinitions>
       <ColumnDefinition Width="60"/>
       <ColumnDefinition SharedSizeGroup="secondColumn" />
       <ColumnDefinition Width="20"/>
   </Grid.ColumnDefinitions>

   ...
</ListBox>

That will tell WPF to synchronize the second column of all the grids (technically, the width is 'Auto', but it will be the same width for all the Grids).

Another alternative would be to use ListView, and define the columns.

Upvotes: 0

brunnerh
brunnerh

Reputation: 184526

First you need to get the template content to stretch, then you can create a content which has things aligned on the right.

Upvotes: 3

ColinE
ColinE

Reputation: 70142

You need to align the widths of the grids within your DataTemplate. You can do this with a SharedSizeGroup, see this question for details:

How can I make a column in a listbox in WPF the same width for all items?

Upvotes: 3

Related Questions