Style GanttTask Event highlight background

[Trystan]

HI,

I would like to know if there is a way to change the color of an event's background when it is highlighted/hovered over and when it is selected, preferably without having to resort to creating a ControlTemplate.  Right now, I know how to change every other property of the event within a intrinsic style for EventContainer, and using style triggers i can change these properties depending on the state of the event.  However, the Background property doesn't appear to work when using triggers.  An example:  Here is my EventContainer Style:

<Style TargetType="g:EventContainer">
    <Setter Property="Background" Value="Green"/>
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Foreground" Value="Red"/>
            <Setter Property="BorderThickness" Value="0"/>
        </Trigger>
        <Trigger Property="IsFocused" Value="True">
            <Setter Property="Foreground" Value="Red"/>
            <Setter Property="BorderThickness" Value="0"/>
            <Setter Property="Background" Value="Blue"/>
        </Trigger>
    </Style.Triggers>
</Style>

When the event is hovered over, the title text of the event correctly changes from white to red, as defined in the style, but when the event is selected, the background does not change from green to blue.  As I stated, I would like to avoid using ControlTemplate if it is possible, as ControlTemplates require a lot of extra useless markup, and a knowledge of the underlying infrastructure, which is impossible to get for the Telerik libraries.  

[Ventzi]

Hello Trystan,

You could use the implicit styles which are described in details in this article. Following the implicit styles approach you need to change the background property of the RowHighlightContainer, TreeCellHighlightContainer, CellHighlightContainer and the RowSelectionContainer containers.
For example:

<Style TargetType="telerik:RowSelectionContainer" BasedOn="{StaticResource RowSelectionContainerStyle}">
   <Setter Property="Background" Value="Blue"/>
</Style>

You could read more about the RadGanttView containers here.

Hope this helps. 

Regards,
Ventzi
Telerik

[Trystan]

I am in fact currently using implicit styles already, and have read the specified article on it before.  Also, changing the row highlight, cell or tree cell highlight, or the row selection styles do not change the background of the actual event object that is displayed on the Gantt chart.  So far as I can tell, the only way to change those is in the EventContainer style, and as I have stated above, doing so does work in all cases except for changing the object's background container when it is hovered over or selected.  Attached is a few images describing what I mean.  In these images, I show the three states that an event display object can have: default, highlighted/hovered, or selected.  In the default, the event is green, as is expected as that is what my style specifies.  However, the highlighted event is a gradient pale yellow, and this does not change even if I set the background in the style under the IsMouseOver trigger.  Note however that the foreground text is red, which is correct as I do set the foreground to be red in the IsMouseOver style trigger (the default color is black).  Likewise, when an event is selected, the background is a gradient orange, which is not correct as I set the background to be blue in my EventContainer style under the IsFocused trigger.  Again, note however that the text foreground color is red, which again shows that my style trigger is working as I stated that the foreground color be red under the IsFocused trigger (the default is black).    So I reiterate my question: Is there a way to set the background of the event object when it is hovered or selected without resorting to messy custom ControlTemplate stuff?  It is apparent that normally, I should be able to do this, as every other property such as Foreground or border colors works and can be changed, but the background property does not.

[Ventzi]

Hello Trystan,

If you are already using implicit style you could easily change the Background property of the EventContainer by changing the brushes in the theme for the highlight and selected state of this container. The name of the brush for the selection state is EventBackground_Selected and for mouse over state EventBackground_MouseOver. The are also EventBackground_Highlighted and inner and outer border brushes for the both states. Respectively you could change the brushes for the Summary and Milestone task. If you like to change also the background on the left side (the grid section) you should use the approach in my previous post.

For more convenience I've prepared a sample project which you could find attached.

Regards,
Ventzi
Telerik