You will have to excuse my lack of lingo since I am not a developer, I am a designer working in Blend with a developer on UI. Also apologize if I put this in the wrong forum. We are using the Aero theme (which we must use) and designing a hierarchical grid. The problem we are having is that with Aero theme, there is a brush fill that goes from white to gray to give that 3-D look on the headers. In the hierarchical grid, it gets confusing b/c there is no hard line to differentiate the headers from the data above with subsequent headers. We are trying to "trick" a hard line by applying a border to the header row that is the same color gray as the bottom outline and this will work to give the top of the headers that "hard line" (I hope I am making sense!).
The problem we are having is not with applying a border, but with a padding that is appearing in the columns. We just want the outline, not the inside line that is appearing (see the Class, and Class Description cells below, the first cell to the left is what we want it to look like sans the red color of course, but we colored it red just so it would stand out why we were working to find the solution and we will later change it to #D5D5D5 with value 1 thickness). Developer used the HeaderPresenter.
Can anyone help us out? Here is the code we added:
<Style x:Key="HeaderOutlineStyle" TargetType="{x:Type igDP:HeaderPresenter}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type igDP:HeaderPresenter}" > <Grid> <Border BorderBrush="Red" BorderThickness="2" /> <ContentPresenter Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" /> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style>
Here is another sample of what our grids currently look like and what we would like them to look like with the gray outline:
Thanks for any help.
Hi,
You have to edit the template of the DataRecordPresenter, which contains the HeaderPresenter. I am attaching a sample project. Let me know if you need any further assistance.
Thanks,
Diyan Dimitrov
Thank you so much Diyan for your reply! I appreciate it. We were able to add the following code from your sample and were able to see the lines on the top of the header rows, however, the header content is now totally missing. How do we get the header content to return?
Normal 0 false false false EN-US X-NONE X-NONE MicrosoftInternetExplorer4
<Style TargetType="{x:Type igDP:DataRecordPresenter}">
<Style.Triggers>
<Trigger Property="IsHeaderRecord" Value="True">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type igDP:DataRecordPresenter}" >
<Rectangle Fill="Gray" Grid.Row="0" Height="1"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
Thanks! Kris
Hi Kris,
You have to copy the whole template from the attached project, not only the Rectangle. This is the template copied form the DefaultStyles folder where your product is installed i.e. “C:\Program Files\Infragistics\NetAdvantage 2010.2\WPF\DefaultStyles\DataPresenter” and modified by adding two thin rectangles on top and bottom in the DataRecordPresenter. Let me know if you need any further assistance.
Hi Diyan,
I have a Hierarchical Grid with 3 levels. Since the 3rd level doesn't have child records its records are not properly indented. I tried to set the margin manually in the field layout of the 3rd level and it worked.
<igDP:FieldLayout.Settings>
<igDP:FieldLayoutSettings AllowDelete="True">
<igDP:FieldLayoutSettings.DataRecordPresenterStyle>
<Setter Property="Margin" Value="40,0,0,0" />
</igDP:FieldLayoutSettings.DataRecordPresenterStyle>
</igDP:FieldLayoutSettings>
</igDP:FieldLayout.Settings>
But if I use the above template(DataPresenter DefaultStyle) for having a rectangle in the headers, the margin (indentation) at 3rd level is removed.
How to set the margin to "40,0,0,0" when the nested level = 3 (using triggers) in the above DataPresenter default style.