Skip to main content

Ways to Access UI Elements and Their Controls

  • 10 minutes to read

This topic describes how to access UI elements such as Actions, View Items, List Editors, Property Editors, and their underlying controls.

Create a custom ViewController descendant (or a generic ViewController<ViewType> or ObjectViewController<ViewType, ObjectType>) and implement a solution from one of the following sections:

To access a Detail View in MasterDetailMode, use the EditView property.

Tasks with View Items and Property Editors

Get the ViewItem or Property Editor object

Use the CompositeView.FindItem(String) method in the overridden ViewController.OnActivated virtual method (recommended) or the ViewController.Activated event handler. The View Item’s name should match the corresponding Views | CompositeView | Items | ViewItem Model node’s ID property. The default Property Editor’s ID matches the property name.

Examples: Access the Dashboard Control | Open a Detail View When the Grid Row is Clicked in the Dashboard (WinForms and ASP.NET Web Forms)

Get View’s ViewItem objects collection

Use the CompositeView.Items property in the overridden ViewController.OnActivated virtual method (recommended) or the ViewController.Activated event handler.

Get all ViewItem objects of a specific type

Use the CompositeView.GetItems<T> method overridden ViewController.OnActivated virtual method (recommended) or the ViewController.Activated event handler.

Example: How to: Access the Report Preview Controls (ASP.NET Web Forms)

Access a custom View Item

To access a custom View Item inside a custom ViewController, use the following CustomizeViewItemControl methods:

Examples: Customize a Built-in Property Editor (WinForms) | Access the Settings of a Property Editor in a Detail View | Customize a Built-in Property Editor (Blazor) | Manage Button Visibility in a Blazor Lookup Property Editor

Access an embedded or nested View’s View Item

Use the NestedFrame.ViewItem property in the overridden ViewController.OnActivated virtual method (recommended) or the ViewController.Activated event handler.

Examples: How to: Initialize an Object Created Using the New Action | How to: Access Nested List View or Master Detail View Environment (ASP.NET Core Blazor and Windows Forms)

Customize a control of a Property Editor used both in a List and Detail View globally

Create a Property Editor’s descendant and customize it. Apply the custom Property Editor to target properties in Model Editor. You can also use this Property Editor for all properties of a specific type.

Examples: How to: Customize a Built-in Property Editor (ASP.NET Core Blazor | WinForms | ASP.NET Web Forms)

Access a ViewItem’s parent View

Use the ViewItem.View property overridden ViewController.OnActivated virtual method (recommended) or the ViewController.Activated event handler.

Access the Layout Control and its items

If you want to customize layout elements that include ListPropertyEditors (for example, change a caption or options of a parent tab group or page control), use techniques demonstrated in the following learning materials:

Tasks with List Editors

Get the ListEditor object

Use the ListView.Editor property in the overridden ViewController.OnActivated virtual method (recommended) or the ViewController.Activated event handler.

Example: How to: Access the Grid Component in a List View

Access a List Editor’s underlying control

XAF includes various platform-specific List Editors. Each editor has properties, methods, and events to access an editor’s control such as ListEditor.Control. Use the overridden ViewController.OnViewControlsCreated virtual method (recommended) or the ViewController.ViewControlsCreated | View.ControlsCreated event handler.

Examples:

Access a List Editor’s data cell control

A List Editor can instantiate an internal Property Editor to propagate settings to underlying data cell controls in view and edit modes. Use List Editor’s members or customize its underlying control directly as described in the control’s documentation. If you want to customize a control globally for List and Detail Views, refer to the Customize a control of a Property Editor used both in a List and Detail View globally section.

Examples: ComplexWebListEditor.FindPropertyEditor (Web Forms) | How to add an unbound column to GridListEditor (WinForms)

Access a Control in Tree List Editors

You can customize the TreeListEditor and CategorizedListEditor List Editors or the TreeList control exposed via the List Editor’s ListEditor.Control property.

To access a List Editor in code, create a View Controller and handle its ViewController.ViewControlsCreated event or override the OnViewControlsCreated protected method.

Access DxTreeListEditor (ASP.NET Core Blazor)

using DevExpress.ExpressApp;
using DevExpress.ExpressApp.Blazor.Editors;

namespace YourSolutionName.Blazor.Server.Controllers;
public class ColumnResizeModeViewController : ViewController<ListView> {
    protected override void OnViewControlsCreated() {
        base.OnViewControlsCreated();
        if (View.Editor is DxTreeListEditor treeListEditor) {
            treeListEditor.TreeListModel.ColumnResizeMode =
                DevExpress.Blazor.TreeListColumnResizeMode.ColumnsContainer;
        }
    }
}

Access TreeListEditor (Windows Forms)

using DevExpress.ExpressApp.TreeListEditors.Win;
using DevExpress.XtraTreeList;
using DevExpress.Persistent.Base.General;

namespace YourSolutionName.Win.Controllers;

public partial class TreeListController : ViewController {
    public TreeListController() {            
        TargetViewType = ViewType.ListView;
        TargetObjectType = typeof(ITreeNode);         
    }
    protected override void OnViewControlsCreated() {
        base.OnViewControlsCreated();
        ListView view = (ListView)View;
        TreeListEditor listEditor = (TreeListEditor)view.Editor;
        TreeList treeList = listEditor.TreeList;
        // Access the TreeList object here.           
    }
}

Access CategorizedListEditor (Windows Forms)

using DevExpress.ExpressApp.TreeListEditors.Win;
using DevExpress.XtraTreeList;
using DevExpress.Persistent.Base.General;

namespace YourSolutionName.Win.Controllers;

public partial class CategorizedListController : ViewController {
    public CategorizedListController() {            
        TargetViewType = ViewType.ListView;
        TargetObjectType = typeof(ICategorizedItem);         
    }
    protected override void OnViewControlsCreated() {
        ListView view = (ListView)View;
        CategorizedListEditor listEditor = (CategorizedListEditor)view.Editor;
        ListView categoriesListView = listEditor.CategoriesListView;
        TreeListEditor treeListEditor = (TreeListEditor)categoriesListView.Editor;
        TreeList treeList = treeListEditor.TreeList;
        // Implement the required changes here.    
    }
}

Access ASPxTreeListEditor (ASP.NET Web Forms)

XAF ASPxTreeList integration code is not designed to immediately show the new value of a Boolean property if it was changed on the server side. XAF does not immediately display updated values when changed via an Action. To reflect the changes without refreshing the page, use the following code:

using DevExpress.Web.ASPxTreeList;
using DevExpress.ExpressApp;
using DevExpress.ExpressApp.TreeListEditors.Web;
// ...
public class RemoveTreeListDataCellTemplateController : ViewController {
    public RemoveTreeListDataCellTemplateController() : base() { }
    protected override void OnActivated() {
        base.OnActivated();
        ListView listView = View as ListView;
        if (listView != null && listView.Editor != null) {
            listView.Editor.ControlsCreated += Editor_ControlsCreated;
        }
    }
    void Editor_ControlsCreated(object sender, EventArgs e) {
        ASPxTreeListEditor treeListEditor = sender as ASPxTreeListEditor;
        if (treeListEditor != null) {
            TreeListDataColumn column = 
                treeListEditor.TreeList.Columns["BoolProperty"] as TreeListDataColumn;
            if (column != null) {
                column.DataCellTemplate = null;
            }
        }
    }
}

This way the ASPxTreeList control uses the TreeListDataColumn to show Boolean values. For more information, refer to the following topic: TreeListDataColumn.DataCellTemplate.

Since Controllers are implemented in modules, add a reference to the TreeList Editors module to the required module. Set a reference to the DevExpress.XtraTreeList.v25.1.dll assembly as well.

Access a Scheduler Control in Code

Note

For more information about accessing the Scheduler control, refer to the following topic: How to: Access the Scheduler Control in Code.

Tasks with Complex View Items

Access a control of an Action included in a Detail View layout

To access an ActionContainerViewItem‘s control, follow the directions from the How to Add an Unbound Control (Button) to the Form Layout in an XAF View (with a Built-in ActionContainerViewItem) topic.

Access a ListPropertyEditor’s control (inside a NestedFrame’s List View)

  1. Use the CustomizeViewItemControl<T>(DetailView, Controller, Action<T>, String[]) method to access ListPropertyEditor‘s control and its nested List View.
  2. Handle the underlying List View’s View.ControlsCreated event. The additional event subscription may be required for complex View Items (like ListPropertyEditor, DetailPropertyEditor, DashboardViewItem), those control is a NestedFrame’s template and embeds a nested View with own controls.
  3. In the event handler, use ListView.Editor to get this Editor’s methods or properties (for example, GridListEditor.GridView) to access a control.

    The following snippet enables appearance customization for even grid rows in the nested List View:

    using DevExpress.ExpressApp;
    using DevExpress.ExpressApp.Editors;
    using DevExpress.ExpressApp.Win.Editors;
    using DevExpress.XtraGrid.Views.Grid;
    using MainDemo.Module.BusinessObjects;
    
    namespace MainDemo.Win.Controllers;
    
    public class MyViewController : ViewController<DetailView> {
        protected override void OnActivated() {
            base.OnActivated();
            View.CustomizeViewItemControl<ListPropertyEditor>(this, listPropertyEditor  => {
                listPropertyEditor.ListView.ControlsCreated += (s, e) => {
                    if (listPropertyEditor.ListView.Editor is GridListEditor gridListEditor) {
                        GridView gridView = gridListEditor.GridView;
                        gridView.OptionsView.EnableAppearanceEvenRow = true;
                    }
                };
            }, nameof(Employee.Tasks));
        }
    }
    

Access a DetailPropertyEditor’s or DashboardViewItem’s control

  1. Use the CustomizeViewItemControl<T>(DetailView, Controller, Action<T>, String[]) method to access DetailPropertyEditor and the CustomizeViewItemControl(DashboardView, Controller, Action<ViewItem>) method to access DashboardViewItem controls.
  2. In the event handler, use the DetailPropertyEditor‘s or DashboardViewItem‘s Frame property to access the NestedFrame object and its template control.
  3. Handle the DetailPropertyEditor‘s or DashboardViewItem‘s ViewItem.ControlCreated event.

    The following code snippet hides the actions toolbar for the Address1 Detail Property Editor of the Employee object when it is displayed in a nested frame:

    using DevExpress.ExpressApp;
    using DevExpress.ExpressApp.Editors;
    using DevExpress.ExpressApp.Templates;
    using MainDemo.Module.BusinessObjects;
    
    public class MyViewController : ObjectViewController<DetailView, Employee>  {
        protected override void OnActivated() {
            base.OnActivated();
            View.CustomizeViewItemControl<DetailPropertyEditor>(this, detailPropertyEditor => {
            if (detailPropertyEditor.Frame is NestedFrame nestedFrame
                && nestedFrame.Template is ISupportActionsToolbarVisibility template) {
                    template.SetVisible(false);
                    // NOTE: `template`, `detailPropertyEditor.Control`,
                    // and `nestedFrame.ViewItem.Control` refer to the same template control.
                }
            }, nameof(Employee.Address1));
        }
    }
    

Tasks with Actions

Access an Action

Use the Frame.GetController<ControllerType>() method to get the Action’s Controller and the Controller.Actions property to get the Action from this Controller. Refer to the following help topic to determine an Action identifier: Determine an Action’s Controller and Identifier.

Example: Controller.Actions

Platform-Specific Events for Control Customization

In Windows Forms or ASP.NET Web Forms applications, a View Item control or a List Editor control may not be ready for customization immediately after creation. If the technique described in this topic does not have the desired effect, handle platform-specific events listed below.

ASP.NET Core Blazor
XAF ASP.NET Core Blazor apps do no need specialized events to customize their underlying controls. However, you must use an EventCallback-based approach instead of handling regular C# events for underlying Blazor UI controls. In rare cases, you can also handle the DevExpress.ExpressApp.Blazor.Editors.Models.DxGridModel.ComponentInstanceCaptured event to access underlying component instance and its full API. For more information, refer to the Handle Component Events section.
Windows Forms:

The Control object’s HandleCreated, VisibleChanged, or ParentChanged event.

You can also handle Load or any similar event if the current control type exposes it.

ASP.NET Web Forms:

The Control object’s Load or Init server-side event.

Alternatively, you may need to handle the WebWindow.PagePreRender event. Use the CurrentRequestWindow static property to get the current WebWindow object.

If your application also requires customization on the client side, refer to the following topic for additional information: Client-Side Functionality.

Contact our Support Center if you need help.

Application Model-Specific Customizations

If you customize an existing control’s Application Model options, this customization does not affect the control until its next creation. Customize the control or its corresponding Application Model options before XAF creates and renders the control. For more information, refer to the following topic: Read and Set Values for Built-in Application Model Nodes in Code.

Familiarize Yourself with Underlying non-XAF Components First

  • Note that XAF uses DevExpress WinForms, ASP.NET WebForms, ASP.NET Core Blazor, DevExtreme components for each corresponding platform.
  • Research standard solutions for non-XAF components within DevExpress documentation, demos, code examples, and knowledge base articles. Feel free to use our search engine or Google. You have a higher chance to locate solutions in the component section of the DevExpress help system/docs than within XAF learning materials (that only describe XAF-related concepts).
  • If your case is not covered by DevExpress component learning materials, submit questions to the corresponding DevExpress Support Team.