關於WPF進度條的使用

金灿灿發表於2024-03-26

本文講述如何在軟體啟動和窗體按鈕操作時彈出進度條。

執行環境：Win10、VS2022

一、新建WPF專案。

二、新建WPF窗體。

1、新建窗體，取名DefProcessBar.xaml。

2、設定窗體屬性、樣式。

<Window x:Class="WpfApp4.DefProcessBar"
        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:WpfApp4"
        mc:Ignorable="d"
        Title="DefProcessBar" Width="300" Height="50"
        WindowStartupLocation="CenterScreen"
        WindowStyle="None" AllowsTransparency="True" Background="Transparent" ShowInTaskbar="False" ResizeMode="NoResize">

2.1、WindowStartupLocation="CenterScreen"是窗體在螢幕中間顯示；

2.2、WindowStyle="None"是不要窗體頂部內容；

2.3、AllowsTransparency="True"是允許窗體透明；

2.4、Background="Transparent"是設定透明背景；

2.5、ShowInTaskbar="False"是指示此視窗是否出現在工作列；

2.6、ResizeMode="NoResize"是不可調節窗體大小。

3、新增進度訊息和進度條。

<Grid.RowDefinitions>
    <RowDefinition Height="25"></RowDefinition>
    <RowDefinition Height="25"></RowDefinition>
</Grid.RowDefinitions>

<TextBlock Grid.Row="0" Name="txtTitle" FontSize="16" Foreground="Yellow" HorizontalAlignment="Left" TextWrapping="Wrap" Margin="10, 0,0,0"></TextBlock>
<ProgressBar Grid.Row="1" x:Name="progressBar" Maximum="100" Height="25" Width="300" Foreground="Green" Background="LightGray" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"/>

4、新增DefProcessBar.xaml.cs程式碼

/// <summary>
/// DefProcessBar.xaml 的互動邏輯
/// </summary>
public partial class DefProcessBar : Window
{
    public DefProcessBar()
    {
        InitializeComponent();
    }

    public void ShowProcess(int process, string title = "")
    {
        progressBar.Dispatcher.Invoke(() =>
        {
            this.txtTitle.Text = title;
            this.progressBar.Value = process;
        });
    }

    public void SetProcess(DefProcessBar defProcessBar, int process, string title = "")
    {
        if (process > 100)
        {
            process = 100;
        }
        else if (process < 0)
        {
            process = 0;
        }
        title += $" ({process}%)";
        defProcessBar.ShowProcess(process, title);
    }
}

三、在App.xaml.cs中使用

/// <summary>
/// App.xaml 的互動邏輯
/// </summary>
public partial class App : Application
{
    protected override void OnStartup(StartupEventArgs e)
    {
        Application.Current.ShutdownMode = System.Windows.ShutdownMode.OnExplicitShutdown;

        bool isFinish = false;

        //DialogWait defProcessBar = new DialogWait();
        DefProcessBar defProcessBar = new DefProcessBar();
        Task.Run(() =>
        {
            defProcessBar.SetProcess(defProcessBar, 20, "啟動中，請稍後...");
　　　　　　  // 寫入實際處理程式碼
            Thread.Sleep(500);
            defProcessBar.SetProcess(defProcessBar, 40, "啟動中，請稍後...");
            Thread.Sleep(500);
            defProcessBar.SetProcess(defProcessBar, 60, "啟動中，請稍後...");
            Thread.Sleep(500);
            defProcessBar.SetProcess(defProcessBar, 80, "啟動中，請稍後...");
            Thread.Sleep(500);

            defProcessBar.Dispatcher.Invoke(() =>
            {
                defProcessBar.Close();
            });
        });
        defProcessBar.ShowDialog();

        if (isFinish)
        {
            base.OnStartup(e);
            Application.Current.ShutdownMode = ShutdownMode.OnMainWindowClose;
        }
        else
        {
            this.Shutdown();
        }
    }
}

啟動軟體檢視效果。

四、在主窗體MainWindow中彈出進度條。

1、新增按鈕。

2、新增按鈕事件處理。

 private void Button_Click(object sender, RoutedEventArgs e)
 {
     DefProcessBar defProcessBar = new DefProcessBar();
     Task.Run(() =>
     {
         defProcessBar.SetProcess(defProcessBar, 20, "啟動中，請稍後...");
         Thread.Sleep(500);
         defProcessBar.SetProcess(defProcessBar, 40, "啟動中，請稍後...");
         Thread.Sleep(500);
         defProcessBar.SetProcess(defProcessBar, 60, "啟動中，請稍後...");
         Thread.Sleep(500);
         defProcessBar.SetProcess(defProcessBar, 80, "啟動中，請稍後...");
　　　　  //寫入實際處理程式碼
         Thread.Sleep(500);

         defProcessBar.Dispatcher.Invoke(() =>
         {
             defProcessBar.Close();
         });
     });
     defProcessBar.ShowDialog();
 }

3、效果跟軟體啟動時一樣。

缺點：所有邏輯必須放到非同步處理。

相關文章