Change color of rectangle in a cell in datagrid WPF VB.NET

Question

0.00/5 (No votes)

See more:

Hi people.
I have a DataGrid in WPF.
There are two columns in it.
All datas at the first column are a rectangle (I mean as Shape).
There is a button in the window, that when user hits the button, it fills the Rectangle of row 35, to Red.

But I don't know why VS gives me exception that it is nothing!

Would you please kindly help me on this?

What I have tried:

XML

<Window x:Class="MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:RectangleREF"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <DataGrid x:Name="DGEditing"
                  HorizontalAlignment="Stretch" 
                  VerticalAlignment="Stretch"
                  HorizontalContentAlignment="Stretch"
                  VerticalContentAlignment="Stretch"
                  AutoGenerateColumns="False">
            <DataGrid.Columns>
                <DataGridTemplateColumn Header="" IsReadOnly="True" Width="2*">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Rectangle Height="Auto" RadiusX="5" RadiusY="3.5" Fill="Black">
                            </Rectangle>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
                <DataGridTextColumn Header="Character" IsReadOnly="False" Width="22*" Binding="{Binding Path=CharacterName, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
            </DataGrid.Columns>
        </DataGrid>
        <Button Content="Button" HorizontalAlignment="Left" Margin="650,149,0,0" VerticalAlignment="Top" Height="91" Width="91" Click="Button_Click"/>
    </Grid>
</Window>

VB.NET

Class MainWindow
    Public Class TemporaryItemsClass
        Public Property Rct As Boolean
        Public Property CharacterName As String
    End Class
    Public TemporaryItems As New System.Collections.ObjectModel.ObservableCollection(Of TemporaryItemsClass)
    Sub New()
        InitializeComponent()
        For I As Integer = 1 To 1000
            TemporaryItems.Add(New TemporaryItemsClass With {
                .Rct = False,
                .CharacterName = "Number" & I
                })
        Next I
        DGEditing.ItemsSource = TemporaryItems
    End Sub
    Private Sub Button_Click(sender As Object, e As RoutedEventArgs)
        Dim row = TryCast(DGEditing.ItemContainerGenerator.ContainerFromIndex(35), DataGridRow)
        Dim cell = TryCast(DGEditing.Columns(0).GetCellContent(row), DataGridCell)
        Dim rectangle = TryCast(cell.Content, Rectangle)
        rectangle.Fill = Brushes.Red
    End Sub
End Class

Below is updated as Pete O'Hanlon said in first comment of solution 1:

VB.NET

Private Sub Button_Click(sender As Object, e As RoutedEventArgs)
    Dim row = TryCast(DGEditing.ItemContainerGenerator.ContainerFromIndex(35), DataGridRow)
    Dim cell As DataGridCell = GetCell(DGEditing, row, 0)
    Dim rectangle = TryCast(cell.Content, Rectangle)
    rectangle.Fill = Brushes.Red
End Sub
Private Function GetCell(dg As DataGrid, rowContainer As DataGridRow, column As Integer) As DataGridCell
    Dim returner
    If rowContainer IsNot Nothing Then
        Dim presenter = VisualTreeHelper.GetParent(rowContainer)
        Dim cell As DataGridCell = TryCast(dg.Columns(column).GetCellContent(presenter), DataGridCell)
        If cell IsNot Nothing Then returner = cell
    End If
    Return returner
End Function

Posted 13-May-24 2:23am

Sh.H.

Updated 13-May-24 9:26am

v6

Add a Solution

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Pete O'Hanlon · Answer 1 · 2024-05-13T04:56:00

Solution 1

Something that catches people out when they look at WPF is that they assume that there is a direct parent/child relationship between elements. So, you would think that the cell is the parent of the rectangle, which is not the case. What you need to do is take the parent control (the cell), and use something called the visual tree to find the child content (the rectangle) from the oarent (the cell). What you are looking for is the VisualTreeHelper[^] class

Posted 13-May-24 4:56am

Pete O'Hanlon

Comments

Sh.H. 13-May-24 15:18pm

@Pete O'Hanlon
Thanks for reply.
I updated as you said.
But the error is there yet.
Kindly please check the main question as I updated.

Pete O'Hanlon 14-May-24 3:05am

It's not just the cell that sits in the visual tree, it's the rectangle as well. So, once you have the cell, you have to use the visual tree to find the rectangle. Something to remember - your hunt for elements may need to be recursive.

Sh.H. 14-May-24 3:14am

@ Pete O'Hanlon
Thanks for explanation, but I could not figure out it.
Could you please kindly do me favor and make a sample code, so I understand your idea much better?
Thanks.

Pete O'Hanlon 14-May-24 3:58am

I'm not a Visual Basic developer so this might not be 100% correct, but you should be able to get the idea.

Public Function FindAncestorByType(Of T As {DependencyObject, New})( _
ByVal dependencyObject As DependencyObject) As T

Dim parent As DependencyObject = VisualTreeHelper.GetParent(dependencyObject)

If parent Is Nothing Then
Return Nothing
End If

Dim convertedParent As T = TryCast(parent, T)

If convertedParent Is Nothing Then
Return FindAncestorByType(Of T)(parent)
End If

Return convertedParent
End Function

Public Function FindDescendantByType(Of T As {DependencyObject, New})( _
ByVal dependencyObject As DependencyObject) As T

Dim child As DependencyObject = VisualTreeHelper.GetChild(dependencyObject)

If child Is Nothing Then
Return Nothing
End If

Dim convertedChild As T = TryCast(child, T)

If convertedChild Is Nothing Then
Return FindDescendantByType(Of T)(child)
End If

Return convertedChild
End Function

Using these calls, you can find the first instance of a particular type using the relevant call. So, if you wanted to find the DataGridCell from a child, you would call GetAncestorByType. To find the Rectangle, from an element higher in the visual tree you would call GetDescendantByType.

Sh.H. 15-May-24 1:06am

@Pete O'Hanlon
Thanks for the code.
I tried to use it in program, but it is too complicated. And I couldn't find out how can I use it in my own code.
Perhaps, I need to ask you to please kindly make a complete code. I beleive I will understand better and then I can use it in my code. Thank you very very much for this favor and thank you very very much for spending time for this.

Sh.H. · Answer 2 · 2024-05-15T00:24:00

Guys! I asked ai to generate a code.
This is its answer:

VB

Private Sub Button_Click(sender As Object, e As RoutedEventArgs)
    Dim row As DataGridRow = CType(DGEditing.ItemContainerGenerator.ContainerFromIndex(35), DataGridRow)
    Dim rectangle As Rectangle = FindVisualChild(Of Rectangle)(row)
    rectangle.Fill = Brushes.Red
End Sub

Private Function FindVisualChild(Of T As DependencyObject)(ByVal obj As DependencyObject) As T
    For i As Integer = 0 To VisualTreeHelper.GetChildrenCount(obj) - 1
        Dim child As DependencyObject = VisualTreeHelper.GetChild(obj, i)

        If child IsNot Nothing AndAlso TypeOf child Is T Then
            Return CType(child, T)
        Else
            Dim childOfChild As T = FindVisualChild(Of T)(child)

            If childOfChild IsNot Nothing Then
                Return childOfChild
            End If
        End If
    Next

    Return Nothing
End Function

But the problem is, after changing color, if I scroll, the red rectangle will change from his place.
And also some other cells also get to red !!!!
Anybody has an idea to correct it?