Grid panel strange behaviour

20 Nov 2015, 16:49

Hi

I have a problem with the Grid panel. I don't know if it is a bug or it is supposed to be this way.
The problem is that the TextBlock streches over the size of the grid cell.

Here is the code

<ListBox Grid.Column="1" DataContext="{StaticResource filesViewModel}" ItemsSource="{Binding Scenes}">
          <ListBox.ItemTemplate>
            <DataTemplate>
            <Grid Height="30" >
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="2*"/>
                    <ColumnDefinition Width="1*"/>
                    <ColumnDefinition Width="1*"/>
                    <ColumnDefinition Width="1*"/>
                    <ColumnDefinition Width="1*"/>
                    <ColumnDefinition Width="1*"/>
                    <ColumnDefinition Width="1*"/>
                </Grid.ColumnDefinitions>
                <TextBlock Grid.Column="0" Text="{Binding Name}" TextAlignment="Center" />
                <TextBlock Grid.Column="1" Text="{Binding Path=Players, Converter={StaticResource PlayersToTextConverter}}" TextAlignment="Center" />
                <TextBlock Grid.Column="2" Text="{Binding Path=Fitness, Converter={StaticResource IntegerToStarSxmbolConverter}}" TextAlignment="Center" />
                <TextBlock Grid.Column="3" Text="{Binding Path=Technics, Converter={StaticResource IntegerToStarSxmbolConverter}}" TextAlignment="Center"/>
                <TextBlock Grid.Column="4" Text="{Binding Path=Tactics, Converter={StaticResource IntegerToStarSxmbolConverter}}" TextAlignment="Center" Background="Green"/>
                <TextBlock Grid.Column="5" Text="{Binding Path=Fun, Converter={StaticResource IntegerToStarSxmbolConverter}}" TextAlignment="Center" Background="Red"/>
                <TextBlock Grid.Column="6" Text="{Binding Name}" Background="Blue" />        
            </Grid>
            </DataTemplate>
          </ListBox.ItemTemplate>
        </ListBox>

and this is the result
https://www.dropbox.com/s/s7o5bxh0qxvtc ... g.png?dl=0

20 Nov 2015, 19:31

Hi,

The behavior is correct, as Grid is inside the ListBox ScrollViewer, that initially asks the Grid to Measure with infinite available size, so text desired size is taken into account to calculate cell size.

Maybe you can use a binding to some reference element to ensure the size of any cell:

<Grid>

  <Grid Height="30" >
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="2*"/>
      <ColumnDefinition Width="1*"/>
      <ColumnDefinition Width="1*"/>
      <ColumnDefinition Width="1*"/>
      <ColumnDefinition Width="1*"/>
      <ColumnDefinition Width="1*"/>
      <ColumnDefinition Width="1*"/>
    </Grid.ColumnDefinitions>
    <Decorator x:Name="lastColumn" Grid.Column="6"/>
  </Grid>

  <ListBox Grid.Column="1" ItemsSource="{Binding Scenes}">
    <ListBox.ItemTemplate>
      <DataTemplate>
        <Grid Height="30" >
          <Grid.ColumnDefinitions>
            <ColumnDefinition Width="2*"/>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="1*"/>
            <ColumnDefinition Width="{Binding ActualWidth, ElementName=lastColumn}"/>
          </Grid.ColumnDefinitions>
          <TextBlock Grid.Column="0" Text="{Binding Name}" TextAlignment="Center" />
          <TextBlock Grid.Column="1" Text="{Binding Players...}" TextAlignment="Center" />
          <TextBlock Grid.Column="2" Text="{Binding Fitness...}" TextAlignment="Center" />
          <TextBlock Grid.Column="3" Text="{Binding Technics..}" TextAlignment="Center" />
          <TextBlock Grid.Column="4" Text="{Binding Tactics..}" TextAlignment="Center"... />
          <TextBlock Grid.Column="5" Text="{Binding Fun...}" TextAlignment="Center"... />
          <TextBlock Grid.Column="6" Text="{Binding Name}"... />
        </Grid>
      </DataTemplate>
    </ListBox.ItemTemplate>
  </ListBox>

</Grid>

This way all the items in your ListBox will share the same width for the last column.

23 Nov 2015, 08:33

Thank you for the solution

Grid panel strange behaviour Topic is solved

Grid panel strange behaviour

Re: Grid panel strange behaviour

Re: Grid panel strange behaviour

Who is online