Can you guys add an option to collapse the layout groups that are used in xaf applications?
How do I provide the capability to collapse or expand layout groups and persist their state?
Answers approved by DevExpress Support
Hi Charles,
Thanks for the suggestion. We will take it into account. For now, it's possible to implement this feature yourself:
v19.2+
With XAF v19.2, the new platform-agnostic options - IModelLayoutGroup.IsCollapsibleGroup and IModelLayoutGroup.IsGroupCollapsed - are available to control this behavior for both WinForms and ASP.NET apps. For more information on how it affects the former ASP.NET Application Model options, see this breaking change.
For older versions or custom-tailored implementations when the standard solution is not suitable, consider the options below.
ASP.NET:
v15.2 - v19.1
The new XAF web UI provides a built-in solution for this task. You can enable it for required layout groups in the Model Editor via the new IsCollapsibleCardGroup option at the Views | <DetailView> | Layout level.
Prior to v15.2
To accomplish this task, you need to create a custom LayoutManager and custom LayoutItemTemplate, LayoutGroupTemplate or TabbedGroupTemplate templates as demonstrated in the FeatureCenter demo (%Public%\Documents\DevExpress Demos 1X.X\Components\eXpressApp Framework\FeatureCenter\CS\FeatureCenter.Module.Web\Layout). For instance, you can inherit from the existing WebLayoutManager class and override the CreateLayoutGroupTemplate method to return a custom template for layout groups. The original method returns a LayoutGroupTemplate instance that creates a simple HTML table for the group header and puts nested layout items just below it in the same container. You can create a LayoutGroupTemplate descendant and override the LayoutContentControls method to create a collapsible group with the help of a script or custom control. In the simplest case, it is possible to use our ASPxNavBar control our ASPxRoundPanel with its ShowCollapseButton = True.
WinForms:
Prior to v19.2
You can access the LayoutControl and set its LayoutControlGroup.ExpandXXX properties either in a ViewController or a custom WinLayoutManager descendant. To save and control the expandable state of required layout groups via the Model Editor, extend the IModelWinLayoutGroup interface with custom options as described in the eXpressApp Framework > Task-Based Help > How to: Extend the Application Model help topic. Handle the View.ModelSaved event to write the expanded state from the control to the Application Model. Refer to the Model.DesignedDiffs.xafml and ExpandableLayoutGroupViewController.cs files under the WinForms module project in the dxSampleS135134_WinForms_C#.zip archive for more details:
C#using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using DevExpress.ExpressApp;
using DevExpress.ExpressApp.Model;
using DevExpress.ExpressApp.Win.Layout;
using DevExpress.ExpressApp.Win.SystemModule;
using DevExpress.Utils;
using DevExpress.XtraLayout;
namespace YourSolutionName.Module.Win.Controllers {
public partial class ExpandableLayoutGroupViewController : ViewController<DetailView>, IModelExtender {
Dictionary<string, IModelWinLayoutGroupExtender> itemToWinModelLayoutGroupExtenderMap = new Dictionary<string, IModelWinLayoutGroupExtender>();
WinLayoutManager winLayoutManager = null;
protected override void OnActivated() {
base.OnActivated();
winLayoutManager = View.LayoutManager as WinLayoutManager;
if(winLayoutManager != null) {
winLayoutManager.ItemCreated += ExpandableLayoutGroupViewControllercs_ItemCreated;
if(winLayoutManager.Container != null) {
winLayoutManager.Container.HandleCreated += Container_HandleCreated;
}
View.ModelSaved += View_ModelSaved;
}
}
void Container_HandleCreated(object sender, EventArgs e) {
LayoutControl lc = ((LayoutControl)sender);
lc.BeginUpdate();
foreach(BaseLayoutItem item in lc.Items) {
if((item is LayoutControlGroup) && itemToWinModelLayoutGroupExtenderMap.ContainsKey(item.Name)) {
((LayoutGroup)item).Expanded = itemToWinModelLayoutGroupExtenderMap[item.Name].Expanded;
((LayoutGroup)item).HeaderButtonsLocation = itemToWinModelLayoutGroupExtenderMap[item.Name].HeaderButtonsLocation;
((LayoutGroup)item).ExpandButtonVisible = true;
((LayoutGroup)item).ExpandOnDoubleClick = true;
}
}
lc.EndUpdate();
}
void ExpandableLayoutGroupViewControllercs_ItemCreated(object sender, ItemCreatedEventArgs e) {
if(e.ModelLayoutElement is IModelWinLayoutGroup) {
IModelWinLayoutGroupExtender modelLayoutGroupExtender = (IModelWinLayoutGroupExtender)e.ModelLayoutElement;
if((modelLayoutGroupExtender).Expandable) {
itemToWinModelLayoutGroupExtenderMap.Add(e.Item.Name, (IModelWinLayoutGroupExtender)e.ModelLayoutElement);
}
}
}
void View_ModelSaved(object sender, EventArgs e) {
foreach(BaseLayoutItem item in winLayoutManager.Container.Items) {
if((item is LayoutControlGroup) && itemToWinModelLayoutGroupExtenderMap.ContainsKey(item.Name)) {
itemToWinModelLayoutGroupExtenderMap[item.Name].Expanded = ((LayoutGroup)item).Expanded;
}
}
}
protected override void OnDeactivated() {
if(winLayoutManager != null) {
winLayoutManager.ItemCreated -= ExpandableLayoutGroupViewControllercs_ItemCreated;
if(winLayoutManager.Container != null) {
winLayoutManager.Container.HandleCreated -= Container_HandleCreated;
winLayoutManager = null;
}
View.ModelSaved -= View_ModelSaved;
}
itemToWinModelLayoutGroupExtenderMap.Clear();
base.OnDeactivated();
}
public void ExtendModelInterfaces(ModelInterfaceExtenders extenders) {
extenders.Add<IModelWinLayoutGroup, IModelWinLayoutGroupExtender>();
}
}
public interface IModelWinLayoutGroupExtender {
[DefaultValue(true)]
bool Expanded { get; set; }
[DefaultValue(true)]
bool Expandable { get; set; }
[DefaultValue(GroupElementLocation.Default)]
GroupElementLocation HeaderButtonsLocation { get; set; }
}
}
Hello,
This functionality is not available in our Blazor Form Layout component. Thus, there is no simple solution for XAF. I described a workaround in the following ticket: Blazor - How to create collapsible layout groups (the IsCollapsibleGroup setting in the Model Editor).
In v22.2, you can expand/collapse Layout groups in XAF Blazor. Activate the IsCollapsibleGroup option to enable this feature. Use the IsGroupCollapsed property to specify the group's expand/collapse state in code.