<UserControl
    x:Class="Semi.Avalonia.Demo.Pages.DataGridDemo"
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="using:Semi.Avalonia.Demo.Pages"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:vm="clr-namespace:Semi.Avalonia.Demo.ViewModels;assembly=Semi.Avalonia.Demo"
    d:DesignHeight="450"
    d:DesignWidth="800"
    x:CompileBindings="True"
    x:DataType="vm:DataGridDemoViewModel"
    mc:Ignorable="d">
    <TabControl>
        <TabItem Header="DataGrid">
           <Grid RowDefinitions="Auto, *">
               <StackPanel Grid.Row="0" Orientation="Horizontal">
                   <ToggleSwitch Content="Disable" Name="DisableToggle" />
                   <ToggleSwitch Content="ScrollViewerHide" Name="ScrollViewerHide" />
               </StackPanel>
               <DataGrid Grid.Row="1"
                         Margin="8"
                         CanUserReorderColumns="True"
                         CanUserResizeColumns="True"
                         CanUserSortColumns="True"
                         HeadersVisibility="All"
                         IsReadOnly="True"
                         ScrollViewer.AllowAutoHide="{Binding #ScrollViewerHide.IsChecked}"
                         IsEnabled="{Binding #DisableToggle.IsChecked}"
                         ItemsSource="{Binding GridData1}">
                   <DataGrid.Columns>
                       <DataGridTextColumn
                           Width="6*"
                           x:DataType="vm:Song"
                           Binding="{Binding Title}"
                           Header="Title" />
                       <DataGridTextColumn
                           Width="6*"
                           x:DataType="vm:Song"
                           Binding="{Binding Artist}"
                           Header="Artist" />
                       <DataGridTextColumn
                           Width="6*"
                           x:DataType="vm:Song"
                           Binding="{Binding Album}"
                           Header="Album" />
                       <DataGridTemplateColumn Header="Duration" SortMemberPath="Duration">
                           <DataGridTemplateColumn.CellTemplate>
                               <DataTemplate>
                                   <TextBlock
                                       Margin="8,0,0,0"
                                       VerticalAlignment="Center"
                                       Text="{Binding Duration}" />
                               </DataTemplate>
                           </DataGridTemplateColumn.CellTemplate>
                       </DataGridTemplateColumn>
                   </DataGrid.Columns>

               </DataGrid>
               
           </Grid>
        </TabItem>
        <TabItem Header="Grouping">
            <DataGrid
                Margin="8"
                CanUserReorderColumns="True"
                CanUserResizeColumns="True"
                CanUserSortColumns="True"
                HeadersVisibility="All"
                IsReadOnly="True"
                ItemsSource="{Binding GridData2}">
                <DataGrid.Columns>
                    <DataGridTextColumn
                        Width="6*"
                        x:DataType="vm:Song"
                        Binding="{Binding Title}"
                        Header="Title" />
                    <DataGridTextColumn
                        Width="6*"
                        x:DataType="vm:Song"
                        Binding="{Binding Artist}"
                        Header="Artist" />
                    <DataGridTextColumn
                        Width="6*"
                        x:DataType="vm:Song"
                        Binding="{Binding Album}"
                        Header="Album" />
                    <DataGridTemplateColumn
                        x:DataType="vm:Song"
                        Header="Duration"
                        SortMemberPath="Duration">
                        <DataGridTemplateColumn.CellTemplate>
                            <DataTemplate x:DataType="vm:Song">
                                <TextBlock
                                    Margin="8,0,0,0"
                                    VerticalAlignment="Center"
                                    Text="{Binding Duration}" />
                            </DataTemplate>
                        </DataGridTemplateColumn.CellTemplate>
                    </DataGridTemplateColumn>
                </DataGrid.Columns>
            </DataGrid>
        </TabItem>
        <TabItem x:Name="EditableTab" Header="Editable">
            <Grid Margin="8" RowDefinitions="Auto,*,Auto">
                <StackPanel
                    Grid.Row="0"
                    Orientation="Horizontal"
                    Spacing="4">
                    <TextBlock VerticalAlignment="Center" Text="FontSize:" />
                    <Slider
                        x:Name="FontSizeSlider"
                        Width="100"
                        VerticalAlignment="Center"
                        Maximum="30"
                        Minimum="5"
                        Value="14" />
                    <CheckBox
                        x:Name="IsThreeStateCheckBox"
                        Content="IsThreeState"
                        IsChecked="False" />
                </StackPanel>
                <DataGrid
                    Grid.Row="1"
                    Margin="8"
                    ItemsSource="{Binding GridData3}">
                    <DataGrid.Columns>
                        <DataGridCheckBoxColumn
                            Width="2*"
                            Binding="{Binding IsSelected}"
                            Header="Select"
                            IsThreeState="{Binding #IsThreeStateCheckBox.IsChecked, Mode=OneWay}" />
                        <DataGridTextColumn
                            Width="6*"
                            x:DataType="vm:SongViewModel"
                            Binding="{Binding Title}"
                            FontSize="{Binding #FontSizeSlider.Value, Mode=OneWay}"
                            Header="Title" />
                        <DataGridTextColumn
                            Width="6*"
                            x:DataType="vm:SongViewModel"
                            Binding="{Binding Artist}"
                            Header="Artist" />
                        <DataGridTextColumn
                            Width="6*"
                            x:DataType="vm:SongViewModel"
                            Binding="{Binding Album}"
                            Header="Album" />
                        <DataGridTemplateColumn Width="2*" Header="Comments">
                            <DataGridTemplateColumn.CellTemplate>
                                <DataTemplate>
                                    <TextBlock
                                        HorizontalAlignment="Center"
                                        VerticalAlignment="Center"
                                        Text="{Binding CountOfComment}" />
                                </DataTemplate>
                            </DataGridTemplateColumn.CellTemplate>
                            <DataGridTemplateColumn.CellEditingTemplate>
                                <DataTemplate>
                                    <NumericUpDown
                                        HorizontalAlignment="Stretch"
                                        FormatString="N0"
                                        Minimum="0"
                                        Value="{Binding CountOfComment}" />
                                </DataTemplate>
                            </DataGridTemplateColumn.CellEditingTemplate>
                        </DataGridTemplateColumn>
                    </DataGrid.Columns>
                </DataGrid>
                <Button
                    Grid.Row="2"
                    Margin="12,0,12,12"
                    HorizontalAlignment="Right"
                    Command="{Binding AddCommand}"
                    Content="Add" />
            </Grid>
        </TabItem>
    </TabControl>
</UserControl>
