Help me find the hidden GridView styles

[Anton Swanevelder]

Hi,

I have been able to style almost everything except 3 little things and was wondering if someone can assist me to find where they are hidden.

Unfortunately you need to look at the picture here.. http://esite.co.za/portals/0/Capture.png

The three things I can't find:

• There is black border around the GroupPanelItem
• When you grouped the HeaderRowStyle have black blocks, I want them to be silver also
• Then there is a black border around the filter icon, anyway to change that?

Thanks in advance

[Kalin Milanov]

Hi Anton,

Straight to the styles you are looking for. 

1. If you look at the template of the GridViewGroupPanelItem you will notice there is a GridViewGroupPanelCell in it. Edit its template and then change the color of the inner (black) border.

2. Edit the template of the GridViewHeaderRow. In it you will find an IndentPresenter. In its item template you will find an element called GridViewHeaderIndentCell. This is the "black box". Edit its style / template to get the desired results.

3. In the template of the GridViewHeaderCell you will find a DistictFilterControl. In its template and you will find a ToggleButton (PART_DropDownButton) which contains the paths of the filter icon. The first one is the one you are looking for. Change its Fill and you should be good to go.

Kind regards,
Kalin Milanov
the Telerik team

[Anton Swanevelder]

Hi,

Thank you very much for this, really appreciate the excellent support.

Regards,

Anton

[Anton Swanevelder]

Hi Kalin,

I were able to complete 1 and 3 but have some issues with number 2:

Here are my steps:

- In Blend
- Edit HeaderRowStyle
- In HeaderRowStyle, create style for PART_IndentPresenter

That is where the trail ends, I only have a ItemTemplate with no GridViewHeaderIndentCell

The xaml is defined as follows

<ControlTemplate x:Key="IndentPresenterTemplate" TargetType="telerik:IndentPresenter">
        <Grid>
            <ItemsPresenter/>
        </Grid>
    </ControlTemplate>
    <DataTemplate x:Key="IndentPresenterItemTemplate">
        <telerik:GridViewIndentCell telerik:StyleManager.Theme="{StaticResource Theme}"/>
    </DataTemplate>
    <ItemsPanelTemplate x:Key="IndentPresenterItemsPanelTemplate">
        <StackPanel Orientation="Horizontal"/>
    </ItemsPanelTemplate>
    <Style x:Key="IndentPresenterStyle1" TargetType="telerik:IndentPresenter">
        <Setter Property="Template" Value="{StaticResource IndentPresenterTemplate}"/>
        <Setter Property="ItemTemplate" Value="{StaticResource IndentPresenterItemTemplate}"/>
        <Setter Property="ItemsPanel" Value="{StaticResource IndentPresenterItemsPanelTemplate}"/>
    </Style>

Can you maybe direct me where I go wrong.

Thanks

[Kalin Milanov]

Hi Anton,

In Blend - note there is a Edit Additional Templates section in the dropdown. This will let you edit the item template (see the screenshot attached).

I hope this helps.

Best wishes,
Kalin Milanov
the Telerik team

[Anton Swanevelder]

Genius, thanks got it!

[Otávio]

I'm having the same problem,
 I would like to change the same black border around the GroupPanelItem, but I'm using the default theme (office black) and I can't find its file GridViewHeaderCell.xaml.  What I'm doing is to change the properties into my usercontrol:

<Style TargetType="radGridView:GridViewHeaderCell" x:Key="MyHeaderCellStyle">

            <Setter Property="Background" Value="#EFEFEF" />
            <Setter Property="Foreground" Value="Black" />
            <Setter Property="FontWeight"  Value="Bold" />
            <Setter Property="BorderThickness" Value="0" />

</Style>

To apply:

<telerik:GridViewDataColumn DataMemberBinding="{Binding Nome}"
         UniqueName="gvcNome" Width="280"
         Header="Análises"
         HeaderCellStyle="{StaticResource MyHeaderCellStyle}" />

As you can see, simple changes that I need. But I can't do that the "GridView_HeaderInnerBorder" loses its BorderThickness (by default its value is 1). I could edit this property directly into the file, but I can't find this file (I'm using office black).

Any alternative way to do that ?! 


Thanks,
with regards
Otavio C.

[Kalin Milanov]

Hi Otávio,

To edit the inner border you will need to edit the cell template. When you do that in Blend a set of resources will be created and in this set of resources you can find the GridView_HeaderInnerBorder brush and change to color to whatever you line. Also I have made you a sample to get you started on this task. I hope it will be of help.

Sincerely yours,
Kalin Milanov
the Telerik team