Skip to content

Instantly share code, notes, and snippets.

@trinnguyen
Created February 22, 2016 02:19
Show Gist options
  • Save trinnguyen/927fffd64e48868276cc to your computer and use it in GitHub Desktop.
Save trinnguyen/927fffd64e48868276cc to your computer and use it in GitHub Desktop.
Sample XAML ListView Grouping for WP8.1
<Page
x:Class="ListViewSamples.CS.Step1.GroupedListPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:ListViewSamples.CS.Step1"
xmlns:model="using:ListViewSamples.CS.Model"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
Loaded="Page_Loaded">
<Page.Resources>
<Style x:Key="RegionContainerStyle" TargetType="ListViewHeaderItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
</Style>
<DataTemplate x:Key="RegionTemplate">
<Border Background="Red">
<TextBlock Text="{Binding Name}" Foreground="White" FontSize="28"/>
</Border>
</DataTemplate>
<DataTemplate x:Name="DesignationTemplate">
<TextBlock Text="{Binding Name}" FontSize="24" />
</DataTemplate>
<model:GroupedModel x:Key="VM"/>
<CollectionViewSource x:Key="CVS" Source="{Binding Regions, Source={StaticResource VM}}"
IsSourceGrouped="True"
ItemsPath="Designations"/>
</Page.Resources>
<Grid>
<ListView x:Name="TheListView"
ItemsSource="{Binding Source={StaticResource CVS}}"
ItemTemplate="{StaticResource DesignationTemplate}"
>
<ListView.GroupStyle>
<GroupStyle HeaderTemplate="{StaticResource RegionTemplate}"
HeaderContainerStyle="{StaticResource RegionContainerStyle}"
/>
</ListView.GroupStyle>
</ListView>
</Grid>
</Page>
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Diagnostics;
using System.IO;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Windows.Storage;
namespace ListViewSamples.CS.Model
{
public class GroupedModel : BindableObject
{
private ObservableCollection<Region> _regions;
public ObservableCollection<Region> Regions
{
get { return _regions; }
set { SetProperty(ref _regions, value); }
}
public GroupedModel()
{
LoadDesignData();
}
[Conditional("DESIGN")]
void LoadDesignData()
{
ObservableCollection<Region> tmp = new ObservableCollection<Region>();
Region bordeaux = new Region("Bordeaux");
tmp.Add(bordeaux);
bordeaux.Designations.Add(new Designation("Loupiac") { Region = bordeaux });
bordeaux.Designations.Add(new Designation("Moulis") { Region = bordeaux });
Region bourgogne = new Region("Bourgogne");
tmp.Add(bourgogne);
bourgogne.Designations.Add(new Designation("Chambolle-Musigny") { Region = bourgogne });
bourgogne.Designations.Add(new Designation("Gevrey-Chambertin") { Region = bourgogne });
bourgogne.Designations.Add(new Designation("Nuits-Saint-Georges") { Region = bourgogne });
Regions = tmp;
}
public async void LoadData(Uri fileUri)
{
ObservableCollection<Region> tmp = new ObservableCollection<Region>();
var storageFile = await StorageFile.GetFileFromApplicationUriAsync(fileUri);
using (var stream = await WindowsRuntimeStorageExtensions.OpenStreamForReadAsync(storageFile))
{
var doc = System.Xml.Linq.XDocument.Load(stream);
foreach (var regionNode in doc.Descendants("Region"))
{
Region region = new Region(regionNode.Attribute("Name").Value);
tmp.Add(region);
foreach (var designationNode in regionNode.Descendants("Designation"))
{
Designation designation = new Designation(designationNode.Attribute("Name").Value) { Region = region };
region.Designations.Add(designation);
}
}
}
Regions = tmp;
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment