Shrlalgo.RvKits/WPFluent.Gallery/Views/Pages/CollectionsPage.xaml

<Page
    x:Class="WPFluent.Gallery.Views.Pages.Collections.CollectionsPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="clr-namespace:WPFluent.Gallery.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="clr-namespace:WPFluent.Gallery.Views.Pages.Collections"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:models="clr-namespace:WPFluent.Gallery.Models"
    xmlns:ui="https://github.com/ShrlAlgo/WPFluent"
    mc:Ignorable="d"
    controls:PageControlDocumentation.Show="False"
    d:DataContext="{d:DesignInstance local:CollectionsPage,
                                     IsDesignTimeCreatable=False}"
    Foreground="{DynamicResource TextFillColorPrimaryBrush}"
    Title="CollectionsPage"
    ui:Design.Background="{DynamicResource ApplicationBackgroundBrush}"
    ui:Design.Foreground="{DynamicResource TextFillColorPrimaryBrush}">

    <Grid>
        <StackPanel Grid.Row="1">
            <GroupBox Margin="0" Header="Default DataGrid with ItemsSource.">
                <DataGrid Height="400" ItemsSource="{Binding ViewModel.ProductsCollection, Mode=TwoWay}" />
            </GroupBox>

            <GroupBox Header="WPF UI DataGrid with ItemsSource.">
                <ui:DataGrid Height="400" ItemsSource="{Binding ViewModel.ProductsCollection, Mode=TwoWay}" />
            </GroupBox>
            <GroupBox Margin="0" Header="ListBox with items defined inline.">
                <ListBox SelectedIndex="0">
                    <ListBoxItem>Blue</ListBoxItem>
                    <ListBoxItem>Green</ListBoxItem>
                    <ListBoxItem>Red</ListBoxItem>
                    <ListBoxItem>Yellow</ListBoxItem>
                </ListBox>
            </GroupBox>

            <GroupBox Header="A ListBox with its ItemsSource and Height set.">
                <ListBox
                    Height="164"
                    ItemsSource="{Binding ViewModel.ListBoxItems, Mode=TwoWay}"
                    SelectedIndex="2" />
            </GroupBox>
            <GroupBox Margin="0" Header="Basic ListView with Simple DataTemplate.">
                <ui:ListView
                    MaxHeight="200"
                    d:ItemsSource="{d:SampleData ItemCount=2}"
                    ItemsSource="{Binding ViewModel.BasicListViewItems, Mode=TwoWay}"
                    SelectedIndex="2"
                    SelectionMode="Single">
                    <ui:ListView.ItemTemplate>
                        <DataTemplate DataType="{x:Type models:Person}">
                            <TextBlock Margin="8,4" Text="{Binding Name, Mode=OneWay}" />
                        </DataTemplate>
                    </ui:ListView.ItemTemplate>
                </ui:ListView>
            </GroupBox>

            <GroupBox Header="ListView with Selection Support.">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <ui:ListView
                        Grid.Column="0"
                        MaxHeight="200"
                        d:ItemsSource="{d:SampleData ItemCount=2}"
                        ItemsSource="{Binding ViewModel.BasicListViewItems, Mode=TwoWay}"
                        SelectedIndex="1"
                        SelectionMode="{Binding ViewModel.ListViewSelectionMode, Mode=OneWay}">
                        <ui:ListView.ItemTemplate>
                            <DataTemplate DataType="{x:Type models:Person}">
                                <Grid Margin="8,0">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="*" />
                                        <RowDefinition Height="*" />
                                    </Grid.RowDefinitions>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="Auto" />
                                        <ColumnDefinition Width="*" />
                                    </Grid.ColumnDefinitions>
                                    <Ellipse
                                        x:Name="Ellipse"
                                        Grid.RowSpan="2"
                                        Width="32"
                                        Height="32"
                                        Margin="6"
                                        HorizontalAlignment="Center"
                                        VerticalAlignment="Center"
                                        Fill="{ui:ThemeResource ControlStrongStrokeColorDefaultBrush}" />
                                    <TextBlock
                                        Grid.Row="0"
                                        Grid.Column="1"
                                        Margin="12,6,0,0"
                                        FontWeight="Bold"
                                        Text="{Binding Name, Mode=OneWay}" />
                                    <TextBlock
                                        Grid.Row="1"
                                        Grid.Column="1"
                                        Margin="12,0,0,6"
                                        Foreground="{ui:ThemeResource TextFillColorSecondaryBrush}"
                                        Text="{Binding Company, Mode=OneWay}" />
                                </Grid>
                            </DataTemplate>
                        </ui:ListView.ItemTemplate>
                    </ui:ListView>
                    <StackPanel
                        Grid.Column="1"
                        MinWidth="120"
                        Margin="12,0,0,0"
                        VerticalAlignment="Top">
                        <Label Content="Selection mode" Target="{Binding ElementName=SelectionModeComboBox}" />
                        <ComboBox x:Name="SelectionModeComboBox" SelectedIndex="{Binding ViewModel.ListViewSelectionModeComboBoxSelectedIndex, Mode=TwoWay}">
                            <ComboBoxItem Content="Single" />
                            <ComboBoxItem Content="Multiple" />
                            <ComboBoxItem Content="Extended" />
                        </ComboBox>
                    </StackPanel>
                </Grid>
            </GroupBox>

            <GroupBox Header="ListView with GridView">
                <ui:ListView
                    MaxHeight="200"
                    BorderThickness="0"
                    d:ItemsSource="{d:SampleData ItemCount=2}"
                    ItemsSource="{Binding ViewModel.BasicListViewItems, Mode=TwoWay}">
                    <ui:ListView.View>
                        <ui:GridView>
                            <ui:GridViewColumn
                                MinWidth="100"
                                DisplayMemberBinding="{Binding FirstName}"
                                Header="First Name" />
                            <ui:GridViewColumn
                                MinWidth="100"
                                DisplayMemberBinding="{Binding LastName}"
                                Header="Last Name" />
                            <ui:GridViewColumn
                                MinWidth="100"
                                DisplayMemberBinding="{Binding Company}"
                                Header="Company" />
                        </ui:GridView>
                    </ui:ListView.View>
                </ui:ListView>
            </GroupBox>
            <GroupBox Margin="0" Header="Simple TreeView.">
                <TreeView AllowDrop="True" ScrollViewer.CanContentScroll="False">
                    <TreeViewItem
                        Header="Work Documents"
                        IsExpanded="True"
                        IsSelected="True">
                        <TreeViewItem Header="Feature Schedule" />
                        <TreeViewItem Header="Overall Project Plan" />
                    </TreeViewItem>
                    <TreeViewItem Header="Personal Documents">
                        <TreeViewItem Header="Contractor contact info" />
                        <TreeViewItem Header="Home Remodel">
                            <TreeViewItem Header="Paint Color Scheme" />
                            <TreeViewItem Header="Flooring Woodgrain Type" />
                            <TreeViewItem Header="Kitchen Cabinet Style" />
                        </TreeViewItem>
                    </TreeViewItem>
                </TreeView>
            </GroupBox>

        </StackPanel>

        <!--  <controls:GalleryNavigationPresenter  -->
        <!--  Grid.Row="1"  -->
        <!--  Margin="0, 10"  -->
        <!--  ItemsSource="{Binding ViewModel.NavigationCards, Mode=OneWay}" />  -->
    </Grid>
</Page>