CJKmkp/community
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add:软件启动动画

Browse Source
This commit is contained in:
CJKmkp
2025-10-01 23:26:38 +08:00
parent 5b9c1627c0
commit 4724a432ab
2 changed files with 49 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Ink Canvas/Windows/SplashScreen.xaml
+22 -35
View File
@@ -13,16 +13,17 @@
<Grid> <Grid>
<!-- 背景遮罩 --> <!-- 背景遮罩 -->
<Rectangle Fill="#80000000" /> <Rectangle Fill="#80000000" />
<!-- 启动图片容器 --> <!-- 启动图片容器 -->
<Grid HorizontalAlignment="Center" VerticalAlignment="Center"> <Grid HorizontalAlignment="Center" VerticalAlignment="Center">
<StackPanel> <StackPanel>
<!-- 启动图片 --> <!-- 启动图片 -->
<Image x:Name="StartupImage" <Image x:Name="StartupImage"
Source="pack://application:,,,/Resources/Startup-animation/ICC Autumn.png"
Width="600" Width="600"
Height="450" Height="450"
Stretch="Uniform" /> Stretch="Uniform" />
<!-- 版本号显示 - 右上角 --> <!-- 版本号显示 - 右上角 -->
<TextBlock x:Name="VersionTextBlock" <TextBlock x:Name="VersionTextBlock"
FontSize="12" FontSize="12"
@@ -32,7 +33,7 @@
Margin="0,-385,50,0" Margin="0,-385,50,0"
Opacity="0.8" Opacity="0.8"
Panel.ZIndex="1000" /> Panel.ZIndex="1000" />
<!-- 加载文本 --> <!-- 加载文本 -->
<TextBlock x:Name="LoadingText" <TextBlock x:Name="LoadingText"
Text="正在启动 Ink Canvas..." Text="正在启动 Ink Canvas..."
@@ -41,39 +42,25 @@
Foreground="White" Foreground="White"
HorizontalAlignment="Center" HorizontalAlignment="Center"
Margin="0,-150,0,0" /> Margin="0,-150,0,0" />
<!-- 进度条 --> <!-- 进度条 -->
<ProgressBar x:Name="LoadingProgress" <Grid HorizontalAlignment="Center"
Width="530" Margin="1,-175,0,0"
Height="5" Width="530"
Margin="0,-170,0,0" Height="10">
Background="#40000000" <!-- 进度条填充 -->
Foreground="#0078D4" <Border x:Name="ProgressBarFill"
IsIndeterminate="True"> Background="#0198D4"
<ProgressBar.Style> CornerRadius="2.5"
<Style TargetType="ProgressBar"> HorizontalAlignment="Left"
<Setter Property="Template"> Width="0">
<Setter.Value> </Border>
<ControlTemplate TargetType="ProgressBar"> <!-- 进度条背景 -->
<Grid> <Border x:Name="ProgressBarBackground"
<Border Name="PART_Track" CornerRadius="2.5"
Background="{TemplateBinding Background}" BorderThickness="1"
CornerRadius="4"/> ClipToBounds="True"/>
<Border Name="PART_Indicator" </Grid>
Background="{TemplateBinding Foreground}"
CornerRadius="4"
HorizontalAlignment="Left">
<Border.RenderTransform>
<ScaleTransform ScaleX="1" ScaleY="1"/>
</Border.RenderTransform>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ProgressBar.Style>
</ProgressBar>
</StackPanel> </StackPanel>
</Grid> </Grid>
</Grid> </Grid>
Ink Canvas/Windows/SplashScreen.xaml.cs
+27 -11
View File
@@ -95,29 +95,45 @@ namespace Ink_Canvas.Windows
{ {
Dispatcher.Invoke(() => Dispatcher.Invoke(() =>
{ {
if (LoadingProgress.IsIndeterminate) // 获取进度条容器的实际宽度
double containerWidth = ProgressBarBackground.ActualWidth;
if (containerWidth <= 0)
{ {
LoadingProgress.IsIndeterminate = false; // 如果ActualWidth为0，使用设计时宽度
LoadingProgress.Value = 0; containerWidth = 530;
} }
// 创建平滑过渡动画 // 计算目标宽度
var animation = new DoubleAnimation double targetWidth = containerWidth * (progress / 100.0);
// 创建Storyboard动画
var storyboard = new Storyboard();
// 创建宽度动画
var widthAnimation = new DoubleAnimation
{ {
From = LoadingProgress.Value, From = ProgressBarFill.Width,
To = progress, To = targetWidth,
Duration = TimeSpan.FromMilliseconds(300), Duration = TimeSpan.FromMilliseconds(300),
EasingFunction = new CubicEase { EasingMode = EasingMode.EaseOut } EasingFunction = new CubicEase { EasingMode = EasingMode.EaseOut }
}; };
// 设置动画目标
Storyboard.SetTarget(widthAnimation, ProgressBarFill);
Storyboard.SetTargetProperty(widthAnimation, new PropertyPath(Border.WidthProperty));
// 添加动画到Storyboard
storyboard.Children.Add(widthAnimation);
// 添加动画完成事件 // 添加动画完成事件
animation.Completed += (s, e) => storyboard.Completed += (s, e) =>
{ {
// 确保最终值正确设置 // 确保最终值正确设置
LoadingProgress.Value = progress; ProgressBarFill.Width = targetWidth;
}; };
LoadingProgress.BeginAnimation(ProgressBar.ValueProperty, animation); // 开始动画
storyboard.Begin();
}); });
} }