Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to split a stackpanel like a grid

I need to show details of an object in the ui. I have the following code which defines a data template for a class Category. I am trying to get a layout where pairs of member name and value will be stacked vertically. However I want member names to be of same width and same for values. What should I do to get this layout?

    <DataTemplate DataType="{x:Type local:Category}">
        <Grid HorizontalAlignment="Stretch">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="4*" SharedSizeGroup="a" />
                <ColumnDefinition Width="6*" SharedSizeGroup="b" />
            </Grid.ColumnDefinitions>
            <StackPanel>
                <StackPanel HorizontalAlignment="Stretch" Orientation="Horizontal" Grid.ColumnSpan="2">
                    <TextBlock Text="Id" Grid.Column="0" Grid.IsSharedSizeScope="True" />
                    <TextBlock Text="{Binding Path=Id}" Grid.Column="1"/>
                </StackPanel>
                <StackPanel HorizontalAlignment="Stretch" Orientation="Horizontal" Grid.ColumnSpan="2">
                    <TextBlock Text="Name" Grid.Column="0" Grid.IsSharedSizeScope="True" />
                    <TextBlock Text="{Binding Path=Name}" Grid.Column="1"/>
                </StackPanel>
            </StackPanel>
        </Grid>
    </DataTemplate>
like image 348
nakiya Avatar asked Oct 21 '25 03:10

nakiya


1 Answers

I think you can just divide the Grid to two rows and eliminate the use of StackPanels?

like image 135
Hailei Avatar answered Oct 24 '25 01:10

Hailei