RadProgressBarElement in custom GridDataCellElement: Unable to change color of Indicator

[Marco]

Hello,

I have made a custom GridDataCellElement, following the custom cell documentation. I wish to change the color of the indicator when the value of my Cell is set (SetContentCore) but the theme (Office2010Silver) value are always here.

I think I miss something but what ?

Private Class ProcessProgressionColumn
            Inherits GridViewDataColumn

            Public Sub New(ByVal UniqueName As String, ByVal fieldName As String)
                MyBase.New(UniqueName, fieldName)
            End Sub

            Public Overrides Function GetCellType(row As Telerik.WinControls.UI.GridViewRowInfo) As System.Type
                If TypeOf row Is GridViewDataRowInfo Then
                    Return GetType(ProcessProgressionCellElement)
                End If
                Return MyBase.GetCellType(row)
            End Function
        End Class

        Private Class ProcessProgressionCellElement
            Inherits GridDataCellElement

            Public Sub New(ByVal column As GridViewColumn, ByVal row As GridRowElement)
                MyBase.New(column, row)
            End Sub

            Protected Overrides ReadOnly Property ThemeEffectiveType As System.Type
                Get
                    Return GetType(GridDataCellElement)
                End Get
            End Property

            Public Overrides Function IsCompatible(data As Telerik.WinControls.UI.GridViewColumn, context As Object) As Boolean
                Return TypeOf data Is ProcessProgressionColumn AndAlso TypeOf context Is GridDataRowElement
            End Function

            Private StateProgress As RadProgressBarElement

            Protected Overrides Sub CreateChildElements()
                MyBase.CreateChildElements()

                StateProgress = New RadProgressBarElement() With {.Maximum = 4}
                Me.Children.Add(StateProgress)
            End Sub

            Protected Overrides Sub SetContentCore(ByVal value As Object)
                If value IsNot Nothing AndAlso value IsNot DBNull.Value Then
                    Me.StateProgress.Value1 = If(value > 0, value, 0)
                    Me.StateProgress.Value2 = If(value < 0, Me.StateProgress.Maximum, 0)
                    Me.StateProgress.Text = helper.GetDescription(CType(value, Process_Prospection.StatuProspection))
                    Me.StateProgress.IndicatorElement1.BackColor = If(value <> 4, Color.FromArgb(153, 238, 158), Color.FromArgb(153, 225, 238))
                    Me.StateProgress.IndicatorElement1.BackColor2 = If(value <> 4, Color.FromArgb(8, 208, 4), Color.FromArgb(4, 187, 208))
                    Me.StateProgress.IndicatorElement1.BackColor3 = If(value <> 4, Color.FromArgb(4, 208, 51), Color.FromArgb(4, 159, 208))
                    Me.StateProgress.IndicatorElement1.BackColor4 = If(value <> 4, Color.FromArgb(160, 238, 153), Color.FromArgb(153, 219, 238))
                End If
            End Sub
        End Class

[Ivan Petrov]

Hello Marco,

Thank you for writing.

I copy-pasted your code inside a project and added your custom column to a grid. After running the project I got a result which if I understand your logic correctly should be the desired look. I have attached a video of the test on my machine. If this is not what you want to achieve, I would kindly ask you to send me some more details on the result you are looking for - a screen shot or a sketch would be very useful in that matter.

I hope this will be useful. Do not hesitate to write back with any further questions.

Greetings,
Ivan Petrov
the Telerik team

[Marco]

Hello Ivan,

Thank for your writing and your video.

The result show in the video is exactly the desired look for my custom column.

I have attached a screenshot of my gridview which contains my customcolumn. You can see it in the purple square 1. It's not the same green and it's not getting blue when it's full filled. The colors are stuck on the Office 2010 Silver Theme. Do you have any idea (or need more information).

I have also a bonus question about the blue square 2. How could I add a scrollbar on a textcell if the text doesn't fit Inside ?

 (By the way which do you use for making your screen video ? It gave me some idea for my final user :-))

[Ivan Petrov]

Hi Marco,

Thank you for writing back.

What happens with the progress bar is that in the Office2010 themes the progress indicator has an ImageShape applied which is drawn on top of the FillPrimitive. The colors you specify are applied but since the ImageShape is drawn over them you see only the ImageShape. To remove it you can set it to Nothing when you create the progress bar element:

Protected Overrides Sub CreateChildElements()
    MyBase.CreateChildElements()

    StateProgress = New RadProgressBarElement() With {.Maximum = 4}
    StateProgress.IndicatorElement1.BackgroundShape = Nothing
    Me.Children.Add(StateProgress)
End Sub

For the address cell you can increase the row height to show the whole text or you can insert a RadTextBoxControlElement in the cell and set its Multiline property to true. You can also set the DrawFill and DrawBorder properties to false to get the same formatting as the actual cell.

The software I used to make and edit the video is Camtasia Studio by Techsmith.

I hope this will help. Do not hesitate to write back with further questions.

All the best,
Ivan Petrov
the Telerik team

[Marco]

Hi Ivan,

Thank for your explanation about the BackgroundShape.

Don't know if it is the correct behavior but I have to remove the backgroundshape (and also have to set drawfill to true and change the number of color) in the override of SetContentCore. The change made in CreateChildElements have no effect.

I will test the solution for the address cell when I will found some time for it !

And last but not least. Thanks for sharing information about Camtasia Studio.

[Ivan Petrov]

Hi Marco,

Thank you for your reply.

You can use the SetValueCore method or the element constructor. The CreateChildElements and InitializeFields methods are actually executed before the constructor of the element and themes are applied afterward. Any values set before the constructor will be overwritten by the theme. However if you set these properties in the constructor the theme should not overwrite them and you will set them only once as opposed to every value change (if you use SetValueCore).

I hope you will find this useful. Do not hesitate to write back with further questions.

Kind regards,
Ivan Petrov
the Telerik team