title: Set ProgressBar visibility from ViewModel before and after retrieving data from webservice service
body: <p>I am creating a Windows Phone 8.1 app using an MVVM design pattern and the MVVM Light toolkit. </p>
  
  <p>I am trying to create a simple login page that takes a username and password from a user and authenticates with a webservice. During this authentication process I want to show a ProgressBar (loading dots) at the top of the page to indicate that something is happening.</p>
  
  <p>I have successfully created my ViewModel and bound my View to allow me to control the visibility of the ProgressBar from a Command attached to my login button. This works, however, the UI only updates to show the ProgressBar once the entire Login process is completed, making the use of a progress indicator pointless. </p>
  
  <p>How do I first set the visibility of the ProgressBar (and have the UI update) then go off an perform my Login process? </p>
  
  <p>Here is some code:</p>
  
  <p>xaml</p>
  
  <pre><code>&lt;ProgressBar IsIndeterminate="True" Height="1" Visibility="{Binding Login.ProgressVisibility, UpdateSourceTrigger=PropertyChanged, FallbackValue=Collapsed}" /&gt;
  </code></pre>
  
  <p>ViewModel</p>
  
  <pre><code>public class LoginViewModel : ViewModelBase
  {
      private IDialogService dialogService;
      private INavigationService navigationService;
  
      private string _username;
      private string _password;
  
      private Visibility _progressVisibility = Visibility.Collapsed;
  
      /// &lt;summary&gt;
      /// User login name / email address
      /// &lt;/summary&gt;
      public string Username
      {
          get
          {
              return _username;
          }
          set
          {
              Set(() =&gt; Username, ref _username, value);
          }
      }
  
      /// &lt;summary&gt;
      /// User password
      /// &lt;/summary&gt;
      public string Password
      {
          get
          {
              return _password;
          }
          set
          {
              Set(() =&gt; Password, ref _password, value);
          }
      }
  
      /// &lt;summary&gt;
      /// Is loading in progress
      /// &lt;/summary&gt;
      public Visibility ProgressVisibility
      {
          get
          {
              return _progressVisibility;
          }
          set
          {
              Set(() =&gt; ProgressVisibility, ref _progressVisibility, value);
          }
      }
  
      /// &lt;summary&gt;
      /// Perform login action
      /// &lt;/summary&gt;
      public RelayCommand LoginCommand { get; private set; }
  
      /// &lt;summary&gt;
      /// constructor
      /// &lt;/summary&gt;
      /// &lt;param name="dialogService"&gt;&lt;/param&gt;
      public LoginViewModel(IDialogService dialogService, INavigationService navigationService)
      {
          this.LoginCommand = new RelayCommand(this.Login, CanLogin);
          this.dialogService = dialogService;
          this.navigationService = navigationService;
  
      }
  
      public void Login()
      {
          this.ProgressVisibility = Visibility.Visible;
  
          //check the credentials have been provided
          if (this._username == null || this._password == null)
          {
              //show dialogue
              dialogService.ShowMessage("Please enter you login credentials", "Login");
          }
          else
          {
  
              //perform an authentication request with the service
              ValidateLoginRequest request = new ValidateLoginRequest();
  
              request.Device = new Device();
              request.UserName = this.Username;
              request.Password = this.Password;
  
              var response = Task.Run(() =&gt; LoginAsync(request)).GetAwaiter().GetResult();
  
              if (response != null)
              {
                  if (response.IsSuccessful)
                  {                        
                      navigationService.NavigateTo("Main");
                  }
                  else
                  {
  
                      dialogService.ShowMessage(response.ErrorCode + " :" + response.ErrorMessage, "Login");
                  }
              }
              else
              {
                  //failure
                  dialogService.ShowMessage("ECOM000: An unknown error has occurred", "Login");
              }
          }
  
  
  
      }
  
      async Task&lt;ValidateLoginResponse&gt; LoginAsync(ValidateLoginRequest request)
      {
          Model.RuntimeDataService proxy = new Model.RuntimeDataService();
          ValidateLoginResponse response = (ValidateLoginResponse)await proxy.PostAsync(request, typeof(ValidateLoginResponse), "ValidateLogin");
          return response;
      }
  
      public bool CanLogin()
      {
          return true;
      }
  }
  </code></pre>