Skip to content

Commit 428a4aa

Browse files
authored
ReadMe file updated with KB details
1 parent 5776e46 commit 428a4aa

File tree

1 file changed

+105
-2
lines changed

1 file changed

+105
-2
lines changed

README.md

Lines changed: 105 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,105 @@
1-
# remove-group-items-listview-xamarin
2-
How to remove group of items from Xamarin.Forms ListView (SfListView)
1+
# How to remove group of items from Xamarin.Forms ListView (SfListView)
2+
3+
You can remove all items in the group when tapping on the GroupHeader using Commands in Prism Framework with Xamarin.Forms SfListView.
4+
5+
You can also refer the following article.
6+
7+
https://www.syncfusion.com/kb/11891/how-to-remove-group-of-items-from-xamarin-forms-listview-sflistview
8+
9+
**C#**
10+
11+
TapCommand defined to remove all items from the group using ItemType from ItemTappedEventArgs. You can get the GroupResult from ItemData of the ItemTappedEventArgs. From the GroupResult.Items property, all the group items can be deleted using the remove method.
12+
13+
``` c#
14+
namespace ListViewXamarin
15+
{
16+
public class MainPageViewModel : BindableBase, INavigationAware
17+
{
18+
private ObservableCollection<ToDoItem> toDoList;
19+
20+
public MainPageViewModel()
21+
{
22+
this.GenerateSource();
23+
ItemTappedCommand = new DelegateCommand<object>(OnItemTapped);
24+
}
25+
26+
public DelegateCommand<object> ItemTappedCommand { get; set; }
27+
28+
public ObservableCollection<ToDoItem> ToDoList
29+
{
30+
get { return toDoList; }
31+
set { this.toDoList = value; }
32+
}
33+
34+
private void OnItemTapped(object obj)
35+
{
36+
var args = obj as Syncfusion.ListView.XForms.ItemTappedEventArgs;
37+
if (args.ItemType == ItemType.GroupHeader)
38+
{
39+
var group = args.ItemData as GroupResult;
40+
41+
foreach(var item in group.Items)
42+
{
43+
this.ToDoList.Remove(item as ToDoItem);
44+
}
45+
}
46+
}
47+
}
48+
}
49+
```
50+
**XAML**
51+
52+
Bind **ViewModel.ItemTappedCommand** to **SfListView.TapCommand** to remove all items in the group.
53+
```xml
54+
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
55+
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
56+
xmlns:local="clr-namespace:ListViewXamarin"
57+
xmlns:syncfusion="clr-namespace:Syncfusion.ListView.XForms;assembly=Syncfusion.SfListView.XForms"
58+
xmlns:data="clr-namespace:Syncfusion.DataSource;assembly=Syncfusion.DataSource.Portable"
59+
x:Class="ListViewXamarin.MainPage">
60+
61+
<ContentPage.Content>
62+
<StackLayout>
63+
<Grid RowSpacing="0">
64+
<Grid.RowDefinitions>
65+
<RowDefinition Height="40" />
66+
<RowDefinition Height="*" />
67+
</Grid.RowDefinitions>
68+
69+
<Grid BackgroundColor="#2196F3">
70+
<Label Text="To Do Items" x:Name="headerLabel" TextColor="White" FontAttributes="Bold" VerticalOptions="Center" HorizontalOptions="Center" />
71+
</Grid>
72+
73+
<syncfusion:SfListView x:Name="listView" Grid.Row="1" ItemSize="60"
74+
BackgroundColor="#FFE8E8EC"
75+
TapCommand="{Binding ItemTappedCommand}"
76+
GroupHeaderSize="50"
77+
ItemsSource="{Binding ToDoList}"
78+
SelectionMode="None">
79+
<syncfusion:SfListView.DataSource>
80+
<data:DataSource>
81+
<data:DataSource.GroupDescriptors>
82+
<data:GroupDescriptor PropertyName="CategoryName" />
83+
</data:DataSource.GroupDescriptors>
84+
</data:DataSource>
85+
</syncfusion:SfListView.DataSource>
86+
87+
<syncfusion:SfListView.GroupHeaderTemplate>
88+
<DataTemplate>
89+
<Grid>
90+
<Grid.BackgroundColor>
91+
<OnPlatform x:TypeArguments="Color" Android="#eeeeee" iOS="#f7f7f7"/>
92+
</Grid.BackgroundColor>
93+
<Label Text="{Binding Key}" FontSize="14" TextColor="#333333" FontAttributes="Bold" VerticalOptions="Center" HorizontalOptions="Start" Margin="15,0,0,0" />
94+
</Grid>
95+
</DataTemplate>
96+
</syncfusion:SfListView.GroupHeaderTemplate>
97+
</syncfusion:SfListView>
98+
</Grid>
99+
</StackLayout>
100+
</ContentPage.Content>
101+
</ContentPage>
102+
```
103+
**Output**
104+
105+
![RemoveGroupItems](https://github.com/SyncfusionExamples/remove-group-items-listview-xamarin/blob/master/ScreenShot/RemoveGroupItems.gif)

0 commit comments

Comments
 (0)