253 lines
13 KiB
XML
253 lines
13 KiB
XML
<Page
|
|
x:Class="WPFluent.Gallery.Views.Pages.LayoutPage"
|
|
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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
|
xmlns:models="clr-namespace:WPFluent.Gallery.Models"
|
|
xmlns:pages="clr-namespace:WPFluent.Gallery.Views.Pages"
|
|
xmlns:ui="https://github.com/ShrlAlgo/WPFluent" xmlns:pages1="clr-namespace:WPFluent.Gallery.ViewModels.Pages"
|
|
mc:Ignorable="d"
|
|
d:DataContext="{d:DesignInstance pages:LayoutPage,
|
|
IsDesignTimeCreatable=False}"
|
|
Foreground="{DynamicResource TextFillColorPrimaryBrush}"
|
|
Title="DialogsAndFlyoutsPage">
|
|
|
|
<StackPanel>
|
|
<GroupBox Margin="0" Header="An Expander with text in the header and content areas">
|
|
<Grid>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="*" />
|
|
<ColumnDefinition Width="Auto" />
|
|
</Grid.ColumnDefinitions>
|
|
<Expander
|
|
Grid.Column="0"
|
|
Content="This is in the content"
|
|
Header="This text is in the header" />
|
|
<!-- TODO: ExpandDirection -->
|
|
</Grid>
|
|
</GroupBox>
|
|
|
|
<GroupBox Header="An Expander with an Icon, a header text, a description, a control, and content areas">
|
|
<Grid>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="*" />
|
|
<ColumnDefinition Width="Auto" />
|
|
</Grid.ColumnDefinitions>
|
|
<ui:CardExpander Grid.Column="0" Icon="{ui:SymbolIcon PlaySettings20}">
|
|
<ui:CardExpander.Header>
|
|
<Grid>
|
|
<Grid.RowDefinitions>
|
|
<RowDefinition Height="Auto" />
|
|
<RowDefinition Height="Auto" />
|
|
</Grid.RowDefinitions>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="*" />
|
|
<ColumnDefinition Width="Auto" />
|
|
</Grid.ColumnDefinitions>
|
|
<ui:TextBlock
|
|
Grid.Row="0"
|
|
Grid.Column="0"
|
|
FontSize="16"
|
|
FontTypography="Body"
|
|
Text="This is a header text" />
|
|
<ui:ToggleSwitch
|
|
Grid.Row="0"
|
|
Grid.RowSpan="2"
|
|
Grid.Column="1"
|
|
Margin="0,0,16,0"
|
|
OffContent="Off"
|
|
OnContent="On" />
|
|
<ui:TextBlock
|
|
Grid.Row="1"
|
|
Grid.Column="0"
|
|
FontSize="12"
|
|
Foreground="{DynamicResource TextFillColorSecondaryBrush}"
|
|
Text="This is a description text" />
|
|
</Grid>
|
|
</ui:CardExpander.Header>
|
|
<StackPanel Margin="24,0.5,24,0">
|
|
<ui:CardControl Header="This is an item" Padding="20,10,20,10">
|
|
<ui:ToggleSwitch
|
|
HorizontalContentAlignment="Left"
|
|
IsEnabled="True"
|
|
OffContent="Off"
|
|
OnContent="On" />
|
|
</ui:CardControl>
|
|
<ui:CardControl
|
|
Margin="0,0.5,0,0"
|
|
Icon="{ui:SymbolIcon FlashSettings24}"
|
|
Padding="20,10,20,10">
|
|
<ui:CardControl.Header>
|
|
<StackPanel>
|
|
<ui:TextBlock
|
|
Margin="0"
|
|
FontTypography="BodyStrong"
|
|
Foreground="{DynamicResource TextFillColorPrimaryBrush}"
|
|
Text="This is a header text"
|
|
TextWrapping="WrapWithOverflow" />
|
|
<ui:TextBlock
|
|
Appearance="Secondary"
|
|
Foreground="{DynamicResource TextFillColorSecondaryBrush}"
|
|
Text="This is a description text."
|
|
TextWrapping="WrapWithOverflow" />
|
|
</StackPanel>
|
|
</ui:CardControl.Header>
|
|
<ui:DropDownButton Content="Hello" Icon="{ui:SymbolIcon Fluent24}">
|
|
<ui:DropDownButton.Flyout>
|
|
<ContextMenu>
|
|
<MenuItem Header="Add" />
|
|
<MenuItem Header="Remove" />
|
|
<MenuItem Header="Send" />
|
|
<MenuItem Header="Hello" />
|
|
</ContextMenu>
|
|
</ui:DropDownButton.Flyout>
|
|
</ui:DropDownButton>
|
|
|
|
</ui:CardControl>
|
|
</StackPanel>
|
|
</ui:CardExpander>
|
|
<!-- TODO: ExpandDirection -->
|
|
</Grid>
|
|
</GroupBox>
|
|
<GroupBox Header="A card control with a header and a button.">
|
|
<Grid>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="*" />
|
|
<ColumnDefinition Width="Auto" />
|
|
</Grid.ColumnDefinitions>
|
|
<ui:CardControl Grid.Column="0">
|
|
<ui:CardControl.Header>
|
|
<TextBlock Text="This is the header text." />
|
|
</ui:CardControl.Header>
|
|
<ui:Button Content="Button" />
|
|
</ui:CardControl>
|
|
</Grid>
|
|
</GroupBox>
|
|
<GroupBox Header="A card control with an icon, a header, a description, and a control">
|
|
<Grid>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="*" />
|
|
<ColumnDefinition Width="Auto" />
|
|
</Grid.ColumnDefinitions>
|
|
<ui:CardControl
|
|
Margin="4"
|
|
Icon="{ui:SymbolIcon FlashSettings24}"
|
|
Padding="20,10,20,10">
|
|
<ui:CardControl.Header>
|
|
<StackPanel>
|
|
<ui:TextBlock
|
|
Margin="0"
|
|
FontTypography="BodyStrong"
|
|
Foreground="{DynamicResource TextFillColorPrimaryBrush}"
|
|
Text="This is the header text"
|
|
TextWrapping="WrapWithOverflow" />
|
|
<ui:TextBlock
|
|
Appearance="Secondary"
|
|
Foreground="{DynamicResource TextFillColorSecondaryBrush}"
|
|
Text="This is a description text."
|
|
TextWrapping="WrapWithOverflow" />
|
|
</StackPanel>
|
|
</ui:CardControl.Header>
|
|
<ui:ToggleSwitch
|
|
HorizontalContentAlignment="Left"
|
|
IsEnabled="True"
|
|
OffContent="Off"
|
|
OnContent="On" />
|
|
</ui:CardControl>
|
|
</Grid>
|
|
</GroupBox>
|
|
|
|
<GroupBox Header="A card control with an ImageIcon, a header, a description, and a DropDownButton">
|
|
<Grid>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="*" />
|
|
<ColumnDefinition Width="Auto" />
|
|
</Grid.ColumnDefinitions>
|
|
<ui:CardControl
|
|
Margin="4"
|
|
Icon="{ui:ImageIcon pack://application:\,\,\,/WPFluent.Gallery;component/wpfui.png}"
|
|
Padding="20,10,20,10">
|
|
<ui:CardControl.Header>
|
|
<StackPanel>
|
|
<ui:TextBlock
|
|
Margin="0"
|
|
FontTypography="BodyStrong"
|
|
Foreground="{DynamicResource TextFillColorPrimaryBrush}"
|
|
Text="This is the header text"
|
|
TextWrapping="WrapWithOverflow" />
|
|
<ui:TextBlock
|
|
Appearance="Secondary"
|
|
Foreground="{DynamicResource TextFillColorSecondaryBrush}"
|
|
Text="This is a description text."
|
|
TextWrapping="WrapWithOverflow" />
|
|
</StackPanel>
|
|
</ui:CardControl.Header>
|
|
<StackPanel Orientation="Horizontal">
|
|
<ui:DropDownButton Content="Hello" Icon="{ui:SymbolIcon Fluent24}">
|
|
<ui:DropDownButton.Flyout>
|
|
<ContextMenu>
|
|
<MenuItem Header="Add" />
|
|
<MenuItem Header="Remove" />
|
|
<MenuItem Header="Send" />
|
|
<MenuItem Header="Hello" />
|
|
</ContextMenu>
|
|
</ui:DropDownButton.Flyout>
|
|
</ui:DropDownButton>
|
|
<ui:DropDownButton>
|
|
选择剖面框
|
|
<ui:DropDownButton.Flyout>
|
|
<ContextMenu>
|
|
<MenuItem d:DataContext="{d:DesignInstance Type=pages1:LayoutViewModel}" Command="{Binding ShowDialogCommand}" Header="选择剖面框" />
|
|
<MenuItem Header="框选剖面框" />
|
|
</ContextMenu>
|
|
</ui:DropDownButton.Flyout>
|
|
</ui:DropDownButton>
|
|
</StackPanel>
|
|
</ui:CardControl>
|
|
</Grid>
|
|
</GroupBox>
|
|
<GroupBox Header="A CardAction with an ImageIcon and a header.">
|
|
<Grid>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="*" />
|
|
<ColumnDefinition Width="Auto" />
|
|
</Grid.ColumnDefinitions>
|
|
<ui:CardAction Grid.Column="0" Icon="{ui:ImageIcon pack://application:\,\,\,/WPFluent.Gallery;component/wpfui.png}">
|
|
<StackPanel>
|
|
<ui:TextBlock
|
|
Margin="0"
|
|
FontTypography="Body"
|
|
Foreground="{DynamicResource TextFillColorPrimaryBrush}"
|
|
Text="This is the header text"
|
|
TextWrapping="WrapWithOverflow" />
|
|
</StackPanel>
|
|
</ui:CardAction>
|
|
</Grid>
|
|
</GroupBox>
|
|
<GroupBox Header="A CardAction with an icon, a header and a description.">
|
|
<Grid>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="*" />
|
|
<ColumnDefinition Width="Auto" />
|
|
</Grid.ColumnDefinitions>
|
|
<ui:CardAction Grid.Column="0" Icon="{ui:SymbolIcon DocumentEdit20, FontSize=43, Filled=False}">
|
|
<StackPanel>
|
|
<ui:TextBlock
|
|
Margin="0"
|
|
FontTypography="BodyStrong"
|
|
Foreground="{DynamicResource TextFillColorPrimaryBrush}"
|
|
Text="This is the header text"
|
|
TextWrapping="WrapWithOverflow" />
|
|
<ui:TextBlock
|
|
Appearance="Secondary"
|
|
Foreground="{DynamicResource TextFillColorSecondaryBrush}"
|
|
Text="This is a description text."
|
|
TextWrapping="WrapWithOverflow" />
|
|
</StackPanel>
|
|
</ui:CardAction>
|
|
</Grid>
|
|
</GroupBox>
|
|
</StackPanel>
|
|
</Page> |