Skip to main content

Customize the Properties Window in the End-User Report Designer

  • 4 minutes to read

This topic explains how you can customize the Office-inspired Properties window in the End-User Report Designer.

View Example: How to customize the Properties window in the End-User Report Designer

Move a Property to Another Tab

Original Result
PropertyGrid-MoveProperty-1 PropertyGrid-MoveProperty-2

Handle the static XtraReport.FilterComponentProperties event to access a property and apply the PropertyGridTab attribute to it. Pass the name of the property’s target tab as the attribute’s constructor parameter.

The following code snippet demonstrates how to move the “PaperKind” property to the “Appearance” tab.

using System;
using System.Windows.Forms;
using DevExpress.XtraReports.UI;
using DevExpress.XtraReports.UserDesigner;
using DevExpress.XtraReports.Localization;
// ...

public partial class Form1 : Form {

    public Form1() {
        InitializeComponent();
        XtraReport.FilterComponentProperties +=
         XtraReport_FilterComponentProperties;
    }

    private void XtraReport_FilterComponentProperties(object sender, 
     FilterComponentPropertiesEventArgs e) {
        PropertyDescriptor propertyDescriptor1 = 
            e.Properties["PaperKind"] as PropertyDescriptor;
        if(propertyDescriptor1 != null) {
            List<Attribute> attributes = new List<Attribute>(propertyDescriptor1.Attributes
                .Cast<Attribute>()
                .Where(att => !(att is PropertyGridTabAttribute)));
            attributes.Add(
                new PropertyGridTabAttribute(ReportStringId.UD_PropertyGrid_TabAppearance));
            e.Properties["PaperKind"] = TypeDescriptor.CreateProperty(
                propertyDescriptor1.ComponentType,
                propertyDescriptor1,
                attributes.ToArray());
        }
    }
}

If you pass a new tab name as the PropertyGridTab attribute’s constructor parameter and apply this attribute to a property, the Properties window creates the new tab and adds this property to it. The following code snippet demonstrates this:

using System;
using System.Windows.Forms;
using DevExpress.XtraReports.UI;
using DevExpress.XtraReports.UserDesigner;
// ...

public partial class Form1 : Form {

    public Form1() {
        InitializeComponent();
        XtraReport.FilterComponentProperties += 
            XtraReport_FilterComponentProperties;
    }

    private void XtraReport_FilterComponentProperties(object sender, 
     FilterComponentPropertiesEventArgs e) {
        PropertyDescriptor propertyDescriptor1 = 
        e.Properties["PaperKind"] as PropertyDescriptor;
        if(propertyDescriptor1 != null) {
            List<Attribute> attributes = new List<Attribute>(propertyDescriptor1.Attributes
            .Cast<Attribute>()
            .Where(att => !(att is PropertyGridTabAttribute)));
            attributes.Add(new PropertyGridTabAttribute("My tab"));
            e.Properties["PaperKind"] = TypeDescriptor.CreateProperty(
                propertyDescriptor1.ComponentType,
                propertyDescriptor1,
                attributes.ToArray());
        }
    }
}
Original Result
PropertyGrid-MoveProperty-3 PropertyGrid-MoveProperty-4

Provide a Custom Tab Icon

PropertyGrid-CustomTabIcon

Handle the XRDesignMdiController.DesignPanelLoaded event to access tab icons collection and add/replace an icon.

The code snippet below demonstrates how to provide an icon for the “My tab” Properties window tab.

using DevExpress.XtraReports.UI;
using DevExpress.XtraReports.UserDesigner;
using DevExpress.Utils.Svg;
using DevExpress.XtraReports.Design;
// ...

public partial class Form1 : Form {

    public Form1() {
        InitializeComponent();
        reportDesigner1.DesignPanelLoaded += 
            ReportDesigner1_DesignPanelLoaded;
    }

    private void ReportDesigner1_DesignPanelLoaded(object sender,
     DevExpress.XtraReports.UserDesigner.DesignerLoadedEventArgs e) {
        // Access the tab icon provider
        IPropertyGridIconsProvider propertyGridImagesProvider = 
            (IPropertyGridIconsProvider)e.DesignerHost.GetService(typeof(IPropertyGridIconsProvider));

        // Assign an svg icon to the "My tab" tab if it does not have any
        if(!propertyGridImagesProvider.Icons.ContainsKey("My tab")) {
            SvgImage customTabIcon = SvgImage.FromFile(@"..\..\CustomTabIcon.svg");
            propertyGridImagesProvider.Icons.Add("My tab", new IconImage(customTabIcon));
        }
    }
}