Skip to content

Commit 1a6877d

Browse files
mohamedksmohamedks
authored
Update README.md
1 parent f3d3117 commit 1a6877d

1 file changed

Lines changed: 1 addition & 255 deletions

File tree

‎README.md‎

Lines changed: 1 addition & 255 deletions
Original file line numberDiff line numberDiff line change
@@ -1,261 +1,7 @@
11
# How to Expand or Collapse the TaskBar programmatically using the MVVM pattern in WPF TaskBar control
22
This repository contains the sample that show how to expand or collapse the TaskBar programmatically in MVVM pattern in WPF TaskBar control.
3-
4-
The TaskBar can be expanded or collapsed using the IsOpened property. The different content for each TaskBarItem can be set by using the ContentTemplateSelector property of ContentPresenter.
5-
6-
```XMAL
7-
<Window.Resources>
8-
<DataTemplate x:Key="DefaultTemplate">
9-
<StackPanel>
10-
<TextBlock Text="Default content" />
11-
</StackPanel>
12-
</DataTemplate>
13-
<DataTemplate x:Key="NormalTemplate">
14-
<Grid>
15-
<Grid.ColumnDefinitions>
16-
<ColumnDefinition/>
17-
<ColumnDefinition/>
18-
</Grid.ColumnDefinitions>
19-
<StackPanel Margin="5">
20-
<TextBlock Margin="2" Text="{Binding Name}" />
21-
<TextBlock Margin="2" Text="{Binding DateOfBirth}" />
22-
<TextBlock Margin="2" Text="{Binding Geneder}" />
23-
<TextBlock Margin="2" Text="{Binding DateOfJoining}"/>
24-
</StackPanel>
25-
<StackPanel Grid.Column="1" Margin="5">
26-
<TextBlock
27-
Margin="2"
28-
HorizontalAlignment="Center"
29-
VerticalAlignment="Center">
30-
Employee Photo
31-
</TextBlock>
32-
<Image
33-
Margin="2"
34-
Height="100"
35-
VerticalAlignment="Top"
36-
Source="{Binding ImageSource}" />
37-
</StackPanel>
38-
</Grid>
39-
</DataTemplate>
40-
<local:PremiumUserDataTemplateSelector
41-
x:Key="TaskBarContentTemplateSelector"
42-
DefaultTemplate="{StaticResource DefaultTemplate}"
43-
NormalTemplate="{StaticResource NormalTemplate}" />
44-
</Window.Resources>
45-
46-
47-
<Grid>
48-
<syncfusion:TaskBar
49-
Name="taskBar"
50-
Width="500"
51-
Height="300"
52-
Margin="0,10,0,0"
53-
VerticalAlignment="Top"
54-
ScrollViewer.HorizontalScrollBarVisibility="Auto"
55-
ItemsSource="{Binding TaskBarItems}">
56-
<syncfusion:TaskBar.ItemContainerStyle>
57-
<Style TargetType="{x:Type syncfusion:TaskBarItem}">
58-
<Setter Property="Header" Value="{Binding Header}" />
59-
<Setter Property="syncfusion:TaskBar.IsOpened" Value="{Binding IsOpened}" />
60-
<Setter Property="ItemsSource" Value="{Binding TaskbarContentItems}" />
61-
<Setter Property="ItemContainerStyle">
62-
<!--ContentTemplateSelector used to set different content for each TaskBarItem-->
63-
<Setter.Value>
64-
<Style TargetType="ContentPresenter">
65-
<Setter Property="ContentTemplateSelector" Value="{StaticResource TaskBarContentTemplateSelector}" />
66-
</Style>
67-
</Setter.Value>
68-
</Setter>
69-
</Style>
70-
</syncfusion:TaskBar.ItemContainerStyle>
71-
</syncfusion:TaskBar>
72-
</Grid>
73-
```
74-
75-
```C#
76-
77-
public class PremiumUserDataTemplateSelector : DataTemplateSelector
78-
{
79-
public DataTemplate DefaultTemplate { get; set; }
80-
public DataTemplate NormalTemplate { get; set; }
81-
public override DataTemplate SelectTemplate(object item, DependencyObject container)
82-
{
83-
FrameworkElement elemnt = container as FrameworkElement;
84-
// Set the different content for taskbaritem according your desire
85-
if ((item as Contentmodel).Name == "Content1")
86-
{
87-
return elemnt.FindResource("DefaultTemplate") as DataTemplate;
88-
}
89-
90-
return elemnt.FindResource("NormalTemplate") as DataTemplate;
91-
}
92-
}
93-
```
94-
95-
ViewModel
96-
```
97-
public class TaskBarViewModel : NotificationObject
98-
{
99-
100-
private ObservableCollection<TaskBarModel> taskbarItems;
101-
public ObservableCollection<TaskBarModel> TaskBarItems
102-
{
103-
get { return taskbarItems; }
104-
set
105-
{
106-
taskbarItems = value;
107-
this.RaisePropertyChanged(nameof(TaskBarItems));
108-
}
109-
}
110-
public TaskBarViewModel()
111-
{
112-
taskbarItems = new ObservableCollection<TaskBarModel>();
113-
PopulateCollection();
114-
}
115-
116-
public void PopulateCollection()
117-
{
118-
//Adding the tileview items into the collection
119-
List<Contentmodel> ContentItem1 = new List<Contentmodel>();
120-
121-
122-
ContentItem1.Add(new Contentmodel() { Name = "Name : Alicia Mendez", DateOfBirth = "Date Of Birth : 06-03-1981", Geneder = "Gender : Female", DateOfJoining = "Date Of Joining : 06-03-2003" ,ImageSource= "/Taskbar_Mvvm;component/Assets/People/People_Circle0.png" });
123-
124-
TaskBarItems.Add(new TaskBarModel() { Header = "Employee1 Personal Details", TaskbarContentItems = ContentItem1, IsOpened = false });
125-
126-
List<Contentmodel> ContentItem2 = new List<Contentmodel>();
127-
128-
ContentItem2.Add(new Contentmodel() { Name = "Name : Danial William", DateOfBirth = "Date Of Birth : 04-03-1982", Geneder = "Gender : Male", DateOfJoining = "Date Of Joining : 09-03-2004", ImageSource = "/Taskbar_Mvvm;component/Assets/People/People_Circle2.png" });
129-
TaskBarItems.Add(new TaskBarModel() { Header = "Employee2 Personal Details", TaskbarContentItems = ContentItem2, IsOpened = false });
130-
131-
List<Contentmodel> ContentItem3 = new List<Contentmodel>();
132-
133-
ContentItem3.Add(new Contentmodel() { Name = "Name : Kinsley Elena", DateOfBirth = "Date Of Birth :08-09-1983", Geneder = "Gender : Female", DateOfJoining = "Date Of Joining : 09-03-2005", ImageSource = "/Taskbar_Mvvm;component/Assets/People/People_Circle1.png" });
134-
TaskBarItems.Add(new TaskBarModel() { Header = "Employee3 Personal Details", TaskbarContentItems = ContentItem3, IsOpened = true });
135-
136-
}
137-
}
138-
```
139-
140-
Model
141-
```
142-
TaskBarModel cs file
143-
144-
public class TaskBarModel : NotificationObject
145-
{
146-
public string Header { get; set; }
147-
148-
149-
public TaskBarModel()
150-
{
151-
taskbarContentItems = new List<Contentmodel>();
152-
153-
}
154-
155-
private bool isOpen;
156-
157-
public bool IsOpened
158-
{
159-
get { return isOpen; }
160-
set
161-
{
162-
isOpen = value;
163-
this.RaisePropertyChanged(nameof (IsOpened));
164-
}
165-
}
1663

1674

168-
private int invokeParameter = 1;
169-
170-
public int InvokeParameter
171-
{
172-
get { return invokeParameter; }
173-
set { invokeParameter = value; RaisePropertyChanged("InvokeParameter"); }
174-
}
175-
176-
private List<Contentmodel> taskbarContentItems;
177-
178-
public List<Contentmodel> TaskbarContentItems
179-
{
180-
get { return taskbarContentItems; }
181-
set
182-
{
183-
taskbarContentItems = value;
184-
this.RaisePropertyChanged(nameof(TaskbarContentItems));
185-
}
186-
}
187-
}
188-
189-
Contentmodel cs file
190-
191-
public class Contentmodel
192-
{
193-
private string name;
194-
public string Name
195-
{
196-
get
197-
{
198-
return name;
199-
}
200-
set { name = value; }
201-
}
202-
203-
private string dateOfBirth;
204-
public string DateOfBirth
205-
{
206-
get
207-
{
208-
return dateOfBirth;
209-
}
210-
set { dateOfBirth = value; }
211-
}
212-
213-
214-
private string gender;
215-
public string Geneder
216-
{
217-
get
218-
{
219-
return gender;
220-
}
221-
set { gender = value; }
222-
}
223-
224-
private string position;
225-
public string Position
226-
{
227-
get
228-
{
229-
return position;
230-
}
231-
set { position = value; }
232-
}
233-
234-
private string dateOfJoining;
235-
public string DateOfJoining
236-
{
237-
get
238-
{
239-
return dateOfJoining;
240-
}
241-
set { dateOfJoining = value; }
242-
}
243-
244-
245-
private string imageSource;
246-
public string ImageSource
247-
{
248-
get
249-
{
250-
return imageSource;
251-
}
252-
set { imageSource = value; }
253-
}
254-
}
255-
256-
```
257-
Output:
258-
259-
![WPF_TaskBar_MVVM](WPF_TaskBar_MVVM.png)
5+
2606

2617

0 commit comments

Comments
 (0)