Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why two columns in a WPF Grid with * do not have the same size?

with the following code I expected to end with two ListBox with the same Width as they are into two columndefinition with With="*"

Instead of this looks like the size is determined from the size of the text up the ListBox which does not make sense as this text is much smaller than the ListBox and thus the TextBlock has enough space to accommodate the text.

<Window x:Class="UnderstandSizing.Window5"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window5" 
SizeToContent="WidthAndHeight"
ResizeMode="NoResize" >

<Grid>  
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

    <TextBlock Text="Text1longer" Grid.Row="0" Grid.Column="0" x:Name="Test1" />
    <TextBlock Text="Text1" Grid.Row="0" Grid.Column="2" />
    <ListBox Grid.Row="1" Grid.Column="0" Height="150" />

    <ListBox Grid.Row="1" Grid.Column="2" Height="150" />
    <TextBlock Grid.Row="2" Grid.ColumnSpan="3"  Text="This textblock sets the max width" Width="300" />
</Grid>
</Window>

enter image description here

The WPF automatic sizing feature is driving me mad ... any ideas? Thanks.

EDIT: Everything done in VS2008, just in case it matters.

like image 821
Ignacio Soler Garcia Avatar asked Feb 01 '12 17:02

Ignacio Soler Garcia


2 Answers

Look at this:

http://www.wpftutorial.net/GridLayout.html

"Star (*):

Takes as much space as available (after filling all auto and fixed sized columns), proportionally divided over all star-sized columns. So 3*/5* means the same as 30*/50*. Remember that star-sizing does not work if the grid size is calculated based on its content."

Which is the case in your code. I suspect this also is the reason it looked alright for others testing it, if they pasted the Grid into a Window larger than the 300 pixels set by your TextBlock. I get the same issue you do if I use exactly the same XAML.

Edit: So that's for the "why". See this question for a possible alternative solution: Wpf: Grid: How can i share column/row height width?

The most recent answer (not the one chosen by asker) seems to be the most useful one in this case.

like image 123
Alex A. Avatar answered Sep 21 '22 14:09

Alex A.


Alex. A found the exact cause of what is happening and I found a solution in a lucky strike. Just changing the * for 0 I get the expected result (weird if you ask me):

<Window x:Class="UnderstandSizing.Window5"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window5" 
SizeToContent="WidthAndHeight"
ResizeMode="NoResize" >

<Grid>  
<Grid.ColumnDefinitions>
    <ColumnDefinition Width="0" />
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition Width="0" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
    <RowDefinition Height="Auto" />
</Grid.RowDefinitions>

<TextBlock Text="Text1longer" Grid.Row="0" Grid.Column="0" x:Name="Test1" />
<TextBlock Text="Text1" Grid.Row="0" Grid.Column="2" />
<ListBox Grid.Row="1" Grid.Column="0" Height="150" />

<ListBox Grid.Row="1" Grid.Column="2" Height="150" />
<TextBlock Grid.Row="2" Grid.ColumnSpan="3"  Text="This textblock sets the max width" Width="300" />
</Grid>
</Window>
like image 40
Ignacio Soler Garcia Avatar answered Sep 22 '22 14:09

Ignacio Soler Garcia