261 lines
14 KiB
XML
261 lines
14 KiB
XML
<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"
|
|
xmlns:vm="clr-namespace:WPFluent.Gallery.ViewModels.Pages"
|
|
mc:Ignorable="d"
|
|
d:DataContext="{d:DesignInstance vm:CollectionsViewModel,
|
|
IsDesignTimeCreatable=False}"
|
|
Title="CollectionsPage">
|
|
<Grid>
|
|
<StackPanel Grid.Row="1">
|
|
<GroupBox Margin="0" Header="DataGrid">
|
|
<DataGrid Height="400" ItemsSource="{Binding ProductsCollection, Mode=TwoWay}" />
|
|
</GroupBox>
|
|
|
|
<GroupBox Header="UI DataGrid">
|
|
<ui:DataGrid Height="400" ItemsSource="{Binding ProductsCollection, Mode=TwoWay}" />
|
|
</GroupBox>
|
|
<GroupBox Header="ListBox">
|
|
<ListBox
|
|
Height="164"
|
|
d:ItemsSource="{d:SampleData ItemCount=5}"
|
|
ItemsSource="{Binding ListBoxItems, Mode=TwoWay}"
|
|
SelectedIndex="2" />
|
|
</GroupBox>
|
|
<GroupBox Margin="0" Header="ListView with DataTemplate.">
|
|
<ui:ListView
|
|
MaxHeight="200"
|
|
d:ItemsSource="{d:SampleData ItemCount=2}"
|
|
ItemsSource="{Binding 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 BasicListViewItems, Mode=TwoWay}"
|
|
SelectedIndex="1"
|
|
SelectionMode="{Binding ElementName=SelectionModeComboBox,Path=SelectedItem, 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="{DynamicResource 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="{DynamicResource 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="选择模式" Target="{Binding ElementName=SelectionModeComboBox}" />
|
|
<ComboBox x:Name="SelectionModeComboBox" SelectedIndex="0">
|
|
<ComboBox.ItemsSource>
|
|
<x:Array Type="{x:Type SelectionMode}">
|
|
<SelectionMode>Single</SelectionMode>
|
|
<SelectionMode>Multiple</SelectionMode>
|
|
<SelectionMode>Extended</SelectionMode>
|
|
</x:Array>
|
|
</ComboBox.ItemsSource>
|
|
</ComboBox>
|
|
</StackPanel>
|
|
</Grid>
|
|
</GroupBox>
|
|
|
|
<GroupBox Header="ListView with GridView">
|
|
<ui:ListView
|
|
MaxHeight="200"
|
|
BorderThickness="0"
|
|
d:ItemsSource="{d:SampleData ItemCount=2}"
|
|
ItemsSource="{Binding 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="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>
|
|
<GroupBox Header="MultiTreeView">
|
|
<StackPanel>
|
|
<ui:MultiTreeView>
|
|
<ui:MultiTreeViewItem Header="FirstRoot">
|
|
<ui:MultiTreeViewItem Header="First">
|
|
<ui:MultiTreeViewItem Header="1" />
|
|
<ui:MultiTreeViewItem Header="2" />
|
|
</ui:MultiTreeViewItem>
|
|
<ui:MultiTreeViewItem Header="Second" />
|
|
</ui:MultiTreeViewItem>
|
|
<ui:MultiTreeViewItem Header="SecondRoot" />
|
|
<!--<b:Interaction.Triggers>
|
|
<b:EventTrigger EventName="SelectedItemChanged">
|
|
<b:ChangePropertyAction PropertyName="" TargetObject="{Binding}" />
|
|
</b:EventTrigger>
|
|
</b:Interaction.Triggers>-->
|
|
</ui:MultiTreeView>
|
|
<ui:MultiTreeView ItemsSource="{Binding Grades}" SelectedItems="{Binding SelectedItems}">
|
|
<ui:MultiTreeView.ItemTemplate>
|
|
<HierarchicalDataTemplate ItemsSource="{Binding Students}">
|
|
<TextBlock Text="{Binding GradeLevel}" />
|
|
<HierarchicalDataTemplate.ItemTemplate>
|
|
<HierarchicalDataTemplate>
|
|
<TextBlock Text="{Binding Name}" />
|
|
</HierarchicalDataTemplate>
|
|
</HierarchicalDataTemplate.ItemTemplate>
|
|
</HierarchicalDataTemplate>
|
|
</ui:MultiTreeView.ItemTemplate>
|
|
<!--<ui:MultiTreeView.ItemContainerStyle>
|
|
<Style BasedOn="{StaticResource DefaultMultiTreeViewItemStyle}" TargetType="ui:MultiTreeViewItem" />
|
|
</ui:MultiTreeView.ItemContainerStyle>-->
|
|
</ui:MultiTreeView>
|
|
</StackPanel>
|
|
</GroupBox>
|
|
<GroupBox Header="TreeListView">
|
|
<ui:TreeListView ItemsSource="{Binding StaffList}">
|
|
<ui:TreeListView.Columns>
|
|
<GridViewColumnCollection>
|
|
<ui:GridViewColumn Width="400" Header="Name">
|
|
<ui:GridViewColumn.CellTemplate>
|
|
<DataTemplate>
|
|
<ui:TreeRowExpander Content="{Binding Name}" />
|
|
</DataTemplate>
|
|
</ui:GridViewColumn.CellTemplate>
|
|
</ui:GridViewColumn>
|
|
<ui:GridViewColumn
|
|
Width="80"
|
|
DisplayMemberBinding="{Binding Age}"
|
|
Header="Age" />
|
|
<ui:GridViewColumn
|
|
Width="80"
|
|
DisplayMemberBinding="{Binding Sex}"
|
|
Header="Sex" />
|
|
<ui:GridViewColumn
|
|
Width="100"
|
|
DisplayMemberBinding="{Binding Duty}"
|
|
Header="Duty" />
|
|
<ui:GridViewColumn Width="250" Header="IsChecked">
|
|
<ui:GridViewColumn.CellTemplate>
|
|
<DataTemplate>
|
|
<ui:ToggleSwitch IsChecked="{Binding IsChecked}" />
|
|
</DataTemplate>
|
|
</ui:GridViewColumn.CellTemplate>
|
|
</ui:GridViewColumn>
|
|
</GridViewColumnCollection>
|
|
</ui:TreeListView.Columns>
|
|
<ui:TreeListView.ItemTemplate>
|
|
<HierarchicalDataTemplate ItemsSource="{Binding StaffList}" />
|
|
</ui:TreeListView.ItemTemplate>
|
|
</ui:TreeListView>
|
|
</GroupBox>
|
|
<GroupBox Header="TreeModelListView">
|
|
<ui:TreeModelListView Model="{Binding TreeTestModel}">
|
|
<ui:GridView>
|
|
<ui:GridView.Columns>
|
|
<ui:GridViewColumn Header="Column1" Width="400">
|
|
<ui:GridViewColumn.CellTemplate>
|
|
<DataTemplate>
|
|
<ui:TreeModelRowExpander Content="{Binding Column1}" />
|
|
</DataTemplate>
|
|
</ui:GridViewColumn.CellTemplate>
|
|
</ui:GridViewColumn>
|
|
<ui:GridViewColumn
|
|
DisplayMemberBinding="{Binding Column2, Mode=TwoWay}"
|
|
Header="Column2"
|
|
Width="250" />
|
|
<ui:GridViewColumn
|
|
DisplayMemberBinding="{Binding Column3, Mode=TwoWay}"
|
|
Header="Column3"
|
|
Width="250" />
|
|
<ui:GridViewColumn Header="IsChecked" Width="250">
|
|
<ui:GridViewColumn.CellTemplate>
|
|
<DataTemplate>
|
|
<ui:ToggleSwitch IsChecked="{Binding IsChecked}" />
|
|
</DataTemplate>
|
|
</ui:GridViewColumn.CellTemplate>
|
|
</ui:GridViewColumn>
|
|
</ui:GridView.Columns>
|
|
</ui:GridView>
|
|
</ui:TreeModelListView>
|
|
</GroupBox>
|
|
</StackPanel>
|
|
</Grid>
|
|
</Page> |