Cómo implementar una barra de progreso utilizando el patrón MVVM

Question

Tengo una aplicación WPF que se basa en el patrón de diseño de MVVM.

Deseo implementar una barra de progreso en la aplicación, que sigue el patrón de MVVM.

¿Alguien tiene alguna sugerencia sobre cómo implementar esto?

Gracias de antemano

Answer 1

Normalmente la interfaz de usuario simplemente se unen a las propiedades de la máquina virtual:

<ProgressBar Value="{Binding CurrentProgress, Mode=OneWay}" 
      Visibility="{Binding ProgressVisibility}"/> 

Su VM sería utilizar un BackgroundWorker para hacer el trabajo en un subproceso en segundo plano, y actualizar periódicamente la CurrentProgress valor. Algo como esto:

public class MyViewModel : ViewModel 
{ 
    private readonly BackgroundWorker worker; 
    private readonly ICommand instigateWorkCommand; 
    private int currentProgress; 

    public MyViewModel() 
    { 
     this.instigateWorkCommand = 
       new DelegateCommand(o => this.worker.RunWorkerAsync(), 
            o => !this.worker.IsBusy); 

     this.worker = new BackgroundWorker(); 
     this.worker.DoWork += this.DoWork; 
     this.worker.ProgressChanged += this.ProgressChanged; 
    } 

    // your UI binds to this command in order to kick off the work 
    public ICommand InstigateWorkCommand 
    { 
     get { return this.instigateWorkCommand; } 
    } 

    public int CurrentProgress 
    { 
     get { return this.currentProgress; } 
     private set 
     { 
      if (this.currentProgress != value) 
      { 
       this.currentProgress = value; 
       this.OnPropertyChanged(() => this.CurrentProgress); 
      } 
     } 
    } 

    private void DoWork(object sender, DoWorkEventArgs e) 
    { 
     // do time-consuming work here, calling ReportProgress as and when you can 
    } 

    private void ProgressChanged(object sender, ProgressChangedEventArgs e) 
    { 
     this.CurrentProgress = e.ProgressPercentage; 
    } 
} 

Answer 2

utilizar un control ProgressBar y unirse a su propiedad Value a una propiedad del modelo de vista:

Ver

<ProgressBar Minimum="0" Maximum="0" Value="{Binding CurrentProgress}" /> 

modelo de vista

private double _currentProgress; 
public double CurrentProgress 
{ 
    get { return _currentProgress; } 
    private set 
    { 
     _currentProgress = value; 
     OnPropertyChanged("CurrentProgress"); 
    } 
} 

Answer 3

añadir dos propiedades a su VM:

bool IsProgressBarVisible 
double ProgressValue 

Si se inicia una operación de larga duración en su máquina virtual, establecer el IsProgressBarVisible-propiedad en true y establezca el periódico ProgressValue al valor actual progreso. Intente calcular un valor entre 0 y 100. Esto tiene la ventaja de que no tiene que proporcionar un valor mínimo y máximo. Después de que se haya completado la operación asincrónica, establezca IsProgressBarVisible en falso.

En XAML, enlazar a estas dos propiedades. Use un convertidor de valor para convertir la visibilidad booleana en Visibilidad.

<ProgressBar Value="{Binding ProgressValue}" Visibility="{Binding IsProgressBarVisible,Converter={StaticResource BooleanToVisibility_ValueConverter}}"/>