Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Margins of ListViewItem top Margin visibly changes if it ListViewItem shrinks or grows. #8217

Open
ScottAtBarco opened this issue Feb 21, 2023 · 1 comment
Labels
area-Lists ListView, GridView, ListBox, etc bug Something isn't working team-Controls Issue for the Controls team

Comments

@ScottAtBarco
Copy link

Describe the bug

If I have any item in a ListView (or GridView) container change height size, e.g. as the result of a checkbox or toggle button changing, the space above the item shrinks if the item grows and grows if the item shrinks, seemingly ignore any Margin defined on the item.

Steps to reproduce the bug

    <ListView
    HorizontalAlignment="Left"
    Width="200"
    Margin="10"
    BorderBrush="Green"
    BorderThickness="1">
    <Grid
        BorderBrush="Red"
        BorderThickness="1"
        RowDefinitions="Auto,Auto">
        <CheckBox x:Name="CheckBox" Content="CheckBox" />
        <Rectangle
            Grid.Row="2"
            Width="50"
            Height="50"
            Fill="Blue"
            Visibility="{x:Bind CheckBox.IsChecked, Mode=OneWay}" />
    </Grid>
</ListView>

Expected behavior

The distance between a ListView item and its predecessor (or the top of the ListView if it's the first item) should not change when the height of the item changes.

Screenshots

image
image

NuGet package version

WinUI 3 - Windows App SDK 1.2.3: 1.2.230118.102

Windows version

Windows 10 (21H2): Build 19044

Additional context

ListBox doesn't have this problem (but it doesn't support drag-and-drop reordering out of the box so less desireable for my purposes).

With the XAML provided, checking/unchecking the box shows/hides the rectangle. It makes no difference if you wrap the Grid in the example in a ListViewItem. GridView has the same problem. I suspect TreeView might have this issue, but it's more complicated to construct a repro and its re-order behavior is cumbersome to use.

@ScottAtBarco ScottAtBarco added the bug Something isn't working label Feb 21, 2023
@gabbybilka gabbybilka added the needs-triage Issue needs to be triaged by the area owners label Mar 13, 2023
@bpulliam bpulliam added area-Lists ListView, GridView, ListBox, etc team-Controls Issue for the Controls team and removed needs-triage Issue needs to be triaged by the area owners labels Jul 7, 2023
@ranjeshj
Copy link
Contributor

This seems to be an issue with ListViewItem's layout. I can repro with this simpler scenario with just a stackpanel and ListviewItem

<StackPanel
HorizontalAlignment="Left"
Width="200"
Margin="10"
BorderBrush="Green"
BorderThickness="1">
    <ListViewItem>
        <Grid
    BorderBrush="Red"
    BorderThickness="1"
    RowDefinitions="Auto,Auto">
            <CheckBox x:Name="CheckBox" Content="CheckBox" />
            <Rectangle
        Grid.Row="2"
        Width="50"
        Height="50"
        Fill="Blue"
        Visibility="{x:Bind CheckBox.IsChecked, Mode=OneWay}" />
        </Grid>
    </ListViewItem>
</StackPanel>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area-Lists ListView, GridView, ListBox, etc bug Something isn't working team-Controls Issue for the Controls team
Projects
None yet
Development

No branches or pull requests

4 participants