在这个简单的WPF应用程序实施进度 [英] Implement progressbar in this simple WPF application

问题描述

我有主窗口有其视图模型MainWindowViewModel。窗口内有一个文本框，它接受用户的输入和几个单选按钮来过滤搜索和一按钮。按钮操作使用像这样的命令绑定到视图模型：

I have MainWindow which has its viewmodel MainWindowViewModel. Inside the window there is one textbox which accepts the user's input and a few radio buttons to filter the search and one button. The button action is bound to the viewmodel using a command like:

<Button x:Name="btnSearch" Command="{Binding SearchByCommand, Mode=OneWay}" />

在视图模型有：

public ICommand SearchByCommand
{
    get
    {
        if (_SearchByCommand == null)
        {
            _SearchByCommand = new RelayCommand(
                x => this.LoadData(this.SearchBy),
                x => { return !string.IsNullOrEmpty(this.SearchText); }
            );
        }
        return _SearchByCommand;
    }
}

和LoadData：

private void LoadData(string searchBy)
{
   switch(searchBy)
   ...
}

这完美的作品，但我不知道如何实现这个解决方案进度。当用户点击搜索按钮，进度条应该启动进步和冻结当前UI。后在LoadData方法的进度的progresscount应该结束，并再次启用UI加载数据。

This works perfectly, but I don't know how to implement a progressbar in this solution. When the user clicks on the search button, the progressbar should start the progress and freeze the current UI. After loading data in the LoadData method the progressbar's progresscount should end and enable the UI again.

推荐答案

您可以使用从繁忙的指标扩展WPF工具：这里

You can use the busy indicator from the extended WPF toolkit: here.

然后，你需要做的处理（ LoadData ）的另一个线程以不冻结UI。要做到这一点，简单的方法是使用一个后台工作：

Then you need to do your processing (LoadData) in another thread in order to not freeze the UI. To do so, the simple way is to use a background worker:

一个布尔添加到您的WM，表明当应用程序正忙：

Add a boolean to your wm to indicate when the application is busy:

private bool isBusy;
public bool IsBusy
{
    get { return isBusy; }
    set
    {
        this.isBusy = value;
        this.OnPropertyChanged("IsBusy");
    }
}

设置的后台工作：

Set up the background worker:

private void LoadData(string searchBy)
{
    IsBusy = true;
    BackgroundWorker worker = new BackgroundWorker();
    worker.DoWork += (o, ea) =>
    {
        //Do your heavy work here
    };

    worker.RunWorkerCompleted += (o, ea) =>
    {
        IsBusy = false;
    };

    worker.RunWorkerAsync();
}

如果你想显示你当前的处理进度的进度条，你需要做更多的工作。首先，你需要自定义样式应用到繁忙的指标：

If you want to show a progress bar with your current processing progress, you need to do a bit more work. First you need to apply a custom style to the busy indicator:

<toolkit:BusyIndicator IsBusy="True" BusyContent="Processing..." >
    <extToolkit:BusyIndicator.ProgressBarStyle>
        <Style TargetType="ProgressBar">
            <Setter Property="IsIndeterminate" Value="False"/>
            <Setter Property="Height" Value="15"/>
            <Setter Property="Margin" Value="8,0,8,8"/>
            <Setter Property="Value" Value="{Binding ProgressValue}"/>
        </Style>
    </extToolkit:BusyIndicator.ProgressBarStyle>
</toolkit:BusyIndicator>

然后，ProgressValue属性添加到您的虚拟机：

Then add a ProgressValue property to your vm:

private int progressValue ;
public int ProgressValue
{
    get { return progressValue ; }
    set
    {
        this.progressValue = value;
        this.OnPropertyChanged("ProgressValue ");
    }
}

和报告从后台工作进展情况：

And report progress from the background worker:

BackgroundWorker worker = new BackgroundWorker();
worker.WorkerReportsProgress = true;
worker.DoWork += (o, ea) =>
    {
        //Do your heavy work here
        worker.ReportProgress(10);

        //Do your heavy work here
        worker.ReportProgress(20);

        //And so on
    };

worker.ProgressChanged += (o,ea) =>
    {
        ProgressValue = e.ProgressPercentage;
    };

worker.RunWorkerCompleted += (o, ea) =>
    {
      IsBusy = false;
    };

这篇关于在这个简单的WPF应用程序实施进度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！