DataGridCheckBoxColumn flickers

get-flat commented 2 years ago

Describe the bug

https://user-images.githubusercontent.com/74671895/141005297-59a8d014-fe60-4ee5-82cf-9449b9f1f6b0.mp4

Steps to Reproduce

source code: https://docs.microsoft.com/en-us/windows/communitytoolkit/controls/datagrid_guidance/datagrid_basics#binding-a-datagrid-to-a-data-source

Environment

NuGet Package(s): 7.1.1-preview3

Package Version(s):

Windows 10 Build Number:

[ ] Fall Creators Update (16299)
[ ] April 2018 Update (17134)
[ ] October 2018 Update (17763)
[ ] May 2019 Update (18362)
[x] May 2020 Update (19041)
[ ] Insider Build ({build_number})

App min and target version:

[ ] Fall Creators Update (16299)
[ ] April 2018 Update (17134)
[x] October 2018 Update (17763)
[ ] May 2019 Update (18362)
[ ] May 2020 Update (19041)
[ ] Insider Build ({build_number})

Device form factor:

[x] Desktop
[ ] Xbox
[ ] Surface Hub
[ ] IoT

Visual Studio version:

[ ] 2017 (15.{minor_version})
[ ] 2019 (16.{minor_version})
[x] 2022 (17.1)

Another scenario: (sorry I don't know how to highlight mouse clicks)

https://user-images.githubusercontent.com/74671895/141009865-f6ab2bc6-c0f9-400c-9dd6-1f2598094b5c.mp4

ghost commented 2 years ago

Hello get-flat, thank you for opening an issue with us!

I have automatically added a "needs triage" label to help get things started. Our team will analyze and investigate the issue, and escalate it to the relevant team if possible. Other community members may also look into the issue and provide feedback 🙌

Javier118 commented 2 years ago

How can I activate check?

ghost commented 2 years ago

This issue has been marked as "needs attention 👋" due to no activity for 15 days. Please triage the issue so the fix can be established.

michael-hawker commented 2 years ago

@duke7553 do you think this may be a similar issue to the one you fixed for templated columns in #4206?

FYI @RBrid

lukeblevins commented 2 years ago

@michael-hawker It does indeed seem similar. I wonder if my solution from before can be adapted to DataGridCheckboxColumn

michael-hawker commented 2 years ago

@duke7553 that's what I was wondering as well. Not sure if we have clear repro steps yet, though probably doesn't hurt to add a checkbox column to our sample and see if we can see the same issue. Is this something you're up for helping us investigate and take a look at or only once we have explicit repro steps? Thanks!

lukeblevins commented 2 years ago

No guarantees given my schedule, but I can probably take a look at it during the coming weeks and see if I can reproduce and fix it similar to the other bug.

Steps from the reporter would be 👌 too.

Javier118 commented 2 years ago

when I point to the checkbox the checkbox is not activated

Javier118 commented 2 years ago

this is code xaml The Datagrid version Microsoft.Toolkit.Uwp.UI.Controls 7.1.2 . does not have the same contribution as the video `<controls:DataGrid x:Name="DataGrid1"

            Grid.Row="1"
            Grid.Column="0"
            Grid.ColumnSpan="2"
            Margin="12"
            VerticalAlignment="Stretch"  HorizontalAlignment="Stretch"
            VerticalScrollBarVisibility="Visible"
            AlternatingRowBackground="Transparent"
            AlternatingRowForeground="Gray"
            AreRowDetailsFrozen="True"
            AutoGenerateColumns="False"
            CanUserReorderColumns="True"
            CanUserSortColumns="True"
            ColumnHeaderHeight="32"
            FrozenColumnCount="0"
            GridLinesVisibility ="None"
            HeadersVisibility="Column"
            IsReadOnly="True"
            RowDetailsVisibilityMode="Visible"
            SelectionMode="Single"
            RowGroupHeaderPropertyNameAlternative="Range">
            <controls:DataGrid.Columns>

                <controls:DataGridCheckBoxColumn x:Uid="Select_Header"    MaxWidth="100"/>

                <controls:DataGridTemplateColumn x:Uid="FotoHeader">
                    <controls:DataGridTemplateColumn.CellTemplate>

                        <DataTemplate x:DataType="local:PetTable">
                            <Image x:Name="MyImage" Source="{Binding Picture}"/>
                        </DataTemplate>
                    </controls:DataGridTemplateColumn.CellTemplate>

                </controls:DataGridTemplateColumn>

                <controls:DataGridTextColumn x:Uid="Tipo_mascotaHeader" Binding="{Binding PetType}"/>
                <controls:DataGridTextColumn x:Uid="Fecha_nacHeader" Binding="{Binding DuoDate, Mode=TwoWay}"/>
                <controls:DataGridTextColumn x:Uid="Nombre_Header" Binding="{Binding PetName}" Tag="Name"/>
                <controls:DataGridTextColumn x:Uid="RazaHeader" Binding="{Binding PetRace}" Tag="Race"/>
                <controls:DataGridTextColumn x:Uid="ColorHeader"  Binding="{Binding PetColor}" Tag="Color"/>
                <controls:DataGridTextColumn x:Uid="MicroChipHeader" Binding="{Binding PetChip}" Tag="Chip"/>
                <controls:DataGridTextColumn  x:Uid="GeneroHeader"  Binding="{Binding PetGender}" Tag="Sex"/>
                <controls:DataGridTextColumn x:Uid="EsterilizadoHeader" Binding="{Binding PetSterile}" Tag="Esterilizado"/>

            </controls:DataGrid.Columns>`

Javier118 commented 2 years ago

the problem is when I click on the checkbox comes out as in the video Captura de pantalla (44)

lukeblevins commented 2 years ago

@michael-hawker I looked into this more, and it seems like we need a reliable way to determine if focus has actually left the DataGrid. The loop we have here, doesn't seem to take into account template column cell content, and I'd bet the same is true for the other derived types of DataGridColumn such as the CheckBoxColumn.

My previous work appears to be more of a bandage over this problem. I also don't know enough about how Popups work in the visual tree to see if the CalendarDatePicker scenario is a one-off problem and that I'm wrong.

lukeblevins commented 2 years ago

if (this.EditingRow != null && this.EditingColumnIndex != -1)
{
      var editingColumn = this.ColumnsItemsInternal[this.EditingColumnIndex];
      isFocusedElementColumnChild = editingColumn.ContainsChild(focusedDependencyObject);
}

I don't think something like this would work either

Javier118 commented 2 years ago

if (this.EditingRow != null && this.EditingColumnIndex != -1)
{
      var editingColumn = this.ColumnsItemsInternal[this.EditingColumnIndex];
      isFocusedElementColumnChild = editingColumn.ContainsChild(focusedDependencyObject);
}

this code where it goes in the c #

lukeblevins commented 2 years ago

@michael-hawker Happy new year!

I've created a prototype to treat focused Popups as if they're an external editing element. This should show success with both types of DataGridColumns unlike my last fix which was specifically designed for DataGridTemplateColumns.

The prototype can be found here until I open a draft PR

Open questions:

Will this work with custom DataGridTemplateColumns that have focusable elements that don't represent editing elements.
Should we distinguish between Popups intended to act as DataGridColumn editing elements and those found elsewhere when focus is lost from the DataGrid control?
If so, how will we? (I found that Popups in this case often have a null Parent property)

Javier118 commented 2 years ago

Hello: Happy next year then with this code you could make checkbox work

DataGridCheckBoxColumn

I Have windows 11 y visuual studio 2019 con WTS

Javier118 commented 2 years ago

Reference in new i

@michael-hawker Happy new year!

I've created a prototype to treat focused Popups as if they're an external editing element. This should show success with both types of DataGridColumns unlike my last fix which was specifically designed for DataGridTemplateColumns.

The prototype can be found here until I open a draft PR

Open questions:

Will this work with custom DataGridTemplateColumns that have focusable elements that don't represent editing elements.

Should we distinguish between Popups intended to act as DataGridColumn editing elements and those found elsewhere when focus is lost from the DataGrid control?

If so, how will we? (I found that Popups in this case often have a null Parent property)

this code serves to fix the checkBox

Javier118 commented 2 years ago

checkbox can be used in DataGrid other than DataGridCheckBox

Javier118 commented 2 years ago

Hello: you know something about the CheckBox bug

Javier118 commented 2 years ago

Hello: if I use checkbox to delete rows you can use Row and Cell for Uwp

lukeblevins commented 2 years ago

@michael-hawker Going to open a PR for this soon. Can you assign me? Thanks!

Javier118 commented 2 years ago

hello:

how can I delete the Rows and Cells in Datagrid with checkbox in Sql Server?

lukeblevins commented 2 years ago

@Javier118 Sorry for the delay. I got around to authoring a fix for this today, which should be in PR now: #4511

CommunityToolkit / WindowsCommunityToolkit