Remove Border

[John]

How to remove following border from child grid

Also how to change, plus minus sign with arrow that used by group.

[Sweatha Bharathi]

Hi John,

Please find the answers to your queries below.

Queries	Responses
How to remove border for child grid	We have reviewed your query. To remove the border from the child grid, you can set the BorderThickness property to 0 for the DetailsViewDataGrid. Code snippet to remove the child grid border:  <Window.Resources>      <Style TargetType="syncfusion:DetailsViewDataGrid">          <Setter Property="BorderThickness" Value="0"/>      </Style>  </Window.Resources> Image Reference: Find the sample demo in the attachment.
How to change, plus minus sign with arrow that used by group.	We have reviewed your query and documented the solution in our knowledge base, which explains how to style the MasterDetailsView expander cell and icon.   The article also includes a downloadable sample for your reference. KB Link:  MasterDetailView ExpanderIcon

Please let us know if you have any concerns on this.

Regards,

Sweatha B

If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.

Attachment: Sample_e4eb07d8.zip

[John]

That arrow looks quite bad, its not same as the arrow that is being used by sample.

[Sweatha Bharathi]

John,

We suspect that you are referring to the expander and collapse icons, as shown in the image you provided. As mentioned earlier, we have documented a solution in our Knowledge Base that explains how to style the MasterDetailsView expander cell and icon.

Based on the Path property values, the appropriate icons will be displayed. However, if you wish to use change the icons, you can modify the Path property values for both the expand and collapse icons to match your desired icons.

Code snippet to change the expander and collapse icon:

 <Grid Background="{TemplateBinding Background}" Visibility="{TemplateBinding ExpanderIconVisibility}" Margin="{TemplateBinding Padding}">

     <Path Margin="7" x:Name="PART_CollapseCellPath"

                      Width="{TemplateBinding Width}"

                      Height="{TemplateBinding Height}"

                      HorizontalAlignment="Center"

                      VerticalAlignment="Center"

                      Data="M0.68398996,0 L6.2700001,4.9960007 0.66699173,10.007999 0,9.2629985 4.7700011,4.9960007 0.016998228,0.74499984 z"

                      Fill="{TemplateBinding Foreground}"

                      SnapsToDevicePixels="True"

                      Stretch="Uniform"

                      Stroke="{TemplateBinding Foreground}"

                      UseLayoutRounding="False">

         <Path.RenderTransform>

             <TransformGroup>

                 <TransformGroup.Children>

                     <RotateTransform Angle="360" CenterX="4" CenterY="4" />

                 </TransformGroup.Children>

             </TransformGroup>

         </Path.RenderTransform>

     </Path>

     <Path x:Name="PART_ExpanderCellPath" Margin="7"

           Width="{TemplateBinding Width}"

           Height="{TemplateBinding Height}"

           HorizontalAlignment="Center"

           VerticalAlignment="Center"

           Data="M0.74499548,0 L5.0119957,4.7700001 9.2630047,0.017000169 10.008001,0.68400005 5.0119957,6.2700001 0,0.66699985 z"

           Fill="{TemplateBinding Foreground}"

           SnapsToDevicePixels="True"

           Stretch="Uniform"

           Visibility="Collapsed"

           Stroke="{TemplateBinding Foreground}"

           UseLayoutRounding="False">

         <Path.RenderTransform>

             <TransformGroup>

                 <TransformGroup.Children>

                     <RotateTransform Angle="0" CenterX="4" CenterY="4" />

                 </TransformGroup.Children>

             </TransformGroup>

         </Path.RenderTransform>

     </Path>

 </Grid>

Image Reference:

Find the modified sample demo in the attachment and let us know if you have any concerns on this.

Note: You can customize the Path property values based on your specific icon requirements. Additionally, you can adjust the angle, height, and width of the icons according to your needs.

If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.

Attachment: Modifed_demo_e6a61acf.zip

[Betancourt Migs]

@slope For border removal, adding BorderBrush="Transparent" alongside BorderThickness ensures cleaner rendering. The KB approach works well – ensure icon sizing aligns with your grid's density

[Sweatha Bharathi]

Hi Betancourt Migs ,

Thank you for informing us—it works! Additionally, we appreciate your suggestion. Should you encounter any further issues, please don’t hesitate to reach out to us.

Regards,

Sweatha B