My requirement is like I have a hierarchical xamdatagrid and I want a border for each parent row with its child rows

and each of the parent rows should have some blank spacing in between . I have attached the image for reference.  I also want to allow drag and drop functionality between the rows.  Please let me know how can I achieve this 

Hello Richa,

Both areas (the parent area and the children area) are surrounded by a red border by default and there is no Margin set between the parent record and the child records (including the label area) in the sample application from my previous reply.

Would you please provide me with more detailed information on what you are referring to as the unnecessary margin? Providing a custom image of the desired layout would be helpful as well.

If you have any questions, please let me know.

I have attached the image,  this is what I need,  it will be helpful if you can provide sample code for this

Thanks

Hello Richa,

Thank you for the image you have provided.

Based on the expansion indicators you have included, I presume you would like the parent record itself to serve as label area with fields (column names) for its child records, is that correct?

Since the layout of you have referred to should be adjusted based on the data that is used, would you please modify the last sample I had attached by including all the DataItem classes and an actual DataSource that will be used for the XamDataGrid? Having this information will help me further investigate this matter for you.

If you have any questions, please let me know.

I have attached my code

Hello Richa,

Thank you for the sample application you have provided.

I have attached a modified version of your sample by including the changes from my sample, so both the parent and its children have a border around them. You can use the UseNestedPanels property by setting it to True. This will render the child records as actual visual children (in a nested panel) of the parent DataRecordPresenter.

Please note when using the MetroDark theme, some further manipulations and logic should be done since the theme itself introduces lots of display and layout behaviors. In this case I can suggest you use the default styles of the control for the MetroDark theme and after retemplating the elements accordingly, you can include the theme files in your application.

I have attached a sample application that demonstrates the approach from above.
If you have any questions, please let me know.

Hello Richa,

In order to avoid using code-behind when applying the border around the child panel, I can suggest you create a ResourceDictionary that contains all the styles that are related to the Border and Margin manipulations. This way by including the dictionary inside the App.xaml, we can apply all the necessary settings at application level.

// Border around child panel (MyDictionary.xaml)

<Style TargetType="Border">
    <Style.Triggers>
        <Trigger Property="Name" Value="PART_NestedContentSite">
            <Setter Property="BorderBrush" Value="Red" />
            <Setter Property="BorderThickness" Value="1,0,1,1" />
        </Trigger>
    </Style.Triggers>
</Style>

<Application.Resources>        
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="MyDictionary.xaml" />
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>        
</Application.Resources>

Another approach I can suggest you is to get the default style of the respective elements (DataRecordPresenter, DataRecordCellArea, etc.) and manually modify them according to the desired functionality.

I have attached a sample application that demonstrates the initial approach from above. (I have commented some methods from the original code you have provided in order to build the application successfully, you can manually revert these changes.)

If you have any questions, please let me know.

Hi,

I need 1 more favor . Since my code is in MVVM framework, so can you please suggest how can I use ths code in MVVM, as below lines of code in xaml.cs file is violating the MVVM famework:

private void grdElementCollection_RecordExpanded(object sender, Infragistics.Windows.DataPresenter.Events.RecordExpandedEventArgs e)
{
var drp = DataRecordPresenter.FromRecord(e.Record) as DataRecordPresenter;
var nestedSite = Utilities.GetDescendantFromName(drp, "PART_NestedContentSite") as Border;
if (nestedSite != null)
{
nestedSite.BorderThickness = new Thickness(1, 0, 1, 1);
nestedSite.BorderBrush = Brushes.Red;
}
}

Hello Richa,

Thank you for your feedback.

I am glad to know that I was able to help you achieve the functionality you were looking for. I believe this thread can help other people looking for a similar solution.

Thank you for using Infragistics components.

Thia solution works well, thanks for all the help