520 lines
28 KiB
XML
520 lines
28 KiB
XML
<ms:MelWindow
|
|
x:Class="MelskinTest.NeumorphismWindow"
|
|
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
|
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
|
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
|
xmlns:dataModel="clr-namespace:MelskinTest.DataModel"
|
|
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
|
xmlns:ms="https://github.com/ShrlAlgo/Melskin"
|
|
xmlns:neoUiTest="clr-namespace:MelskinTest"
|
|
xmlns:sys="clr-namespace:System;assembly=mscorlib"
|
|
Title="NeumorphismWindow"
|
|
Width="800"
|
|
Height="450"
|
|
d:DataContext="{d:DesignInstance Type=neoUiTest:MainWindow}"
|
|
d:Height="Auto"
|
|
mc:Ignorable="d">
|
|
<ms:MelWindow.Resources>
|
|
<ResourceDictionary>
|
|
<ContextMenu x:Key="ContextMenuDemo">
|
|
<MenuItem Header="菜单01" />
|
|
<MenuItem Header="菜单02" />
|
|
<Separator />
|
|
<MenuItem Header="菜单03">
|
|
<MenuItem Header="菜单A1" />
|
|
<MenuItem Header="菜单A2" />
|
|
<Separator />
|
|
<MenuItem Header="菜单A3" />
|
|
</MenuItem>
|
|
</ContextMenu>
|
|
<neoUiTest:MainViewModel x:Key="MainViewModel" />
|
|
<!-- <ResourceDictionary.MergedDictionaries> -->
|
|
<!-- <enu:ThemesDictionary Theme="Dark" /> -->
|
|
<!-- <enu:ControlsDictionary /> -->
|
|
<!-- </ResourceDictionary.MergedDictionaries> -->
|
|
<dataModel:DataGridDemo x:Key="Dgd" />
|
|
|
|
|
|
</ResourceDictionary>
|
|
|
|
</ms:MelWindow.Resources>
|
|
<Grid>
|
|
<!--<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="Auto" />
|
|
<ColumnDefinition Width="*" />
|
|
</Grid.ColumnDefinitions>-->
|
|
<ms:Anchor>
|
|
<ms:StackPanel Spacing="5">
|
|
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="装饰器 Decoration" Header="Decoration">
|
|
<StackPanel>
|
|
<ms:FlexibleRowPanel>
|
|
<ms:SlotBorder
|
|
Height="100"
|
|
Margin="5"
|
|
HorizontalContentAlignment="Center"
|
|
VerticalContentAlignment="Center"
|
|
Content="凹槽"
|
|
CornerRadius="16"
|
|
FontSize="24"
|
|
Foreground="{DynamicResource PrimaryGradientBrush}" />
|
|
<ms:EmbossBorder
|
|
Margin="5"
|
|
HorizontalContentAlignment="Center"
|
|
VerticalContentAlignment="Center"
|
|
Content="浮雕"
|
|
ContextMenu="{StaticResource ContextMenuDemo}"
|
|
CornerRadius="16"
|
|
FontSize="24"
|
|
Foreground="{DynamicResource PrimaryGradientBrush}"
|
|
ToolTip="右键" />
|
|
<ms:Card
|
|
Margin="5"
|
|
Content="卡片"
|
|
CornerRadius="16"
|
|
FontSize="24"
|
|
Foreground="{DynamicResource PrimaryGradientBrush}" />
|
|
</ms:FlexibleRowPanel>
|
|
|
|
<ms:LightedSurface
|
|
Height="100"
|
|
Margin="5"
|
|
Content="在此处移动鼠标"
|
|
CornerRadius="16"
|
|
FontSize="24"
|
|
Foreground="{DynamicResource PrimaryGradientBrush}" />
|
|
</StackPanel>
|
|
</GroupBox>
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="按钮 Buttons" Header="Buttons">
|
|
<WrapPanel>
|
|
<Button
|
|
Margin="5"
|
|
Padding="10,5"
|
|
Content="浮雕按钮"
|
|
FontSize="16"
|
|
Style="{StaticResource EmbossButtonStyle}" />
|
|
<Button
|
|
Margin="5"
|
|
Padding="10,5"
|
|
FontSize="16"
|
|
Style="{StaticResource EmbossIconButtonStyle}" />
|
|
<Button
|
|
Margin="5"
|
|
Padding="10,5"
|
|
Content="浮动按钮"
|
|
FontSize="16"
|
|
Style="{StaticResource FloatButtonStyle}" />
|
|
<Button
|
|
Margin="5"
|
|
Padding="10,5"
|
|
Content="光亮按钮"
|
|
FontSize="16"
|
|
Style="{StaticResource LightedButtonStyle}" />
|
|
</WrapPanel>
|
|
</GroupBox>
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="文本框 TextBox" Header="TextBox">
|
|
<StackPanel>
|
|
<ms:FlexibleRowPanel>
|
|
<TextBox Style="{StaticResource SlotTextBoxStyle}" />
|
|
<PasswordBox ms:InputAssist.Password="453" Style="{StaticResource SlotPasswordBoxStyle}" />
|
|
<PasswordBox
|
|
ms:InputAssist.Clearable="True"
|
|
ms:InputAssist.IsPasswordVisible="True"
|
|
ms:InputAssist.Password="453"
|
|
Style="{StaticResource SlotPasswordBoxStyle}" />
|
|
</ms:FlexibleRowPanel>
|
|
<ms:FlexibleRowPanel>
|
|
<DatePicker Style="{StaticResource SlotDatePicker}" />
|
|
<ms:NumberBox Style="{StaticResource SlotNumberBoxStyle}" />
|
|
<ms:NumericBox Style="{StaticResource SlotTextBoxStyle}" />
|
|
</ms:FlexibleRowPanel>
|
|
<ms:ChooseBox Style="{StaticResource SlotChooseBoxStyle}" />
|
|
|
|
</StackPanel>
|
|
</GroupBox>
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="Component" Header="Avatar Tag">
|
|
<ms:FlexibleRowPanel>
|
|
<ms:Avatar Style="{StaticResource SlotAvatarStyle}" />
|
|
<ms:Tag Content="Tag" Style="{StaticResource EmbossTag}" />
|
|
<ms:Chip Content="Chip" Style="{StaticResource EmbossChipStyle}" />
|
|
<ms:Chip
|
|
Content="必应"
|
|
Style="{StaticResource EmbossChipStyle}"
|
|
Url="www.bing.com">
|
|
<ms:Chip.Header>
|
|
<ms:IconElement Symbol="Search" />
|
|
</ms:Chip.Header>
|
|
</ms:Chip>
|
|
</ms:FlexibleRowPanel>
|
|
</GroupBox>
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="单选框 RadioButton" Header="RadioButton">
|
|
<ms:FlexibleRowPanel>
|
|
<RadioButton
|
|
Margin="5"
|
|
Padding="10,5"
|
|
Content="浮雕单选框"
|
|
FontSize="16"
|
|
IsChecked="True"
|
|
Style="{StaticResource EmbossRadioButtonStyle}" />
|
|
<RadioButton
|
|
Margin="5"
|
|
Padding="10,5"
|
|
Content="浮雕单选框"
|
|
FontSize="16"
|
|
Style="{StaticResource EmbossRadioButtonStyle}" />
|
|
</ms:FlexibleRowPanel>
|
|
</GroupBox>
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="切换 Toggle" Header="Toggle">
|
|
<StackPanel>
|
|
<ms:FlexibleRowPanel>
|
|
<ToggleButton
|
|
Margin="5"
|
|
Padding="10,5"
|
|
Content="浮雕切换"
|
|
FontSize="16"
|
|
IsChecked="True"
|
|
Style="{StaticResource EmbossToggleButtonStyle}" />
|
|
<ms:ToggleSwitch
|
|
Margin="5"
|
|
Padding="10,5"
|
|
Content="浮雕单选框"
|
|
FontSize="16"
|
|
Style="{StaticResource FloatToggleSwitchStyle}" />
|
|
</ms:FlexibleRowPanel>
|
|
<ms:FlexibleRowPanel>
|
|
<ms:ToggleSwitch
|
|
ms:ControlAssist.OffContent="{ms:Icon SymbolValue=ToggleOff}"
|
|
ms:ControlAssist.OnContent="{ms:Icon ToggleOn}"
|
|
ms:ControlAssist.ShowText="True"
|
|
IsChecked="True"
|
|
Style="{StaticResource SlotToggleSwitch}" />
|
|
<ms:ToggleSwitch
|
|
ms:ControlAssist.OffContent="{ms:Icon SymbolValue=ToggleOff}"
|
|
ms:ControlAssist.OnContent="{ms:Icon ToggleOn}"
|
|
IsChecked="True"
|
|
IsEnabled="False"
|
|
Style="{StaticResource SlotToggleSwitch}" />
|
|
<ms:ToggleSwitch
|
|
ms:ControlAssist.ShowText="False"
|
|
IsChecked="False"
|
|
Style="{StaticResource SlotToggleSwitch}" />
|
|
<ms:ToggleSwitch
|
|
IsChecked="False"
|
|
IsEnabled="False"
|
|
Style="{StaticResource SlotToggleSwitch}" />
|
|
</ms:FlexibleRowPanel>
|
|
<ms:FlexibleRowPanel>
|
|
<ms:ToggleSwitch IsChecked="False" Style="{StaticResource FloatToggleSwitchStyle}" />
|
|
<ms:ToggleSwitch
|
|
IsChecked="False"
|
|
IsEnabled="False"
|
|
Style="{StaticResource FloatToggleSwitchStyle}" />
|
|
<ms:ToggleSwitch IsChecked="True" Style="{StaticResource FloatToggleSwitchStyle}" />
|
|
|
|
<ms:ToggleSwitch
|
|
IsChecked="True"
|
|
IsEnabled="False"
|
|
Style="{StaticResource FloatToggleSwitchStyle}" />
|
|
</ms:FlexibleRowPanel>
|
|
</StackPanel>
|
|
</GroupBox>
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="复选框 CheckBox" Header="CheckBox">
|
|
<StackPanel>
|
|
<ms:FlexibleRowPanel>
|
|
<CheckBox
|
|
Margin="5"
|
|
Padding="10,5"
|
|
Content="浮雕单选框"
|
|
FontSize="16"
|
|
IsChecked="True"
|
|
Style="{StaticResource EmbossCheckBoxStyle}" />
|
|
<CheckBox
|
|
Margin="5"
|
|
Padding="10,5"
|
|
Content="浮雕单选框"
|
|
FontSize="16"
|
|
Style="{StaticResource EmbossCheckBoxStyle}" />
|
|
</ms:FlexibleRowPanel>
|
|
<ms:FlexibleRowPanel>
|
|
<CheckBox
|
|
Margin="5"
|
|
Padding="10,5"
|
|
Content="浮雕单选框"
|
|
FontSize="16"
|
|
IsChecked="True"
|
|
Style="{StaticResource SlotCheckBoxStyle}" />
|
|
<CheckBox
|
|
Margin="5"
|
|
Padding="10,5"
|
|
Content="浮雕单选框"
|
|
FontSize="16"
|
|
Style="{StaticResource SlotCheckBoxStyle}" />
|
|
</ms:FlexibleRowPanel>
|
|
</StackPanel>
|
|
</GroupBox>
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="组合框 ComboBox" Header="ComboBox">
|
|
<ms:FlexibleRowPanel>
|
|
<ComboBox
|
|
Margin="5"
|
|
Padding="10,5"
|
|
FontSize="16"
|
|
Style="{StaticResource FloatComboBoxStyle}" />
|
|
<ms:Cascader
|
|
DisplayMemberPath="Name"
|
|
ItemsSource="{Binding StaffList, Mode=TwoWay}"
|
|
SelectedValue="{Binding SelectedItem, Mode=TwoWay}"
|
|
SubmenuMemberPath="Children" />
|
|
</ms:FlexibleRowPanel>
|
|
</GroupBox>
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="分页导航 Pagination" Header="Pagination">
|
|
<ms:FlexibleRowPanel>
|
|
<ms:Pagination
|
|
Margin="0,15,0,0"
|
|
HorizontalAlignment="Center"
|
|
CurrentPage="3"
|
|
PageSize="20"
|
|
ShowPageInput="True"
|
|
Style="{StaticResource EmbossPaginationStyle}"
|
|
TotalItems="102" />
|
|
</ms:FlexibleRowPanel>
|
|
</GroupBox>
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="标签导航 TabControl" Header="TabControl">
|
|
<ms:FlexibleRowPanel>
|
|
<TabControl Style="{StaticResource NavigationTabControlStyle}">
|
|
<TabItem Header="选项卡 1">
|
|
<Grid Margin="4">
|
|
<!-- <Separator /> -->
|
|
<DataGrid
|
|
Margin="4"
|
|
DataContext="{StaticResource Dgd}"
|
|
ItemsSource="{Binding DataCollection}"
|
|
SelectedItem="{Binding SelectedDataGridItem}" />
|
|
|
|
</Grid>
|
|
</TabItem>
|
|
<TabItem Header="选项卡 2" />
|
|
<TabItem Header="禁用选项卡" IsEnabled="False" />
|
|
</TabControl>
|
|
</ms:FlexibleRowPanel>
|
|
</GroupBox>
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="滑动/滚动条 Slider" Header="Slider Progress">
|
|
<Grid>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="Auto" />
|
|
<ColumnDefinition Width="*" />
|
|
</Grid.ColumnDefinitions>
|
|
<StackPanel>
|
|
<CheckBox x:Name="IsSpining" Content="加载中" />
|
|
<StackPanel Height="100" Orientation="Horizontal">
|
|
<Slider
|
|
x:Name="ProgressVerticalSlider"
|
|
Maximum="100"
|
|
Minimum="0"
|
|
Orientation="Vertical"
|
|
Value="25" />
|
|
<Slider
|
|
x:Name="ProgressVerticalSlider1"
|
|
IsEnabled="False"
|
|
Maximum="100"
|
|
Minimum="0"
|
|
Orientation="Vertical"
|
|
Value="25" />
|
|
<ProgressBar
|
|
Height="100"
|
|
IsIndeterminate="{Binding ElementName=ProgressCheckbox, Path=IsChecked}"
|
|
Maximum="100"
|
|
Minimum="0"
|
|
Orientation="Vertical"
|
|
Style="{StaticResource SlotProgressBarStyle}"
|
|
Value="{Binding ElementName=ProgressVerticalSlider, Path=Value}" />
|
|
<ProgressBar
|
|
Height="100"
|
|
IsEnabled="False"
|
|
IsIndeterminate="{Binding ElementName=ProgressCheckbox, Path=IsChecked}"
|
|
Maximum="100"
|
|
Minimum="0"
|
|
Orientation="Vertical"
|
|
Style="{StaticResource SlotProgressBarStyle}"
|
|
Value="{Binding ElementName=ProgressVerticalSlider, Path=Value}" />
|
|
<ProgressBar
|
|
Height="100"
|
|
IsEnabled="False"
|
|
IsIndeterminate="True"
|
|
Maximum="100"
|
|
Minimum="0"
|
|
Orientation="Vertical"
|
|
Style="{StaticResource SlotProgressBarStyle}"
|
|
Value="100" />
|
|
</StackPanel>
|
|
</StackPanel>
|
|
|
|
<Grid Grid.Column="1" Panel.ZIndex="10">
|
|
<ms:Spin Spinning="{Binding ElementName=IsSpining, Path=IsChecked}" Tip="加载中...">
|
|
<StackPanel x:Name="SpinPanel">
|
|
<CheckBox x:Name="ProgressCheckbox" Content="进度待定" />
|
|
<Slider
|
|
x:Name="ProgressSlider"
|
|
Maximum="100"
|
|
Minimum="0"
|
|
Value="25" />
|
|
<Slider
|
|
x:Name="ProgressTickSlider"
|
|
Maximum="100"
|
|
Minimum="0"
|
|
TickFrequency="10"
|
|
TickPlacement="TopLeft" />
|
|
<Slider
|
|
x:Name="ProgressSlider1"
|
|
IsEnabled="False"
|
|
Maximum="100"
|
|
Minimum="0"
|
|
Value="25" />
|
|
<ProgressBar
|
|
IsIndeterminate="{Binding ElementName=ProgressCheckbox, Path=IsChecked}"
|
|
Maximum="100"
|
|
Minimum="0"
|
|
Style="{StaticResource SlotProgressBarStyle}"
|
|
Value="{Binding ElementName=ProgressSlider, Path=Value}" />
|
|
<ProgressBar
|
|
IsEnabled="False"
|
|
IsIndeterminate="{Binding ElementName=ProgressCheckbox, Path=IsChecked}"
|
|
Maximum="100"
|
|
Minimum="0"
|
|
Style="{StaticResource SlotProgressBarStyle}"
|
|
Value="{Binding ElementName=ProgressSlider, Path=Value}" />
|
|
</StackPanel>
|
|
</ms:Spin>
|
|
<ms:Spin
|
|
HorizontalAlignment="Left"
|
|
Spinning="{Binding ElementName=IsSpining, Path=IsChecked}"
|
|
Tip="加载中...">
|
|
<ms:Spin.Indicator>
|
|
<ms:IconElement Symbol="Downloading" />
|
|
</ms:Spin.Indicator>
|
|
</ms:Spin>
|
|
</Grid>
|
|
</Grid>
|
|
</GroupBox>
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="列表框 ListBox" Header="ListBox">
|
|
<ms:StackPanel Orientation="Horizontal" Spacing="3">
|
|
<ms:StackPanel Spacing="10">
|
|
<ListBox
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"
|
|
ms:BehaviorAssist.EnableSlideAnimation="True"
|
|
SelectedIndex="1"
|
|
Style="{StaticResource SlideTabGroupListBoxStyle}">
|
|
<!-- 这里是你的数据项 -->
|
|
<sys:String>Tab 1</sys:String>
|
|
<sys:String>Tab 2</sys:String>
|
|
<sys:String>Tab 3</sys:String>
|
|
<sys:String>Another Tab</sys:String>
|
|
</ListBox>
|
|
<ListBox
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"
|
|
ms:BehaviorAssist.EnableSlideAnimation="True"
|
|
IsEnabled="False"
|
|
SelectedIndex="1"
|
|
Style="{StaticResource SlideTabGroupListBoxStyle}">
|
|
<!-- 这里是你的数据项 -->
|
|
<sys:String>Tab 1</sys:String>
|
|
<sys:String>Tab 2</sys:String>
|
|
<sys:String>Tab 3</sys:String>
|
|
<sys:String>Another Tab</sys:String>
|
|
</ListBox>
|
|
<ListBox
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"
|
|
ms:BehaviorAssist.EnableSlideAnimation="True"
|
|
SelectedIndex="1"
|
|
Style="{StaticResource EmbossChipListBoxStyle}">
|
|
<!-- 这里是你的数据项 -->
|
|
<sys:String>Tab 1</sys:String>
|
|
<sys:String>Tab 2</sys:String>
|
|
<sys:String>Tab 3</sys:String>
|
|
<sys:String>Another Tab</sys:String>
|
|
</ListBox>
|
|
</ms:StackPanel>
|
|
<ms:StackPanel Orientation="Horizontal" Spacing="3">
|
|
<ListBox
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"
|
|
ms:ControlAssist.Orientation="Vertical"
|
|
SelectedIndex="1"
|
|
SelectionMode="Multiple"
|
|
Style="{StaticResource SlotTabGroupListBoxStyle}">
|
|
<ListBoxItem Content="Home" />
|
|
<ListBoxItem Content="Away" />
|
|
<ListBoxItem Content="Night" />
|
|
</ListBox>
|
|
<ListBox
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"
|
|
ms:ControlAssist.Orientation="Vertical"
|
|
IsEnabled="False"
|
|
SelectedIndex="1"
|
|
Style="{StaticResource SlotTabGroupListBoxStyle}">
|
|
<ListBoxItem Content="Home" />
|
|
<ListBoxItem Content="Away" />
|
|
<ListBoxItem Content="Night" />
|
|
</ListBox>
|
|
<ListBox
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"
|
|
ms:BehaviorAssist.EnableSlideAnimation="True"
|
|
ms:ControlAssist.Orientation="Vertical"
|
|
SelectedIndex="0"
|
|
SelectionMode="Multiple"
|
|
Style="{StaticResource SlideTabGroupListBoxStyle}">
|
|
<!-- 这里是你的数据项 -->
|
|
<sys:String>Tab 1</sys:String>
|
|
<sys:String>Tab 2</sys:String>
|
|
<sys:String>Tab 3</sys:String>
|
|
</ListBox>
|
|
</ms:StackPanel>
|
|
</ms:StackPanel>
|
|
</GroupBox>
|
|
<GroupBox ms:ControlAssist.AnchorHeaderText="折叠 Accordion" Header="Accordion">
|
|
<ms:Accordion
|
|
Width="200"
|
|
BorderThickness="1"
|
|
Style="{StaticResource EmbossAccordionStyle}">
|
|
<ms:AccordionItem Header="User Profile" IsExpanded="True">
|
|
<StackPanel Margin="10">
|
|
<TextBlock Text="Name: John Doe" />
|
|
<TextBlock Text="Email: john.doe@example.com" />
|
|
</StackPanel>
|
|
</ms:AccordionItem>
|
|
<ms:AccordionItem Header="User Profile">
|
|
<StackPanel Margin="10">
|
|
<TextBlock Text="Name: John Doe" />
|
|
<TextBlock Text="Email: john.doe@example.com" />
|
|
</StackPanel>
|
|
</ms:AccordionItem>
|
|
<ms:AccordionItem Header="User Profile">
|
|
<StackPanel Margin="10">
|
|
<TextBlock Text="Name: John Doe" />
|
|
<TextBlock Text="Email: john.doe@example.com" />
|
|
</StackPanel>
|
|
</ms:AccordionItem>
|
|
<ms:AccordionItem Header="Application Settings">
|
|
<StackPanel>
|
|
<CheckBox Content="Enable Dark Mode" />
|
|
<CheckBox Content="Auto-save every 5 minutes" />
|
|
</StackPanel>
|
|
</ms:AccordionItem>
|
|
<ms:AccordionItem Header="Help & Support">
|
|
<TextBlock
|
|
Margin="10"
|
|
Text="For support, please visit our website."
|
|
TextWrapping="Wrap" />
|
|
</ms:AccordionItem>
|
|
</ms:Accordion>
|
|
</GroupBox>
|
|
</ms:StackPanel>
|
|
|
|
</ms:Anchor>
|
|
</Grid>
|
|
</ms:MelWindow>
|