From 8f1faac6b58a146fd758c4c960dac51e0a32fe01 Mon Sep 17 00:00:00 2001 From: Serge Pilipchuk <112853396+sergepilipchuk@users.noreply.github.com> Date: Mon, 16 Jun 2025 10:17:46 +0400 Subject: [PATCH 1/5] Update the Readme file --- Readme.md | 32 +++++++++++++++++++++++++------- 1 file changed, 25 insertions(+), 7 deletions(-) diff --git a/Readme.md b/Readme.md index 90e1f07..431014c 100644 --- a/Readme.md +++ b/Readme.md @@ -4,19 +4,37 @@ [![](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 Hierarchical Data Structure + +This example binds Accordion Control to Hierarchical Data Structure. + +## Implementation Details + +... + +## Files to Review * [MainViewModel.cs](./CS/DXSample/ViewModels/MainViewModel.cs) (VB: [MainViewModel.vb](./VB/DXSample/ViewModels/MainViewModel.vb)) -* **[MainView.xaml](./CS/DXSample/Views/MainView.xaml) (VB: [MainView.xaml](./VB/DXSample/Views/MainView.xaml))** - -# How to: Bind AccordionControl to Hierarchical Data Structure +* [MainView.xaml](./CS/DXSample/Views/MainView.xaml) (VB: [MainView.xaml](./VB/DXSample/Views/MainView.xaml)) +## Documentation -This example demonstrates how to bind Accordion Control to Hierarchical Data Structure. +- [Accordion Control](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) +- [MVVM Framework](https://docs.devexpress.com/WPF/15112/mvvm-framework) -
+## More Examples +- [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) +- [Add the Loading Decorator to the Application with the MVVM Structure](https://github.com/DevExpress-Examples/wpf-display-loading-decorator-in-manual-mode-with-mvvm) +- [WPF Hamburger Menu Control - Navigate Between the MVVM Views](https://github.com/DevExpress-Examples/wpf-hamburger-menu-with-mvvm) +- [Reporting for WPF - How to Use ViewModel Data as Report Parameters in a WPF MVVM Application](https://github.com/DevExpress-Examples/reporting-wpf-mvvm-viewmodel-data-to-report) +- [Reporting for WPF - How to Use the DocumentPreviewControl in a WPF MVVM Application to Preview a Report](https://github.com/DevExpress-Examples/reporting-wpf-mvvm-show-report-document-preview) ## Does this example address your development requirements/objectives? From 86f1b7d3b055a1a5b74b6da34fe48fe7c8f6d05a Mon Sep 17 00:00:00 2001 From: Serge Pilipchuk <112853396+sergepilipchuk@users.noreply.github.com> Date: Wed, 18 Jun 2025 11:00:53 +0400 Subject: [PATCH 2/5] Add implementation details section (README) --- Readme.md | 42 ++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 40 insertions(+), 2 deletions(-) diff --git a/Readme.md b/Readme.md index 431014c..e22d9b2 100644 --- a/Readme.md +++ b/Readme.md @@ -7,11 +7,49 @@ # WPF Accordion Control - Bind to Hierarchical Data Structure -This example binds Accordion Control to Hierarchical Data Structure. +This example binds [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) to hierarchical data structure. ## Implementation Details -... +To display hierarchical data in the [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control), bind the `ItemsSource` property to a collection that contains child items. Use the [ChildrenPath](https://docs.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenPath) property to specify the name of the child collection. + +In this example, the [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) is bound to the collection of departments. Each department contains the collection of employees: + +```xaml + +``` + +The `MainViewModel` exposes two bindable properties: + +`Departments` – the collection of `EmployeeDepartment` objects grouped by department name. + +`SelectedEmployee` – the employee selected in the [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control). + +At runtime, the view model loads employee data, groups it by department, and assigns the first available employee to the `SelectedEmployee` property: + +```csharp +var departments = DataHelper.GetEmployees() + .GroupBy(x => x.GroupName) + .Select(x => CreateEmployeeDepartment(x.Key, x.Take(10).ToArray())) + .ToArray(); + +Departments = new ObservableCollection(departments); +SelectedEmployee = Departments[0].Employees[0]; +``` + +Each `EmployeeDepartment` object includes an `Employees` collection: + + +```csharp +public class EmployeeDepartment { + public string Name { get; set; } + public ObservableCollection Employees { get; set; } +} +``` ## Files to Review From 73d8da8ad6c57eb18d8b65bc4c72be67dcc71639 Mon Sep 17 00:00:00 2001 From: Serge Pilipchuk <112853396+sergepilipchuk@users.noreply.github.com> Date: Thu, 19 Jun 2025 09:04:52 +0400 Subject: [PATCH 3/5] Apply suggestions from code review Co-authored-by: dmitry-eliseev-devexpress <81766219+dmitry-eliseev-devexpress@users.noreply.github.com> --- Readme.md | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/Readme.md b/Readme.md index e22d9b2..15a1b16 100644 --- a/Readme.md +++ b/Readme.md @@ -7,13 +7,13 @@ # WPF Accordion Control - Bind to Hierarchical Data Structure -This example binds [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) to hierarchical data structure. +This example binds [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) to a hierarchical data structure. ## Implementation Details -To display hierarchical data in the [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control), bind the `ItemsSource` property to a collection that contains child items. Use the [ChildrenPath](https://docs.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenPath) property to specify the name of the child collection. +To display hierarchical data in the [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control), bind the `ItemsSource` property to a collection populated with child items. Use the [ChildrenPath](https://docs.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenPath) property to specify the name of the collection. -In this example, the [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) is bound to the collection of departments. Each department contains the collection of employees: +In this example, the [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) is bound to a collection of departments. Each department contains a collection of employees: ```xaml ``` -The `MainViewModel` exposes two bindable properties: +`MainViewModel` exposes two bindable properties: -`Departments` – the collection of `EmployeeDepartment` objects grouped by department name. +`Departments` – a collection of `EmployeeDepartment` objects grouped by department names. -`SelectedEmployee` – the employee selected in the [AccordionControl](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control). +`SelectedEmployee` – the employee selected in the [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control). -At runtime, the view model loads employee data, groups it by department, and assigns the first available employee to the `SelectedEmployee` property: +At runtime, the view model loads employee data, groups it by departments, and assigns the first available employee to the `SelectedEmployee` property: ```csharp var departments = DataHelper.GetEmployees() From e44cca8d5bf796995d6125199c883c03133913f4 Mon Sep 17 00:00:00 2001 From: Serge Pilipchuk <112853396+sergepilipchuk@users.noreply.github.com> Date: Thu, 19 Jun 2025 11:17:35 +0400 Subject: [PATCH 4/5] Update Readme.md Co-authored-by: dirkpieterse --- Readme.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Readme.md b/Readme.md index 15a1b16..f38b627 100644 --- a/Readme.md +++ b/Readme.md @@ -29,7 +29,7 @@ In this example, the [Accordion Control](https://docs.devexpress.com/WPF/118347/ `SelectedEmployee` – the employee selected in the [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control). -At runtime, the view model loads employee data, groups it by departments, and assigns the first available employee to the `SelectedEmployee` property: +At runtime, the view model loads employee data, groups it by department, and assigns the first available employee to the `SelectedEmployee` property: ```csharp var departments = DataHelper.GetEmployees() From 78cbbe65749c319b27a729dac9c17ad5d207cb85 Mon Sep 17 00:00:00 2001 From: Serge Pilipchuk <112853396+sergepilipchuk@users.noreply.github.com> Date: Wed, 9 Jul 2025 10:23:05 +0400 Subject: [PATCH 5/5] Add changes after the Ray review --- Readme.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/Readme.md b/Readme.md index f38b627..bb5999e 100644 --- a/Readme.md +++ b/Readme.md @@ -7,13 +7,13 @@ # WPF Accordion Control - Bind to Hierarchical Data Structure -This example binds [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) to a hierarchical data structure. +This example binds our WPF [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) to a hierarchical data structure. ## Implementation Details -To display hierarchical data in the [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control), bind the `ItemsSource` property to a collection populated with child items. Use the [ChildrenPath](https://docs.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenPath) property to specify the name of the collection. +To display hierarchical data within the DevExpress WPF [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control), bind the `ItemsSource` property to a collection populated with child items. Use the [ChildrenPath](https://docs.devexpress.com/WPF/DevExpress.Xpf.Accordion.AccordionControl.ChildrenPath) property to specify collection name. -In this example, the [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) is bound to a collection of departments. Each department contains a collection of employees: +In this example, the [Accordion Control](https://docs.devexpress.com/WPF/118347/controls-and-libraries/navigation-controls/accordion-control) is bound to a collection of "departments". Each department contains a collection of employees: ```xaml