How do I remove the spacing in a nested grid?

[Todd Davis]

http://screencast.com/t/NTI5ODBlOT

(See the pic above for an example)

I have a RadGridView with a ChildTableDefinition/HierarchyChildTemplate that includes another RadGridView.
                    <grid:RadGridView.HierarchyChildTemplate>
                        <DataTemplate>
                            <grid:RadGridView .... />

When I click the "+" and the nested table shows up, there is some empty border space around it with a gray background. See the linked pic if there is any ambiguity about this.

I'd prefer to not have that spacing there, but I'm not sure where it is coming from, so how do I get rid of it?

[Rossen Hristov]

Hi Todd Davis,

You can try to set a negative margin on the child grid. This will move it to the left and up.

Play around with the top and left margin numbers until you position it in a way that you like it.

For example:

<grid:RadGridView.HierarchyChildTemplate>
                        <DataTemplate>
                            <grid:RadGridView Margin="-5, -5, 0, 0".... />

I hope this helps.

Regards,
Ross
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Markus Wolff]

Hi, I've got a similar problem with the WPF version of that grid. I guess the structure is more or less the same.
Setting the child grid's margins to negative doesn't remove the border, ist just clips the left-/topmost n pixels from the grid.
Can't this be done by setting a style or the data template for the details presenter?

Kind regards
Markus

[Vanya Pavlova]

Hello Markus,

There is no need to predefine the template of DetailsPresenter. You may specify the background of the layout container that is used in the DataTemplate and 

<DataTemplate x:Key="dt">
        <StackPanel Background="LightCoral" Margin="-2,-2,-2,-2">
            <TextBlock Text="{Binding Property1}"/>
            <TextBlock Text="{Binding Property2}"/>
            <TextBlock Text="{Binding Property3}"/>
            <TextBlock Text="{Binding Property4}"/>
        </StackPanel>
        </DataTemplate>
    </UserControl.Resources>
    <Grid x:Name="LayoutRoot" Background="White" DataContext="{Binding Source={StaticResource SampleDataSource}}">
        <telerik:RadGridView GridLinesVisibility="None"  RowDetailsTemplate="{StaticResource dt}" RowDetailsVisibilityMode="Visible" ItemsSource="{Binding Collection}"/>
    </Grid>

The other option is to edit the template of DetailsPresenter in Expression Blend and to reset the BorderThickness properties of its outer and inner borders, please follow this link.


Kind regards,
Vanya Pavlova
the Telerik team

[Markus Wolff]

Hi Vanya,

thanks for your reply. My scenario is a little different:

<telerik:RadGridView x:Name="ParentGrid" ...>
   <telerik:RadGridView.Columns>
     ...
   </telerik:RadGridView.Columns>
   <telerik:RadGridView.ChildTableDefinitions>
   <telerik:GridViewTableDefinition/>
    </telerik:RadGridView.ChildTableDefinitions>
    <telerik:RadGridView.HierarchyChildTemplate>
      <DataTemplate>
        <telerik:RadGridView ...>
          ...
        </telerik:RadGridView>
      </DataTemplate>
   </telerik:RadGridView.HierarchyChildTemplate>
</telerik:RadGridView>

When the hierarchy child expands there is a thick grey border around the child grid. I am trying to remove this border.

[Vanya Pavlova]

Hi Markus,

 
Actually to achieve this result, you need to edit the template of GridViewRow. You have to find the border that hosts hierarchy container and to remove the default Padding set to 6. Please refer to the attached picture. 
In the same way you can change any of its properties in an appropriate manner.
You may use the attached project for further reference.
  

Best wishes,
Vanya Pavlova
the Telerik team

[Markus Wolff]

Thanks a lot, that does the trick. Seems one can't do without expression studio for long... ;-)

My application is still working on Framework 3.5 (customer won't upgrade until summer) which doesn't know about the VisualStateManager, could you provide an example for that too?

Kind regards
Markus

[Vanya Pavlova]

Hello Markus,

 
What version of Silverlight you are currently using? VisualStateManager is supported in Silverlight's versions 3 and 4. Generally, the Telerik support for Silverlight 3 has been discontinued.
Once you extract the style for GridViewRow in Expression Blend, find this Border element around PART_HierarchyChildPresenter and remove this default padding. 

All the best,
Vanya Pavlova
the Telerik team

[Markus Wolff]

Hi Vanya,

Well, I'm not using Silverlight at all,  it's WPF (as mentioned before). I know that I was supposed to switch to the respective forum but the thread title was just what I'm looking for. So you may move my replies to a new thread in the WPF area or I'll just open a new thread there...

Thanks for your support!

[Vanya Pavlova]

Hi Markus,

 
Please find attached a working project that demonstrates the previously described approach (WPF 3.5) using our latest official binaries.

Regards,
Vanya Pavlova
the Telerik team