CODEWITHSUNDEEP
c#gridviewwin-universal-appwindows-10-universaluwp-xaml
Redeil
Redeil

Reputation: 23

Sorting GridView in Universal Windows Platform

I want to sort items in my GridView.

My GridView looks like:

<GridView x:Name="ivGridView" Margin="70,40,10,10" SelectionChanged="ivGridView_SelectionChanged">
        <GridView.ItemTemplate>
            <DataTemplate>
                <StackPanel Margin="0,0,0,10"  Width="121" Height="128" VerticalAlignment="Top" Background="#19000000">
                    <Image Source="{Binding Image}" VerticalAlignment="Top" Height="88" Margin="0,0,0,0" RenderTransformOrigin="0.5,0.5" >
                        <Image.RenderTransform>
                            <CompositeTransform ScaleX="1.2" ScaleY="1.2"/>
                        </Image.RenderTransform>
                    </Image>
                    <StackPanel Background="{Binding Color}" HorizontalAlignment="Stretch" VerticalAlignment="Bottom">
                        <TextBlock Text="{Binding wpn}" Foreground="White" Margin="10,0,0,0" />
                        <TextBlock Text="{Binding sname}" Foreground="White" Margin="7,0,0,0" FontWeight="Light" />
                    </StackPanel>
                </StackPanel>
            </DataTemplate>
        </GridView.ItemTemplate>

How can I sort them?

Upvotes: 0

Views: 1396

Answers (2)

Amy Peng - MSFT
Amy Peng - MSFT

Reputation: 1902

In addition to @Filip's idea, I will show you the detailed information about how to sort the Items in the GridView.

For example you want to sort the GridView Items based on the first letter of the TextBlock text which has been binded to the wpn, then we need to define the following class for data binding first:

 public class Test
{
    public BitmapImage Image { get; set; }
    public SolidColorBrush Color { get; set; }
    public string wpn { get; set; }
    public string sname { get; set; }
}

After that we can use the OrderBy method of the ObservableCollection to sort the ListView by the first letter of the wpn column and bind the ObservableCollection to the ItemsSource of the GridView as following:

 public ObservableCollection<Test> TestOC = new ObservableCollection<Test>();
    public MainPage()
    {
        this.InitializeComponent();
        TestOC.Add(new Test() {wpn="BB",sname="BBB",Image = new BitmapImage(new Uri("ms-appx:///Capture.PNG")),Color=new SolidColorBrush(Colors.Red)});
        TestOC.Add(new Test() { wpn = "CC", sname = "CCC", Image = new BitmapImage(new Uri("ms-appx:///Capture.PNG")), Color = new SolidColorBrush(Colors.Green) });
        TestOC.Add(new Test() { wpn = "AA", sname = "AA", Image = new BitmapImage(new Uri("ms-appx:///Capture.PNG")), Color = new SolidColorBrush(Colors.Orange) });
        var SortResult = TestOC.OrderBy(a => a.wpn);           
        ivGridView.ItemsSource =SortResult;
    }

The result:

enter image description here

Thanks.

Upvotes: 3

Filip Skakun
Filip Skakun

Reputation: 31724

You can sort the associated ItemsSource to sort the items in the view.

Upvotes: 0

Related Questions