文章目录
- 1、案例效果展示
- 2、项目准备
- 3、功能实现
- 1、资源获取
- 2、界面代码
- 3、后台代码
- 4 源代码获取
1、案例效果展示
2、项目准备
打开项目 Wpf_Examples，新建系统初始化界面 WelcomeWindow.xmal,如下所示：
3、功能实现
1、资源获取
案例中使用的CSDN文字为路径文字，从字体SVG文件中获取。本案例字体资源从 阿里巴巴矢量图 官网下载，点击搜索 CSDN ,找到对应的文字，点击下载，这里我们选择 SVG 下载。如下所示：
下载完成后，用文本阅读器打开，数据如下所示， path 标签中的坐标数据就是文字的路径数据。
2、界面代码
打开 WelcomeWindow.xaml 文件，编写代码如下所示：
<Window x:Class="Wpf_Examples.WelcomeWindow"
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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Wpf_Examples"
mc:Ignorable="d"
Title="WelcomeWindow" Height="500" Width="800" WindowStartupLocation="CenterScreen" AllowsTransparency="True" WindowStyle="None" Background="#2B2B2B">
<Grid>
<Path Data="M672.3 374.247c-30.004-6.186-61.074-9.065-91.75-9.686-41.186-0.835-41.774 0.635-46.343 40.45-5.635 49.097-10.224 98.314-15.64 151.145 31.054 0.646 60.628 2.199 90.162 1.626 32.461-0.63 63.944-6.411 90.444-27.425 29.844-23.666 39.59-55.474 34.12-91.765-5.254-34.867-27.342-57.407-60.993-64.345zM657.9 500.909c-23.9 18.075-51.307 20.666-82.688 16.614 3.779-38.04 7.468-75.167 11.5-115.769 18.167 1.276 34.454 1.295 50.342 3.82 20.17 3.204 36.022 13.484 40.777 34.985 5.268 23.816 0.293 45.056-19.931 60.35zM503.672 369.781l-5.205 37.703c-25.128-2.17-49.037-5.15-73.02-5.935-12.665-0.414-25.856 1.652-38.011 5.277-5.57 1.66-9.214 9.78-13.732 14.97 4.812 4.14 8.979 10.243 14.549 12.07 20.29 6.658 41.375 10.944 61.541 17.913 21.156 7.313 42.117 17.12 43.124 43.802 1.026 27.151-17.099 42.174-39.516 51.34-49.97 20.434-101.25 18.301-152.551 5.273-2.898-0.735-6.616-6.172-6.523-9.32 0.314-10.57 2.18-21.095 3.245-29.927 30.602 2.395 60.003 5.355 89.477 6.611 9.123 0.389 19.113-2.468 27.426-6.487 5.15-2.49 10.99-10.093 10.78-15.165-0.184-4.475-7.63-10.625-13.09-12.52-13.768-4.781-28.475-6.82-42.335-11.387-13.833-4.56-27.959-9.38-40.432-16.688-29.592-17.34-31.312-47.346-4.841-69.316 20.355-16.894 44.993-22.24 70.433-25.528 31.711-4.096 84.277-1.034 108.681 7.314z m455.801 75.302c-2.599 35.797-7 71.465-10.665 107.834h-57.09c3.668-34.127 6.728-67.477 10.968-100.675 4.238-33.183-7.368-47.763-40.655-48.962-40.755-1.469-40.883-1.483-45.266 38.808-3.95 36.326-7.58 72.687-11.507 110.53H749.93c5.7-58.204 11.108-115.277 17.277-172.27 0.41-3.788 6.15-9.25 10.18-10.045 38.78-7.658 77.797-12.579 117.374-6.016 46.51 7.712 68.124 33.798 64.712 80.796zM251.99 359.04c11.636 0.906 23.166 3.17 35.939 4.977l-4.334 39.688c-30.57 0-58.113-1.64-85.38 0.41-34.804 2.617-56.879 20.39-63.369 46.691-8.036 32.568 5.163 57.681 38.145 63.13 25.119 4.15 51.36 1.602 77.102 1.802 4.855 0.038 9.718-1.01 13.933-1.484 1.094 1.38 1.758 1.828 1.75 2.26-0.846 41.948-0.856 43.797-42.839 43.627-31.178-0.125-63.113-2.621-93.29-9.932-33.339-8.078-58.892-29.676-64.336-66.284-5.775-38.833 10.548-69.609 41.554-91.999 43.456-31.377 93.4-36.911 145.125-32.886zM137.883 595.667l-1.199 1.499c6.716 8.794 15.629 15.41 26.742 19.847a88.695 88.695 0 0 0-3.177 4.797c-10.554-5.196-19.407-12.172-26.562-20.926-6.117 7.915-15.15 15.15-27.101 21.706-0.8-1.36-1.8-2.858-2.999-4.498 12.352-6.196 21.685-13.67 28.001-22.424h6.295z m-31.538 51.205h24.763v-10.433h-19.426v-4.377h19.426v-9.233H113.9v-4.377h39.454v4.377h-17.269v9.233h19.487v4.377h-19.487v10.433h24.704v4.437h-54.443v-4.437z m89.46-4.437c2.698-0.28 5.536-0.61 8.513-0.99v-18.138h-7.375v-4.317h7.375v-14.091h-8.154v-4.318h20.506v4.318h-7.975v14.09h6.956v4.318h-6.956v17.568c2.399-0.34 4.876-0.7 7.435-1.08-0.16 1.6-0.26 3.138-0.3 4.618-7.475 0.96-13.95 1.858-19.426 2.698l-0.6-4.676z m20.625-3.898c5.217-3.177 10.673-6.716 16.37-10.613v-17.447h-15.35v-4.317h15.35v-10.674h4.556v10.674h17.029v4.317h-17.03v5.336c1 3.278 2.17 6.316 3.509 9.114 3.458-3.358 6.345-6.456 8.664-9.294l3.898 3.298a303.267 303.267 0 0 1-10.523 9.894c3.477 6.016 7.805 10.673 12.982 13.97-0.24 0.36-0.76 0.98-1.559 1.858-0.88 0.92-1.499 1.64-1.858 2.158-6.555-4.737-11.592-11.552-15.11-20.445v19.367c0 4.756-2.479 7.135-7.435 7.135-1.96 0-4.058-0.02-6.296-0.06a74.86 74.86 0 0 0-0.96-4.917c2.358 0.28 4.498 0.42 6.416 0.42 2.478 0 3.718-1.22 3.718-3.658v-11.422a560.006 560.006 0 0 0-13.37 9.623l-3-4.317z m1.32-21.645l3.657-2.219c2.598 3.398 5.176 7.155 7.735 11.273l-3.838 2.638c-2.758-4.676-5.276-8.574-7.555-11.692z m22.844-17.868l2.638-2.998c2.837 1.879 5.435 3.817 7.794 5.816l-2.878 3.298a69.989 69.989 0 0 0-7.554-6.116z m48.027 47.128c1.96-0.2 3.918-0.409 5.876-0.629v-22.815h-6.595v-3.598h59.42v3.598h-31.3v19.997c1.92-0.28 3.838-0.57 5.757-0.87-0.041 0.72-0.02 1.999 0.06 3.837-1.879 0.26-3.818 0.53-5.816 0.81v7.645h-4.077v-7.045c-6.876 0.979-14.29 2.088-22.245 3.327l-1.08-4.257z m8.334-48.747h41.492v19.248h-4.197v-1.38h-33.097v1.38h-4.198v-19.248z m1.62 30.1h13.37v-4.798h-13.37v4.798z m0 8.274h13.37v-4.797h-13.37v4.797z m13.37 7.526v-4.048h-13.37v5.786c4.516-0.54 8.974-1.12 13.37-1.738z m22.306-42.422h-33.098v3.838h33.098v-3.838z m-33.098 10.913h33.098v-3.838h-33.098v3.838z m17.868 18.647v-3.478h23.804v3.478c-2.038 4.896-4.717 9.153-8.035 12.77 3.418 2.498 7.654 4.398 12.711 5.696a77.836 77.836 0 0 0-2.698 4.198c-5.156-1.699-9.503-3.997-13.041-6.895-3.437 3.078-7.446 5.596-12.022 7.555-0.68-1.2-1.6-2.458-2.758-3.777 4.538-1.739 8.444-3.957 11.722-6.656-3.338-3.577-5.716-7.874-7.135-12.891h-2.548z m19.246 0h-12.651c1.259 3.937 3.287 7.305 6.086 10.103 2.778-2.918 4.966-6.285 6.565-10.103z m41.672 18.707c16.489-7.335 25.382-18.348 26.682-33.038h-25.603v-4.676h25.813c0.1-5.377 0.15-10.793 0.15-16.25h5.216c0 5.377-0.05 10.793-0.15 16.25h26.592v4.676h-26.682c2.838 15.969 12.152 26.502 27.942 31.599-2.039 1.958-3.558 3.577-4.557 4.856-13.011-5.236-21.515-14.56-25.513-27.97-3.118 12.13-11.842 21.854-26.172 29.17-0.8-1.079-2.038-2.618-3.718-4.617z m96.295-41.372h23.085v-13.07h5.157v13.07H527.8v27.342h-4.917v-3.238h-18.407v22.305h-5.157v-22.305h-18.168v3.238h-4.917v-27.342z m4.916 19.667h18.168v-15.23H481.15v15.23z m41.733-15.23h-18.407v15.23h18.407v-15.23z m42.27-7.015h28.781c-2.019-3.838-3.598-6.635-4.737-8.395l4.617-2.158c1.12 1.72 2.798 4.517 5.037 8.395l-4.317 2.158h28.18v4.437h-11.062c-2.14 11.412-6.736 20.586-13.791 27.522 5.316 3.877 13.76 7.355 25.332 10.432-1.838 2.078-3.237 3.817-4.197 5.217-11.273-3.898-19.596-7.975-24.973-12.232-5.396 4.198-14.02 8.434-25.872 12.712a198.213 198.213 0 0 0-3.598-4.677c11.432-3.437 20.036-7.265 25.813-11.482-7.295-7.795-11.932-16.958-13.911-27.491h-11.302V605.2z m41.373 4.437h-25.273c1.8 9.833 6.096 17.958 12.892 24.373 6.495-6.036 10.622-14.16 12.38-24.373z m65.326-5.127h-4.467v36.306h4.467v5.066h-14.93v-5.066h4.466V604.51h-4.466v-5.066h14.93v5.066z m66.345 0.27h-13.401v41.102h-6.027V604.78h-13.34v-5.336h32.767v5.336z m33.517 6.716v-4.317h19.487v4.437a67.744 67.744 0 0 1-6.895 11.002v30.91h-4.677v-25.483a74.811 74.811 0 0 1-7.135 6.595c-0.36-1.439-0.92-3.097-1.68-4.976 6.157-4.957 11.253-11.013 15.29-18.168h-14.39z m5.935-14.39l4.198-2.1c1.479 2.36 3.038 5.097 4.676 8.215l-4.437 2.278c-1.558-3.237-3.037-6.035-4.437-8.394z m7.375 28.84l3.118-2.579a229.071 229.071 0 0 1 6.656 7.736l-3.718 2.938a146.67 146.67 0 0 0-6.056-8.095z m6.177 21.045h16.849v-29.38h-14.27v-4.676h14.27v-17.568h4.797v17.568h15.23v4.676h-15.23v29.38h17.029v4.677h-38.674v-4.677z m76.688-47.847h51.565v4.676h-46.468v41.851h47.428v4.557H867.89v-51.084z m9.713 11.272l3.357-3.177c4.997 4.117 10.223 8.635 15.68 13.55 4.176-4.516 8.184-9.433 12.021-14.75l4.377 2.939c-4.198 5.437-8.455 10.472-12.771 15.11a690.537 690.537 0 0 1 15.47 14.57l-4.138 4.197a528.316 528.316 0 0 0-14.93-14.99c-5.777 5.857-11.652 11.014-17.629 15.47-0.96-1.239-2.239-2.538-3.837-3.898 6.276-4.277 12.242-9.264 17.898-14.96a525.344 525.344 0 0 0-15.498-14.06z"
Height="100" Width="400"
Stretch="Fill"
StrokeDashOffset="0"
StrokeThickness="5"
StrokeStartLineCap="Triangle"
StrokeEndLineCap="Triangle"
StrokeDashArray="500"
x:Name="MyPath"
Margin="100"
SnapsToDevicePixels="True">
<!--添加渐变色描边-->
<Path.Stroke>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
<GradientStop x:Name="B1" Color="Red" Offset="0.0"/>
<GradientStop x:Name="B2" Color="Beige" Offset="1.1"/>
</LinearGradientBrush>
</Path.Stroke>
<Path.Triggers>
<EventTrigger RoutedEvent="Path.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="MyPath"
Storyboard.TargetProperty="StrokeDashOffset"
From="500"
To="0"
Duration="0:0:15"
BeginTime="0:0:0"/>
<DoubleAnimation Storyboard.TargetName="B1"
Storyboard.TargetProperty="Offset"
From="0.0" To="1.1"
AutoReverse="True"
Duration="0:0:10"
BeginTime="0:0:0"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Path.Triggers>
</Path>
<!--Logo 右下角添加小标题-->
<Grid>
<TextBlock Margin="350 180 0 0"
Foreground="#FFFFFF"
FontSize="16"
Height="50"
FontFamily="Candara Light"
x:Name="MyTextblock">
<TextBlock.Triggers>
<EventTrigger RoutedEvent="TextBlock.Loaded">
<BeginStoryboard>
<Storyboard>
<StringAnimationUsingKeyFrames Storyboard.TargetName="MyTextblock" Storyboard.TargetProperty="Text"
BeginTime="0:0:2.5" Duration="0:0:3">
<DiscreteStringKeyFrame Value="扫 码" KeyTime="0:0:0"/>
<DiscreteStringKeyFrame Value="扫 码 获" KeyTime="0:0:0.125"/>
<DiscreteStringKeyFrame Value="扫 码 获 取" KeyTime="0:0:0.25"/>
<DiscreteStringKeyFrame Value="扫 码 获 取 源" KeyTime="0:0:0.375"/>
<DiscreteStringKeyFrame Value="扫 码 获 取 源 代" KeyTime="0:0:0.5"/>
<DiscreteStringKeyFrame Value="扫 码 获 取 源 代 码" KeyTime="0:0:0.625"/>
</StringAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</TextBlock.Triggers>
</TextBlock>
</Grid>
<Image x:Name="myImage" Source="/Assets/Images/链接资源.png" Height="100" Width="100" Margin="50 280 0 0" Visibility="Hidden"/>
</Grid>
</Window>
3、后台代码
WelcomeWindow.cs 代码实现如下
namespace Wpf_Examples
{
/// <summary>
/// WelcomeWindow.xaml 的交互逻辑
/// </summary>
public partial class WelcomeWindow : Window
{
private DispatcherTimer timer;
public WelcomeWindow()
{
InitializeComponent();
// 创建并启动计时器
timer = new DispatcherTimer();
timer.Interval = TimeSpan.FromSeconds(3); // 设置延时时间（例如3秒）
timer.Tick += Timer_Tick;
timer.Start();
}
private void Timer_Tick(object sender, EventArgs e)
{
if(myImage.Visibility== Visibility.Visible)
{
//跳转界面
MainWindow mainWindow = new MainWindow();
mainWindow.Show();
// 停止计时器
timer.Stop();
//关闭当前界面
this.Close();
}
else
{
// 设置图片可见
myImage.Visibility = Visibility.Visible;
}
}
}
}
4 源代码获取
CSDN 下载链接：WPF+MVVM案例实战（七）- 系统初始化界面字体描边效果实现
