tkawa
Topic Author
Posts: 18
Joined: 07 Nov 2018, 05:34

Grid doesn't layout according to the ColumnDefinition

06 Aug 2021, 08:52

Hi,

In the code below, blue column width does not become the specified value. And, Text is cut off.
This is a different behavior than WPF.
<Grid Grid.Row="1" Width="100" Height="100">
  <Grid>
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="*"/>
      <ColumnDefinition Width="70"/>
    </Grid.ColumnDefinitions>

    <Border Grid.Column="0" Background="Gray"/>
    <Border Grid.Column="1" Background="Blue"/>

    <TextBlock Grid.ColumnSpan="2" Background="Green" Height="50"
                TextWrapping="Wrap"
                FontSize="14"
                Text="123456789123456789"/>
  </Grid>
</Grid>
By the way, if you delete the TextBlock with the above code, it will be displayed as intended.
Do you know how to work around this issue?
Attachments
Grid_bug.png
Grid_bug.png (5.66 KiB) Viewed 9198 times
 
User avatar
sfernandez
Site Admin
Posts: 2984
Joined: 22 Dec 2011, 19:20

Re: Grid doesn't layout according to the ColumnDefinition

09 Aug 2021, 13:22

This is a bug, could you please report it in our bugtracker?
Unfortunately I can't find a workaround for that, the only way that pixel column is correctly sized is when star column requires more size:
<Grid>
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="*"/>
      <ColumnDefinition Width="40"/>
    </Grid.ColumnDefinitions>

    <Border Grid.Column="0" Background="Gray"/>
    <Border Grid.Column="1" Background="Blue"/>

    <TextBlock Grid.ColumnSpan="2" Background="Green" Height="50"
                TextWrapping="Wrap" FontSize="14" Text="123456789123456789"/>
</Grid>
 
tkawa
Topic Author
Posts: 18
Joined: 07 Nov 2018, 05:34

Re: Grid doesn't layout according to the ColumnDefinition

10 Aug 2021, 03:20

Thank you, I reported the issue here: https://www.noesisengine.com/bugs/view.php?id=2078
 
fnlombard
Posts: 3
Joined: 07 Sep 2021, 11:26

Re: Grid doesn't layout according to the ColumnDefinition

07 Sep 2021, 15:10

Hello,

I have encountered a similar issue and would like to know whether it is the same bug. It occurs when a grid layout has a child element with a RowSpan, and a ColumnDefinition has a star width. This element does not span across rows. Instead, it is placed in one of the rows and overwrites the RowDefinition's height. I replicated the bug using the Noesis XamlToy with the following code:
<Grid Grid.Row="0" Width="105" Height="105">
  <Grid>
    <Grid.RowDefinitions>
      <RowDefinition Height="Auto"/>
      <RowDefinition Height="5"/>
      <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="*"/>
      <ColumnDefinition Width="5"/>
      <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>
    
    <Border Grid.Column="0" Grid.Row="0" Background="Blue" Height="35"/>
    <Border Grid.Column="0" Grid.Row="2" Background="Blue" Height="35"/>

    <Border x:Name="SpanningElement" Grid.Column="2" Grid.Row="0" Grid.RowSpan="3" Background="Red" Height="50" Width="35"/>
  </Grid>
</Grid> 
This code produces the following layout:
BrokenGridLayout.png
BrokenGridLayout.png (532 Bytes) Viewed 3963 times
The "SpanningElement" is placed in the second row, does not span rows, and overwrites the RowDefinition's height.
 
User avatar
sfernandez
Site Admin
Posts: 2984
Joined: 22 Dec 2011, 19:20

Re: Grid doesn't layout according to the ColumnDefinition

07 Sep 2021, 17:58

In that example we are producing the same output as WPF so I guess it is a limitation of the Grid layout algorithm.

But considering that your rows are set to Auto or Pixel, you can ignore them and just use a StackPanel to place the blue rectangles:
<Grid Width="105" Height="105">
  <Grid>
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="*"/>
      <ColumnDefinition Width="5"/>
      <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>

    <StackPanel VerticalAlignment="Center">
      <Border Grid.Column="0" Grid.Row="0" Background="Blue" Height="35"/>
      <Border Grid.Column="0" Grid.Row="2" Background="Blue" Height="35" Margin="0,5,0,0"/>
    </StackPanel>

    <Border x:Name="SpanningElement" Grid.Column="2" Background="Red" Height="50" Width="35"/>
  </Grid>
</Grid>
Could that work for you?
 
fnlombard
Posts: 3
Joined: 07 Sep 2021, 11:26

Re: Grid doesn't layout according to the ColumnDefinition

08 Sep 2021, 17:34

Unfortunately not. This is not an issue with Noesis 2.2.6, only with Noesis 3.1.0.

The StackPanel would then require a vertical separator to keep the layout consistent. It will become convoluted if there are more rows and columns.
 
User avatar
sfernandez
Site Admin
Posts: 2984
Joined: 22 Dec 2011, 19:20

Re: Grid doesn't layout according to the ColumnDefinition

08 Sep 2021, 18:17

As I said we produce the same result as WPF in Noesis 3.0 and 3.1. We do that so what you design in Blend is what you get in Noesis.
gridspan.png
 
fnlombard
Posts: 3
Joined: 07 Sep 2021, 11:26

Re: Grid doesn't layout according to the ColumnDefinition

09 Sep 2021, 07:32

That makes sense, thank you for your informative feedback.

Who is online

Users browsing this forum: No registered users and 81 guests