- Fluent Design 风格 UI,深色/浅色主题切换 - 平滑过渡动画(页面切换、按钮交互、状态变化) - 五大核心功能:安装管理、墨迹管理、格式转换、触摸设置、激活管理 - 基于 dotnetCampus.EasiPlugin.Sdk v2.1.1-alpha.3 插件框架 - WPF 安装向导(欢迎页 -> 安装页 -> 完成页)
453 lines
22 KiB
XML
453 lines
22 KiB
XML
<!--
|
||
MainWindow.xaml - Better-Seewo 安装向导主窗口
|
||
Fluent Design 风格无边框圆角窗口,包含标题栏、内容区域、底部按钮栏和进度指示器
|
||
布局:标题栏(36px) + 内容区域(Frame) + 按钮栏(56px) + 进度指示器
|
||
作者:雾启工作室
|
||
-->
|
||
|
||
<Window x:Class="Better_Seewo.Installer.MainWindow"
|
||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||
Title="Better-Seewo 安装程序"
|
||
Width="640" Height="480"
|
||
ResizeMode="NoResize"
|
||
WindowStyle="None"
|
||
AllowsTransparency="True"
|
||
Background="Transparent"
|
||
WindowStartupLocation="CenterScreen"
|
||
Loaded="Window_Loaded">
|
||
|
||
<!-- ===== 窗口入场动画:透明度 + 缩放 ===== -->
|
||
<Window.Triggers>
|
||
<EventTrigger RoutedEvent="Window.Loaded">
|
||
<BeginStoryboard>
|
||
<Storyboard>
|
||
<!-- 窗口从透明渐入不透明 -->
|
||
<DoubleAnimation Storyboard.TargetName="RootBorder"
|
||
Storyboard.TargetProperty="Opacity"
|
||
From="0" To="1"
|
||
Duration="0:0:0.300">
|
||
<DoubleAnimation.EasingFunction>
|
||
<CubicEase EasingMode="EaseOut" />
|
||
</DoubleAnimation.EasingFunction>
|
||
</DoubleAnimation>
|
||
<!-- 窗口水平缩放:从略小到正常 -->
|
||
<DoubleAnimation Storyboard.TargetName="RootBorder"
|
||
Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"
|
||
From="0.95" To="1.0"
|
||
Duration="0:0:0.300">
|
||
<DoubleAnimation.EasingFunction>
|
||
<CubicEase EasingMode="EaseOut" />
|
||
</DoubleAnimation.EasingFunction>
|
||
</DoubleAnimation>
|
||
<!-- 窗口垂直缩放:从略小到正常 -->
|
||
<DoubleAnimation Storyboard.TargetName="RootBorder"
|
||
Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"
|
||
From="0.95" To="1.0"
|
||
Duration="0:0:0.300">
|
||
<DoubleAnimation.EasingFunction>
|
||
<CubicEase EasingMode="EaseOut" />
|
||
</DoubleAnimation.EasingFunction>
|
||
</DoubleAnimation>
|
||
</Storyboard>
|
||
</BeginStoryboard>
|
||
</EventTrigger>
|
||
</Window.Triggers>
|
||
|
||
<!-- ===== 窗口根容器(带阴影和圆角) ===== -->
|
||
<Border x:Name="RootBorder"
|
||
Background="{DynamicResource BackgroundBrush}"
|
||
CornerRadius="{DynamicResource WindowCornerRadius}"
|
||
BorderThickness="1"
|
||
BorderBrush="{DynamicResource BorderBrush}"
|
||
Effect="{DynamicResource WindowShadow}"
|
||
ClipToBounds="True"
|
||
Opacity="0">
|
||
|
||
<!-- 缩放变换(用于入场动画) -->
|
||
<Border.RenderTransform>
|
||
<ScaleTransform ScaleX="1.0" ScaleY="1.0" />
|
||
</Border.RenderTransform>
|
||
|
||
<!-- ===== 主网格布局 ===== -->
|
||
<Grid>
|
||
<Grid.RowDefinitions>
|
||
<!-- 顶部标题栏(36px) -->
|
||
<RowDefinition Height="36" />
|
||
<!-- 中间内容区域(自适应) -->
|
||
<RowDefinition Height="*" />
|
||
<!-- 底部按钮栏(56px) -->
|
||
<RowDefinition Height="56" />
|
||
<!-- 底部进度指示器(24px) -->
|
||
<RowDefinition Height="24" />
|
||
</Grid.RowDefinitions>
|
||
|
||
<!-- ============================== -->
|
||
<!-- ===== 顶部自定义标题栏 ===== -->
|
||
<!-- ============================== -->
|
||
<Grid Grid.Row="0"
|
||
Background="{DynamicResource TitleBarBackgroundBrush}"
|
||
MouseLeftButtonDown="TitleBar_MouseLeftButtonDown">
|
||
|
||
<Grid.ColumnDefinitions>
|
||
<!-- 左侧:Logo 和标题 -->
|
||
<ColumnDefinition Width="*" />
|
||
<!-- 右侧:关闭按钮 -->
|
||
<ColumnDefinition Width="Auto" />
|
||
</Grid.ColumnDefinitions>
|
||
|
||
<!-- 应用 Logo(六边形图标) + 标题 -->
|
||
<StackPanel Grid.Column="0"
|
||
Orientation="Horizontal"
|
||
VerticalAlignment="Center"
|
||
Margin="12,0,0,0">
|
||
|
||
<!-- 六边形 Logo -->
|
||
<Path Data="M12 2L22 7.5V16.5L12 22L2 16.5V7.5L12 2Z"
|
||
Fill="{DynamicResource AccentBrush}"
|
||
Stretch="Uniform"
|
||
Width="16" Height="16"
|
||
Margin="0,0,8,0" />
|
||
|
||
<!-- 标题文字 -->
|
||
<TextBlock Text="Better-Seewo 安装程序"
|
||
FontSize="12"
|
||
FontWeight="SemiBold"
|
||
Foreground="{DynamicResource TextPrimaryBrush}"
|
||
VerticalAlignment="Center" />
|
||
</StackPanel>
|
||
|
||
<!-- 关闭按钮(悬停红色) -->
|
||
<Button x:Name="BtnClose"
|
||
Grid.Column="1"
|
||
Content=""
|
||
FontFamily="Segoe MDL2 Assets"
|
||
FontSize="10"
|
||
Width="46" Height="36"
|
||
Background="Transparent"
|
||
Foreground="{DynamicResource TextSecondaryBrush}"
|
||
BorderThickness="0"
|
||
Cursor="Hand"
|
||
Click="BtnClose_Click"
|
||
Style="{DynamicResource CloseButtonStyle}" />
|
||
</Grid>
|
||
|
||
<!-- 分隔线(标题栏下方) -->
|
||
<Border Grid.Row="0"
|
||
VerticalAlignment="Bottom"
|
||
Height="1"
|
||
Background="{DynamicResource BorderBrush}" />
|
||
|
||
<!-- ============================== -->
|
||
<!-- ===== 中间内容区域 ===== -->
|
||
<!-- ============================== -->
|
||
<Grid Grid.Row="1"
|
||
ClipToBounds="True">
|
||
|
||
<!-- 页面导航 Frame -->
|
||
<Frame x:Name="ContentFrame"
|
||
NavigationUIVisibility="Hidden"
|
||
ClipToBounds="True" />
|
||
</Grid>
|
||
|
||
<!-- 分隔线(内容区域下方) -->
|
||
<Border Grid.Row="1"
|
||
VerticalAlignment="Bottom"
|
||
Height="1"
|
||
Background="{DynamicResource BorderBrush}" />
|
||
|
||
<!-- ============================== -->
|
||
<!-- ===== 底部按钮栏 ===== -->
|
||
<!-- ============================== -->
|
||
<Grid Grid.Row="2"
|
||
Background="{DynamicResource FooterBackgroundBrush}">
|
||
|
||
<Grid.ColumnDefinitions>
|
||
<!-- 左侧:返回按钮 -->
|
||
<ColumnDefinition Width="Auto" />
|
||
<!-- 中间:弹性空间 -->
|
||
<ColumnDefinition Width="*" />
|
||
<!-- 右侧:下一步/安装/完成按钮 -->
|
||
<ColumnDefinition Width="Auto" />
|
||
</Grid.ColumnDefinitions>
|
||
|
||
<!-- 返回按钮 -->
|
||
<Button x:Name="BtnBack"
|
||
Grid.Column="0"
|
||
Content=" 返回"
|
||
FontFamily="Segoe MDL2 Assets, Microsoft YaHei UI"
|
||
FontSize="13"
|
||
Height="34"
|
||
Padding="16,0"
|
||
Margin="16,0,0,0"
|
||
Background="Transparent"
|
||
Foreground="{DynamicResource TextSecondaryBrush}"
|
||
BorderThickness="1"
|
||
BorderBrush="{DynamicResource BorderBrush}"
|
||
Cursor="Hand"
|
||
Visibility="Collapsed"
|
||
Click="BtnBack_Click"
|
||
Style="{DynamicResource ActionButtonStyle}" />
|
||
|
||
<!-- 下一步按钮(欢迎页) -->
|
||
<Button x:Name="BtnNext"
|
||
Grid.Column="2"
|
||
Content="下一步 "
|
||
FontFamily="Microsoft YaHei UI, Segoe MDL2 Assets"
|
||
FontSize="13"
|
||
FontWeight="SemiBold"
|
||
Height="34"
|
||
Padding="20,0"
|
||
Margin="0,0,16,0"
|
||
Background="{DynamicResource AccentBrush}"
|
||
Foreground="White"
|
||
BorderThickness="0"
|
||
Cursor="Hand"
|
||
Click="BtnNext_Click"
|
||
Style="{DynamicResource PrimaryButtonStyle}" />
|
||
|
||
<!-- 安装按钮(安装页,默认隐藏) -->
|
||
<Button x:Name="BtnInstall"
|
||
Grid.Column="2"
|
||
Content="开始安装 "
|
||
FontFamily="Microsoft YaHei UI, Segoe MDL2 Assets"
|
||
FontSize="13"
|
||
FontWeight="SemiBold"
|
||
Height="34"
|
||
Padding="20,0"
|
||
Margin="0,0,16,0"
|
||
Background="{DynamicResource AccentBrush}"
|
||
Foreground="White"
|
||
BorderThickness="0"
|
||
Cursor="Hand"
|
||
Visibility="Collapsed"
|
||
Click="BtnInstall_Click"
|
||
Style="{DynamicResource PrimaryButtonStyle}" />
|
||
|
||
<!-- 完成按钮(完成页,默认隐藏) -->
|
||
<Button x:Name="BtnFinish"
|
||
Grid.Column="2"
|
||
Content="完成"
|
||
FontFamily="Microsoft YaHei UI"
|
||
FontSize="13"
|
||
FontWeight="SemiBold"
|
||
Height="34"
|
||
Padding="24,0"
|
||
Margin="0,0,16,0"
|
||
Background="{DynamicResource AccentBrush}"
|
||
Foreground="White"
|
||
BorderThickness="0"
|
||
Cursor="Hand"
|
||
Visibility="Collapsed"
|
||
Click="BtnFinish_Click"
|
||
Style="{DynamicResource PrimaryButtonStyle}" />
|
||
</Grid>
|
||
|
||
<!-- ============================== -->
|
||
<!-- ===== 底部进度指示器 ===== -->
|
||
<!-- ============================== -->
|
||
<Grid Grid.Row="3"
|
||
Background="{DynamicResource FooterBackgroundBrush}">
|
||
|
||
<!-- 三个圆点指示器,表示三个安装步骤 -->
|
||
<StackPanel Orientation="Horizontal"
|
||
HorizontalAlignment="Center"
|
||
VerticalAlignment="Center">
|
||
|
||
<!-- 圆点 1:欢迎页 -->
|
||
<Ellipse x:Name="Dot1"
|
||
Width="8" Height="8"
|
||
Fill="{DynamicResource AccentBrush}"
|
||
Margin="0,0,8,0" />
|
||
|
||
<!-- 圆点 2:安装页 -->
|
||
<Ellipse x:Name="Dot2"
|
||
Width="8" Height="8"
|
||
Fill="{DynamicResource BorderBrush}"
|
||
Margin="0,0,8,0" />
|
||
|
||
<!-- 圆点 3:完成页 -->
|
||
<Ellipse x:Name="Dot3"
|
||
Width="8" Height="8"
|
||
Fill="{DynamicResource BorderBrush}" />
|
||
</StackPanel>
|
||
</Grid>
|
||
</Grid>
|
||
</Border>
|
||
|
||
<!-- ===== 窗口级样式资源 ===== -->
|
||
<Window.Resources>
|
||
|
||
<!-- ===== 主要按钮样式(强调色背景,悬停缩放) ===== -->
|
||
<Style x:Key="PrimaryButtonStyle" TargetType="Button">
|
||
<Setter Property="Template">
|
||
<Setter.Value>
|
||
<ControlTemplate TargetType="Button">
|
||
<Border x:Name="BtnBg"
|
||
Background="{TemplateBinding Background}"
|
||
CornerRadius="6"
|
||
Padding="{TemplateBinding Padding}">
|
||
<ContentPresenter x:Name="BtnContent"
|
||
HorizontalAlignment="Center"
|
||
VerticalAlignment="Center" />
|
||
</Border>
|
||
|
||
<ControlTemplate.Triggers>
|
||
<!-- 鼠标悬停:缩放 + 变色 -->
|
||
<Trigger Property="IsMouseOver" Value="True">
|
||
<Setter TargetName="BtnBg" Property="Background" Value="{DynamicResource AccentHoverBrush}" />
|
||
</Trigger>
|
||
<!-- 鼠标按下 -->
|
||
<Trigger Property="IsPressed" Value="True">
|
||
<Setter TargetName="BtnBg" Property="Background" Value="{DynamicResource AccentPressedBrush}" />
|
||
</Trigger>
|
||
</ControlTemplate.Triggers>
|
||
</ControlTemplate>
|
||
</Setter.Value>
|
||
</Setter>
|
||
|
||
<!-- 悬停缩放动画 -->
|
||
<Style.Triggers>
|
||
<EventTrigger RoutedEvent="MouseEnter">
|
||
<BeginStoryboard>
|
||
<Storyboard>
|
||
<DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"
|
||
To="1.05" Duration="0:0:0.200">
|
||
<DoubleAnimation.EasingFunction>
|
||
<CubicEase EasingMode="EaseOut" />
|
||
</DoubleAnimation.EasingFunction>
|
||
</DoubleAnimation>
|
||
<DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"
|
||
To="1.05" Duration="0:0:0.200">
|
||
<DoubleAnimation.EasingFunction>
|
||
<CubicEase EasingMode="EaseOut" />
|
||
</DoubleAnimation.EasingFunction>
|
||
</DoubleAnimation>
|
||
</Storyboard>
|
||
</BeginStoryboard>
|
||
</EventTrigger>
|
||
<EventTrigger RoutedEvent="MouseLeave">
|
||
<BeginStoryboard>
|
||
<Storyboard>
|
||
<DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"
|
||
To="1.0" Duration="0:0:0.200">
|
||
<DoubleAnimation.EasingFunction>
|
||
<CubicEase EasingMode="EaseOut" />
|
||
</DoubleAnimation.EasingFunction>
|
||
</DoubleAnimation>
|
||
<DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"
|
||
To="1.0" Duration="0:0:0.200">
|
||
<DoubleAnimation.EasingFunction>
|
||
<CubicEase EasingMode="EaseOut" />
|
||
</DoubleAnimation.EasingFunction>
|
||
</DoubleAnimation>
|
||
</Storyboard>
|
||
</BeginStoryboard>
|
||
</EventTrigger>
|
||
</Style.Triggers>
|
||
</Style>
|
||
|
||
<!-- ===== 次要按钮样式(透明背景 + 边框,悬停缩放) ===== -->
|
||
<Style x:Key="ActionButtonStyle" TargetType="Button">
|
||
<Setter Property="Template">
|
||
<Setter.Value>
|
||
<ControlTemplate TargetType="Button">
|
||
<Border x:Name="BtnBg"
|
||
Background="Transparent"
|
||
BorderBrush="{TemplateBinding BorderBrush}"
|
||
BorderThickness="{TemplateBinding BorderThickness}"
|
||
CornerRadius="6"
|
||
Padding="{TemplateBinding Padding}">
|
||
<ContentPresenter x:Name="BtnContent"
|
||
HorizontalAlignment="Center"
|
||
VerticalAlignment="Center" />
|
||
</Border>
|
||
|
||
<ControlTemplate.Triggers>
|
||
<!-- 鼠标悬停:浅色背景 -->
|
||
<Trigger Property="IsMouseOver" Value="True">
|
||
<Setter TargetName="BtnBg" Property="Background" Value="{DynamicResource WindowButtonHoverBrush}" />
|
||
</Trigger>
|
||
<!-- 鼠标按下 -->
|
||
<Trigger Property="IsPressed" Value="True">
|
||
<Setter TargetName="BtnBg" Property="Background" Value="{DynamicResource WindowButtonPressedBrush}" />
|
||
</Trigger>
|
||
</ControlTemplate.Triggers>
|
||
</ControlTemplate>
|
||
</Setter.Value>
|
||
</Setter>
|
||
|
||
<!-- 悬停缩放动画 -->
|
||
<Style.Triggers>
|
||
<EventTrigger RoutedEvent="MouseEnter">
|
||
<BeginStoryboard>
|
||
<Storyboard>
|
||
<DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"
|
||
To="1.05" Duration="0:0:0.200">
|
||
<DoubleAnimation.EasingFunction>
|
||
<CubicEase EasingMode="EaseOut" />
|
||
</DoubleAnimation.EasingFunction>
|
||
</DoubleAnimation>
|
||
<DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"
|
||
To="1.05" Duration="0:0:0.200">
|
||
<DoubleAnimation.EasingFunction>
|
||
<CubicEase EasingMode="EaseOut" />
|
||
</DoubleAnimation.EasingFunction>
|
||
</DoubleAnimation>
|
||
</Storyboard>
|
||
</BeginStoryboard>
|
||
</EventTrigger>
|
||
<EventTrigger RoutedEvent="MouseLeave">
|
||
<BeginStoryboard>
|
||
<Storyboard>
|
||
<DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"
|
||
To="1.0" Duration="0:0:0.200">
|
||
<DoubleAnimation.EasingFunction>
|
||
<CubicEase EasingMode="EaseOut" />
|
||
</DoubleAnimation.EasingFunction>
|
||
</DoubleAnimation>
|
||
<DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"
|
||
To="1.0" Duration="0:0:0.200">
|
||
<DoubleAnimation.EasingFunction>
|
||
<CubicEase EasingMode="EaseOut" />
|
||
</DoubleAnimation.EasingFunction>
|
||
</DoubleAnimation>
|
||
</Storyboard>
|
||
</BeginStoryboard>
|
||
</EventTrigger>
|
||
</Style.Triggers>
|
||
</Style>
|
||
|
||
<!-- ===== 关闭按钮样式(悬停红色) ===== -->
|
||
<Style x:Key="CloseButtonStyle" TargetType="Button">
|
||
<Setter Property="Template">
|
||
<Setter.Value>
|
||
<ControlTemplate TargetType="Button">
|
||
<Border x:Name="BtnBg"
|
||
Background="Transparent"
|
||
CornerRadius="0">
|
||
<ContentPresenter x:Name="CloseIcon"
|
||
HorizontalAlignment="Center"
|
||
VerticalAlignment="Center" />
|
||
</Border>
|
||
|
||
<ControlTemplate.Triggers>
|
||
<!-- 鼠标悬停 - 红色背景 -->
|
||
<Trigger Property="IsMouseOver" Value="True">
|
||
<Setter TargetName="BtnBg" Property="Background" Value="{DynamicResource CloseHoverBrush}" />
|
||
<Setter TargetName="CloseIcon" Property="TextBlock.Foreground" Value="White" />
|
||
</Trigger>
|
||
<!-- 鼠标按下 - 深红色背景 -->
|
||
<Trigger Property="IsPressed" Value="True">
|
||
<Setter TargetName="BtnBg" Property="Background" Value="{DynamicResource ClosePressedBrush}" />
|
||
<Setter TargetName="CloseIcon" Property="TextBlock.Foreground" Value="White" />
|
||
</Trigger>
|
||
</ControlTemplate.Triggers>
|
||
</ControlTemplate>
|
||
</Setter.Value>
|
||
</Setter>
|
||
</Style>
|
||
</Window.Resources>
|
||
|
||
</Window>
|