From bbf366f830472627b82d78c47025174e22a2b7a9 Mon Sep 17 00:00:00 2001 From: Serge Pilipchuk <112853396+sergepilipchuk@users.noreply.github.com> Date: Tue, 29 Jul 2025 13:11:10 +0400 Subject: [PATCH 1/3] Update README file --- Readme.md | 65 ++++++++++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 59 insertions(+), 6 deletions(-) diff --git a/Readme.md b/Readme.md index dce606a..22b89af 100644 --- a/Readme.md +++ b/Readme.md @@ -4,18 +4,71 @@ [![](https://img.shields.io/badge/📖_How_to_use_DevExpress_Examples-e9f6fc?style=flat-square)](https://docs.devexpress.com/GeneralInformation/403183) [![](https://img.shields.io/badge/💬_Leave_Feedback-feecdd?style=flat-square)](#does-this-example-address-your-development-requirementsobjectives) - -*Files to look at*: + +# WPF Accordion Control - Bind to data through the ChildrenSelector property + +This example binds the [AccordionControl](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.class) to data using the [AccordionControl.ChildrenSelector](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector.property) property. + +Refer to the [Data Binding](https://documentation.devexpress.com/WPF/118635/Controls-and-Libraries/Navigation-Controls/Accordion-Control/Data-Binding) topic for more information. + +## Implementation details + +In this example, the [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) is bound to a flat list of `Category` objects. Each `Category` stores a collection of `Item` objects in its `Items` property. + +To build a hierarchical view from the flat structure, the [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) uses the [`ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector.property) property. This property is set to a custom implementation of the `IChildrenSelector` interface: + +```csharp +public class MySelector : IChildrenSelector { + public IEnumerable SelectChildren(object item) { + if (item is Category) + return ((Category)item).Items; + return null; + } +} +``` + +In XAML, the selector is declared as a static resource and assigned to the [AccordionControl.ChildrenSelector](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector.property) property: + +```xaml + + + +``` + +The [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) uses data templates to display `Category` and `Item` objects: + +```xaml + + + + + + + +``` + +## Files to Review * [MainWindow.xaml](./CS/ChildrenSelector/MainWindow.xaml) (VB: [MainWindow.xaml](./VB/ChildrenSelector/MainWindow.xaml)) * [ViewModel.cs](./CS/ChildrenSelector/ViewModel.cs) (VB: [ViewModel.vb](./VB/ChildrenSelector/ViewModel.vb)) - -# WPF Accordion Control - Bind to a data source that contains hierarchical data objects of different types -This example demonstrates how to bind the AccordionControl to data using the AccordionControl.ChildrenSelector property.
Refer to the Data Binding topic to learn more. +## Documentation -
+- [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) +- [AccordionItem](https://docs.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionItem) +- [AccordionViewMode](https://docs.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionViewMode) +- [AccordionControl.ChildrenSelector](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector.property) +- [Data Binding](https://documentation.devexpress.com/WPF/118635/Controls-and-Libraries/Navigation-Controls/Accordion-Control/Data-Binding) +- [MVVM Framework](https://docs.devexpress.com/WPF/15112/mvvm-framework) +## More Examples +- [ WPF Accordion Control - Bind to Hierarchical Data Structure](https://github.com/DevExpress-Examples/wpf-accordion-bind-to-hierarchical-data-structure) +- [WPF MVVM Framework - Use View Models Generated at Compile Time](https://github.com/DevExpress-Examples/wpf-mvvm-framework-view-model-generator) +- [WPF Dock Layout Manager - Bind the View Model Collection with LayoutAdapters](https://github.com/DevExpress-Examples/wpf-docklayoutmanager-bind-view-model-collection-with-layoutadapters) +- [WPF Dock Layout Manager - Bind the View Model Collection with IMVVMDockingProperties](https://github.com/DevExpress-Examples/wpf-docklayoutmanager-bind-view-model-collection-with-IMVVMDockingProperties) +- [WPF Dock Layout Manager - Populate a DockLayoutManager LayoutGroup with the ViewModels Collection](https://github.com/DevExpress-Examples/wpf-docklayoutmanager-display-viewmodels-collection-in-layoutgroup) ## Does this example address your development requirements/objectives? From 7756fcd961d31326abd9f79d50a37e8c7251e762 Mon Sep 17 00:00:00 2001 From: Serge Pilipchuk <112853396+sergepilipchuk@users.noreply.github.com> Date: Wed, 30 Jul 2025 11:20:59 +0400 Subject: [PATCH 2/3] Add changes after review (developer) --- Readme.md | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/Readme.md b/Readme.md index 22b89af..87120de 100644 --- a/Readme.md +++ b/Readme.md @@ -5,17 +5,19 @@ [![](https://img.shields.io/badge/💬_Leave_Feedback-feecdd?style=flat-square)](#does-this-example-address-your-development-requirementsobjectives) -# WPF Accordion Control - Bind to data through the ChildrenSelector property +# WPF Accordion Control - Bind to a data source that contains hierarchical data objects of different types -This example binds the [AccordionControl](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.class) to data using the [AccordionControl.ChildrenSelector](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector.property) property. +This example binds the [`AccordionControl`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl) to data objects of different types using the [`AccordionControl.ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector.property) property. Refer to the [Data Binding](https://documentation.devexpress.com/WPF/118635/Controls-and-Libraries/Navigation-Controls/Accordion-Control/Data-Binding) topic for more information. ## Implementation details -In this example, the [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) is bound to a flat list of `Category` objects. Each `Category` stores a collection of `Item` objects in its `Items` property. +The [`AccordionControl`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl) control uses the [`ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector) property to bind a flat list of `Category` objects. Each `Category` contains a collection of `Item` objects in its `Items` property. -To build a hierarchical view from the flat structure, the [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) uses the [`ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector.property) property. This property is set to a custom implementation of the `IChildrenSelector` interface: +To build a hierarchical view, the [`AccordionControl`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl) needs to access child items dynamically. However, the data structure uses different object types (`Category` and `Item`) that do not share a common base class with a unified `Children` property. In this reason you cannot use the [`ChildrenPath`](https://docs.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenPath) property to specify the child collection name. + +The [`AccordionControl`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl) control uses the [`ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector) property, which accepts a custom implementation of the `IChildrenSelector` interface. This technique allows the control to selectively return child items only for specific types: ```csharp public class MySelector : IChildrenSelector { @@ -27,7 +29,7 @@ public class MySelector : IChildrenSelector { } ``` -In XAML, the selector is declared as a static resource and assigned to the [AccordionControl.ChildrenSelector](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector.property) property: +In XAML, the selector is declared as a static resource and assigned to the [`AccordionControl.ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector) property: ```xaml @@ -37,7 +39,7 @@ In XAML, the selector is declared as a static resource and assigned to the [Acco ChildrenSelector="{StaticResource mySelector}" /> ``` -The [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) uses data templates to display `Category` and `Item` objects: +The [`AccordionControl`](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) uses data templates to display `Category` and `Item` objects: ```xaml @@ -64,6 +66,7 @@ The [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libra - [MVVM Framework](https://docs.devexpress.com/WPF/15112/mvvm-framework) ## More Examples + - [ WPF Accordion Control - Bind to Hierarchical Data Structure](https://github.com/DevExpress-Examples/wpf-accordion-bind-to-hierarchical-data-structure) - [WPF MVVM Framework - Use View Models Generated at Compile Time](https://github.com/DevExpress-Examples/wpf-mvvm-framework-view-model-generator) - [WPF Dock Layout Manager - Bind the View Model Collection with LayoutAdapters](https://github.com/DevExpress-Examples/wpf-docklayoutmanager-bind-view-model-collection-with-layoutadapters) From 622580193e14ebe63cd79be29f3b1229f7f07da0 Mon Sep 17 00:00:00 2001 From: Serge Pilipchuk <112853396+sergepilipchuk@users.noreply.github.com> Date: Fri, 1 Aug 2025 19:16:33 +0400 Subject: [PATCH 3/3] Add final changes after review (fresh eye) --- Readme.md | 37 ++++++++++++++++++++++++++----------- 1 file changed, 26 insertions(+), 11 deletions(-) diff --git a/Readme.md b/Readme.md index 87120de..c1b4953 100644 --- a/Readme.md +++ b/Readme.md @@ -7,45 +7,60 @@ # WPF Accordion Control - Bind to a data source that contains hierarchical data objects of different types -This example binds the [`AccordionControl`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl) to data objects of different types using the [`AccordionControl.ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector.property) property. +This example binds the WPF [`AccordionControl`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl) to a hierarchical data structure that includes objects of different types. Use this technique when your data model does not expose a unified child collection (for instance, when parent and child objects do not share a common base class). -Refer to the [Data Binding](https://documentation.devexpress.com/WPF/118635/Controls-and-Libraries/Navigation-Controls/Accordion-Control/Data-Binding) topic for more information. +The implementation leverages the [`ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector) property to retrieve child items at runtime. The standard [`ChildrenPath`](https://docs.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenPath) property cannot traverse mixed-type hierarchies. The [`ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector) property delegates child resolution to your custom logic. ## Implementation details -The [`AccordionControl`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl) control uses the [`ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector) property to bind a flat list of `Category` objects. Each `Category` contains a collection of `Item` objects in its `Items` property. +### Data Structure -To build a hierarchical view, the [`AccordionControl`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl) needs to access child items dynamically. However, the data structure uses different object types (`Category` and `Item`) that do not share a common base class with a unified `Children` property. In this reason you cannot use the [`ChildrenPath`](https://docs.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenPath) property to specify the child collection name. +The [`AccordionControl`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl) binds to a flat list of `Category` objects. Each `Category` contains a collection of `Item` objects in its `Items` property. -The [`AccordionControl`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl) control uses the [`ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector) property, which accepts a custom implementation of the `IChildrenSelector` interface. This technique allows the control to selectively return child items only for specific types: +```csharp +public class Category { + public string CategoryName { get; set; } + public ObservableCollection Items { get; set; } +} + +public class Item { + public string ItemName { get; set; } +} +``` + +### Custom Children Selector + +The custom selector (`MySelector`) implements the `IChildrenSelector` interface. The selector returns child items only for `Category` objects: ```csharp public class MySelector : IChildrenSelector { public IEnumerable SelectChildren(object item) { - if (item is Category) - return ((Category)item).Items; + if (item is Category category) + return category.Items; return null; } } ``` -In XAML, the selector is declared as a static resource and assigned to the [`AccordionControl.ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector) property: +### XAML Configuration + +Register the selector as a resource and assign it to the [`AccordionControl.ChildrenSelector`](https://documentation.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenSelector) property: ```xaml - ``` -The [`AccordionControl`](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) uses data templates to display `Category` and `Item` objects: +### Data Templates + +Define templates to display `Category` and `Item` objects: ```xaml -