讓W(xué)PF的初始化啟動窗體動起來

當(dāng)程序啟動初始化時間比較長時，我們一般會設(shè)置一張圖片作為啟動畫面，讓用戶知道我們的程序不是崩了，是還在跑。

1 常用作法

常規(guī)啟動畫面使用步驟很簡單，我們從網(wǎng)上找一張圖片：點擊下載圖片^[1]

將下載的圖片放在主工程目錄下，修改圖片生成操作屬性為SplashScreen，然后其他啥都不用改，直接啟動項目即可。

下面是設(shè)置圖片屬性，啟動后的效果：

2 自定義窗體作為啟動畫面

此事例由博客園博主驚鏵投稿，原文鏈接：WPF實現(xiàn)等待界面效果^[2]。

作者的話：

?

在使用一些應(yīng)用的時候會發(fā)現(xiàn)等待界面做的用戶體驗很好，所以打算使用wpf實現(xiàn)一篇。

博文效果圖：

2.1 開始實現(xiàn)上面的效果還差啥？

除上面下載的啟動畫面圖片外，還需要效果圖中的飛機：

2.2 剩下的就是代碼了

xaml代碼

<Window.Resources>
????<ImageBrush?x:Key="freeMachineImageBrush"?ImageSource="/Images/飛機132x48.png"/>
Window.Resources>

<Canvas?Name="myCanvas"?Focusable="True">
????<Rectangle?Name="background"?Height="400"?Width="1262"/>
????<Rectangle?Name="background2"?Height="400"?Width="1262"?Canvas.Left="1262"?/>
????<Rectangle??Fill="{StaticResource?freeMachineImageBrush}"?
???????????????Height="48"?Width="128"?Canvas.Left="336"/>
Canvas>

xaml.cs代碼

//創(chuàng)建定時器
DispatcherTimer?timer?=?new?DispatcherTimer();
//定義圖像畫刷
ImageBrush?backgroundBrush?=?new?ImageBrush();

//構(gòu)造

timer.Tick?+=?Engine;
timer.Interval?=?TimeSpan.FromMilliseconds(20);
backgroundBrush.ImageSource?=?new?BitmapImage(new?Uri("pack://application:,,,/Images/timg.jpg"));
background.Fill?=?backgroundBrush;
background2.Fill?=?backgroundBrush;Start();


private?void?Engine(object?sender,?EventArgs?e)
{
????var?backgroundLeft?=?Canvas.GetLeft(background)?-?3;
????var?background2Left?=?Canvas.GetLeft(background2)?-?3;

????Canvas.SetLeft(background,?backgroundLeft);
????Canvas.SetLeft(background2,?background2Left);
????if?(backgroundLeft?<=?-1262)
?????{
????????timer.Stop();
????????Start();
?????}

}
private?void?Start()
{
??Canvas.SetLeft(background,?0);?
??Canvas.SetLeft(background2,?1262);?
??timer.Start();
}

2.3 站長測試

站長按博主提供的代碼寫了事例，感覺還是差了那么點意思，經(jīng)私下再和博主勾兌，下了其Github源碼(SoftWareHelper^[3])后，看了實際效果如下：

看了啟動窗體的代碼，xaml中代碼與博文中相差不大，加了幾個文本控件，用于顯示加載提示信息，實際使用時可以動態(tài)添加，這段代碼我就不復(fù)制展示了，點擊這里可以查看(StartView.xaml^[4])。

啟動窗體后臺代碼也與博文有差異，待啟動窗體Loaded完成后，使用了BackgroundWorker，將費時操作放在了DoWork中處理，待DoWork費時操作完成后，再啟動了主窗體、關(guān)閉啟動窗體。

var?bw?=?new?BackgroundWorker();

bw.DoWork?+=?(s,?y)?=>
{

????Common.TemporaryFile();
????Common.ApplicationListCache?=?Common.AllApplictionInstalled();
????Common.GetDesktopAppliction(Common.ApplicationListCache);

????string?json?=?JsonHelper.Serialize(Common.ApplicationListCache);
????FileHelper.WriteFile(json,?Common.temporaryApplicationJson);
????Thread.Sleep(2000);
};

bw.RunWorkerCompleted?+=?(s,?y)?=>?
{
????tbMsg.Text?=?"開始體驗";
????timer.Stop();
????MainView?mView?=?new?MainView();
????mView.Show();

????var?closeAnimation?=?new?DoubleAnimation?
????{
????????From?=?this.Width,
????????To?=?0,
????????Duration?=?new?Duration(TimeSpan.FromSeconds(0.5)),
????????EasingFunction?=?new?BackEase?{?EasingMode=?EasingMode.EaseIn?}
????};
????closeAnimation.Completed?+=?(s1,?e1)?=>
????{
????????this.Close();
????};
????//this.BeginAnimation(Window.OpacityProperty,?closeAnimation);
????this.BeginAnimation(Window.WidthProperty,?closeAnimation);
};
tbMsg.Text?=?"即將進入";
bw.RunWorkerAsync();

結(jié)語

自定義啟動窗體動畫，站長個人覺得還是挺有意思，比靜態(tài)圖片使用SplashScreen屬性的實現(xiàn)方式更加有趣了。

大家參考時，初始化的一些細節(jié)可以嘗試打印在啟動窗體上，能讓用戶覺得這程序在運行呀，原來在執(zhí)行這個操作，才不會讓人覺得突兀，更能理解為啥啟動一個界面還等這么久，我理解了，我才好表揚你噻，是不？

站長也將這個啟動窗體加在了TerminalMACS^[5]項目上，后面有空再完善，看看下面的效果：

?

時間如流水，只能流去不流回。

• 首發(fā)公眾號：Dotnet9
• 作者：沙漠之盡頭的狼
• 編輯日期：2020-11-29 23:49:16

參考資料