Skip to content

Commit 86745c9

Browse files
committed
Add SidebarView Sample
1 parent 674323d commit 86745c9

File tree

12 files changed

+259
-0
lines changed

12 files changed

+259
-0
lines changed

README.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -135,6 +135,7 @@ Install-Package DevWinUI
135135
## 🔥 DevWinUI.Controls 🔥
136136
### ⚡ What’s Inside? ⚡
137137

138+
- ✨ SidebarView
138139
- ✨ Toolbar
139140
- ✨ BreadcrumbBar
140141
- ✨ ThemedIcon
@@ -327,6 +328,9 @@ Install-Package DevWinUI.ContextMenu
327328

328329
## 🕰️ History 🕰️
329330

331+
### SidebarView
332+
![SidebarView](https://raw.githubusercontent.com/ghost1372/DevWinUI-Resources/refs/heads/main/DevWinUI-Docs/SidebarView.gif)
333+
330334
### Toolbar
331335
![Toolbar](https://raw.githubusercontent.com/ghost1372/DevWinUI-Resources/refs/heads/main/DevWinUI-Docs/Toolbar.png)
332336

15 KB
Loading
1.51 KB
Loading
30.6 KB
Loading
4.9 KB
Loading

dev/DevWinUI.Gallery/Assets/NavViewMenu/AppData.json

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -162,6 +162,13 @@
162162
"ImagePath": "ms-appx:///Assets/Fluent/RatingControl.png",
163163
"IsSpecialSection": false,
164164
"Items": [
165+
{
166+
"UniqueId": "DevWinUIGallery.Views.SideBarViewPage",
167+
"Title": "SideBarView",
168+
"Subtitle": "Provides top-level navigation for your app.",
169+
"IsNew": true,
170+
"ImagePath": "ms-appx:///Assets/Fluent/NavigationView.png"
171+
},
165172
{
166173
"UniqueId": "DevWinUIGallery.Views.ToolbarPage",
167174
"Title": "Toolbar",
Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
public sealed partial class FolderItem : ISidebarItemModel, INotifyPropertyChanged
2+
{
3+
private string text = "";
4+
public string Text
5+
{
6+
get => text;
7+
set => SetProperty(ref text, value, nameof(Text));
8+
}
9+
10+
private string path = "";
11+
public string Path
12+
{
13+
get => path;
14+
set => SetProperty(ref path, value, nameof(Path));
15+
}
16+
17+
private ImageIconSource icon = new ImageIconSource();
18+
public ImageIconSource Icon
19+
{
20+
get => icon;
21+
set
22+
{
23+
SetProperty(ref icon, value, nameof(Icon));
24+
OnPropertyChanged(nameof(IconSource));
25+
}
26+
}
27+
28+
public object? Children { get; set; } = null;
29+
30+
public IconSource? IconSource => Icon;
31+
32+
public bool IsExpanded { get; set; } = false;
33+
34+
public object ToolTip => Path;
35+
36+
public bool PaddedItem => false;
37+
38+
public event PropertyChangedEventHandler? PropertyChanged;
39+
40+
private void OnPropertyChanged(string propertyName)
41+
=> PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
42+
43+
private bool SetProperty<T>(ref T storage, T value, string propertyName)
44+
{
45+
if (Equals(storage, value)) return false;
46+
storage = value;
47+
OnPropertyChanged(propertyName);
48+
return true;
49+
}
50+
}
51+
52+
public partial ObservableCollection<FolderItem> Items { get; set; } = new ObservableCollection<FolderItem>()
53+
{
54+
new FolderItem()
55+
{
56+
Text = "Folder",
57+
Path = "C:\\Folder",
58+
Icon = new ImageIconSource()
59+
{
60+
ImageSource = new BitmapImage(new Uri("ms-appx:///Assets/Fluent/Database.png"))
61+
},
62+
Children = new ObservableCollection<FolderItem>()
63+
{
64+
new FolderItem()
65+
{
66+
Text = "SubFolder1",
67+
Path = "C:\\Folder\\SubFolder1",
68+
Icon = new ImageIconSource()
69+
{
70+
ImageSource = new BitmapImage(new Uri("ms-appx:///Assets/Fluent/Folder.png"))
71+
}
72+
},
73+
new FolderItem()
74+
{
75+
Text = "SubFolder2",
76+
Path = "C:\\Folder\\SubFolder2",
77+
Icon = new ImageIconSource()
78+
{
79+
ImageSource = new BitmapImage(new Uri("ms-appx:///Assets/Fluent/Folder.png"))
80+
}
81+
}
82+
}
83+
},
84+
new FolderItem()
85+
{
86+
Text = "Drive",
87+
Path = "D:\\Drive",
88+
Icon = new ImageIconSource()
89+
{
90+
ImageSource = new BitmapImage(new Uri("ms-appx:///Assets/Fluent/Audio.png"))
91+
}
92+
},
93+
new FolderItem()
94+
{
95+
Text = "Font",
96+
Path = "C:\\Fonts",
97+
Icon = new ImageIconSource()
98+
{
99+
ImageSource = new BitmapImage(new Uri("ms-appx:///Assets/Fluent/Save.png"))
100+
}
101+
}
102+
};
Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
using System.ComponentModel;
2+
3+
namespace DevWinUIGallery.Models;
4+
5+
public sealed partial class FolderItem : ISidebarItemModel, INotifyPropertyChanged
6+
{
7+
private string text = "";
8+
public string Text
9+
{
10+
get => text;
11+
set => SetProperty(ref text, value, nameof(Text));
12+
}
13+
14+
private string path = "";
15+
public string Path
16+
{
17+
get => path;
18+
set => SetProperty(ref path, value, nameof(Path));
19+
}
20+
21+
private ImageIconSource icon = new ImageIconSource();
22+
public ImageIconSource Icon
23+
{
24+
get => icon;
25+
set
26+
{
27+
SetProperty(ref icon, value, nameof(Icon));
28+
OnPropertyChanged(nameof(IconSource));
29+
}
30+
}
31+
32+
public object? Children { get; set; } = null;
33+
34+
public IconSource? IconSource => Icon;
35+
36+
public bool IsExpanded { get; set; } = false;
37+
38+
public object ToolTip => Path;
39+
40+
public bool PaddedItem => false;
41+
42+
public event PropertyChangedEventHandler? PropertyChanged;
43+
44+
private void OnPropertyChanged(string propertyName)
45+
=> PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
46+
47+
private bool SetProperty<T>(ref T storage, T value, string propertyName)
48+
{
49+
if (Equals(storage, value)) return false;
50+
storage = value;
51+
OnPropertyChanged(propertyName);
52+
return true;
53+
}
54+
}

dev/DevWinUI.Gallery/T4Templates/NavigationPageMappings.cs

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,7 @@ public partial class NavigationPageMappings
3636
{"DevWinUIGallery.Views.ExtensionPage", typeof(DevWinUIGallery.Views.ExtensionPage)},
3737
{"DevWinUIGallery.Views.ThemeManagerPage", typeof(DevWinUIGallery.Views.ThemeManagerPage)},
3838
{"DevWinUIGallery.Views.CheckUpdatePage", typeof(DevWinUIGallery.Views.CheckUpdatePage)},
39+
{"DevWinUIGallery.Views.SideBarViewPage", typeof(DevWinUIGallery.Views.SideBarViewPage)},
3940
{"DevWinUIGallery.Views.ToolbarPage", typeof(DevWinUIGallery.Views.ToolbarPage)},
4041
{"DevWinUIGallery.Views.BreadcrumbBarPage", typeof(DevWinUIGallery.Views.BreadcrumbBarPage)},
4142
{"DevWinUIGallery.Views.ThemedIconPage", typeof(DevWinUIGallery.Views.ThemedIconPage)},

dev/DevWinUI.Gallery/ViewModels/BaseViewModel.cs

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,64 @@
11
using DevWinUIGallery.Models;
2+
using Microsoft.UI.Xaml.Media.Imaging;
23

34
namespace DevWinUIGallery.ViewModels;
45

56
public partial class BaseViewModel : ObservableObject
67
{
8+
[ObservableProperty]
9+
public partial ObservableCollection<FolderItem> SidebarViewItems { get; set; } = new ObservableCollection<FolderItem>()
10+
{
11+
new FolderItem()
12+
{
13+
Text = "Home",
14+
Path = "C:\\Fonts",
15+
Icon = new ImageIconSource()
16+
{
17+
ImageSource = new BitmapImage(new Uri("ms-appx:///Assets/Fluent/Home.png"))
18+
}
19+
},
20+
new FolderItem()
21+
{
22+
Text = "Folder",
23+
Path = "C:\\Folder",
24+
IsExpanded = true,
25+
Icon = new ImageIconSource()
26+
{
27+
ImageSource = new BitmapImage(new Uri("ms-appx:///Assets/Fluent/Folder.png"))
28+
},
29+
Children = new ObservableCollection<FolderItem>()
30+
{
31+
new FolderItem()
32+
{
33+
Text = "SubFolder1",
34+
Path = "C:\\Folder\\SubFolder1",
35+
Icon = new ImageIconSource()
36+
{
37+
ImageSource = new BitmapImage(new Uri("ms-appx:///Assets/Fluent/Folder.png"))
38+
}
39+
},
40+
new FolderItem()
41+
{
42+
Text = "SubFolder2",
43+
Path = "C:\\Folder\\SubFolder2",
44+
Icon = new ImageIconSource()
45+
{
46+
ImageSource = new BitmapImage(new Uri("ms-appx:///Assets/Fluent/Folder.png"))
47+
}
48+
}
49+
}
50+
},
51+
new FolderItem()
52+
{
53+
Text = "Drive",
54+
Path = "D:\\Drive",
55+
Icon = new ImageIconSource()
56+
{
57+
ImageSource = new BitmapImage(new Uri("ms-appx:///Assets/Fluent/CloudDrive.png"))
58+
}
59+
},
60+
};
61+
762
[ObservableProperty]
863
public partial ObservableCollection<SampleItemModel> LandscapeData { get; set; } = new ObservableCollection<SampleItemModel>()
964
{

0 commit comments

Comments
 (0)