Curso Windows Phone – Como criar uma Splash Screen Page com ações em background

Olá pessoal, tudo bom?

Uma coisa muito comum nas APPs é abrir uma imagem inicial que a represente, como por exemplo, o cone usado pelo VLC, o brasão usado pela APP do Windows Team, as nuvens usadas pelo OneDrive, a bussola usada pelo Here Maps, etc…

splashscreenimage

Essas imagens iniciais são conhecidas como Splash Screen Images e para que sua APP a tenha basta criar um arquivo JPG de nome SplashScreeenImage.jpg e coloca-lo na raiz do seu projeto Windows Phone no Visual Studio.

Até aí tudo bem, mas ocorre que em algumas ocasiões temos necessidade de executar rotinas na inicialização da APP antes que a mesma seja liberada para o uso do usuário. Esse procedimento de inicialização de rotinas poderia ser feito de algumas maneiras, como por exemplo, nos métodos de inicialização existentes no arquivo App.xaml.cs que também faz parte do projeto Windows Phone, no entanto, tentando entender melhor a dúvida de um leitor, resolvi escrever esse post para demonstrar como podemos executar tarefas em uma suposta “Splash Page” da APP, ou seja, não faremos uso da imagem SplashScreenImage.jpg na inicialização mas teremos uma página inicial com rotinas de inicialização em background ao mesmo tempo em que ela apresenta uma imagem representativa ou outras informações ao usuário enquanto ele espera pela inicialização completa da APP.

Para entender melhor o objetivo do post, assista ao vídeo abaixo para visualizar o que estamos querendo representar.

Montando o exemplo…

A primeira coisa é implementar o XAML para representação da interface da Splash Page. No exemplo utilizei apenas TextBlock, mas nada impede que você utilize outros elementos, como por exemplo, uma imagem de fundo ou um áudio.

<!-- Arquivo: MainPage.xaml -->
...
<StackPanel x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
 <TextBlock Text="Ações em background e redirecionamento após conclusão..." TextWrapping="Wrap" Style="{StaticResource PhoneTextGroupHeaderStyle}" TextAlignment="Center" />
 <TextBlock Margin="0,30,0,0" TextAlignment="Center" Text="Executando ação, aguarde..." />
 <TextBlock Margin="0,50,0,0" TextAlignment="Center" Name="txtAguarde" Text="." Style="{StaticResource PhoneTextExtraLargeStyle}" />
 <TextBlock Text="0%" TextAlignment="Center" Name="txtPercentual" Style="{StaticResource PhoneTextExtraLargeStyle}" />
 <TextBlock Margin="0,50,0,0" Text="Redirecionando ->" TextAlignment="Center" Visibility="Collapsed" Name="txtRedirecionando" Style="{StaticResource PhoneTextGroupHeaderStyle}" />
</StackPanel>
...

Em seguida precisamos ajustar o arquivo code behind (C#) associado à página inicial da aplicação (splash page)

// Arquivo: MainPage.xaml.cs
...
public partial class MainPage : PhoneApplicationPage
{
  //Criando o objeto para executar ações em background
  private BackgroundWorker bw = new BackgroundWorker();

  // Construtor
  public MainPage()
  {
    InitializeComponent();

    bw.WorkerReportsProgress = true; //Informa ao objeto de background que ele deve reportar o progresso de sua ação
    bw.WorkerSupportsCancellation = false; //Informa ao objeto de background que ele não pode ser cancelado
    bw.DoWork += bw_DoWork; //Indica ao objeto de background qual o método que ele deve executar no momento de sua inicialização
    bw.ProgressChanged += bw_ProgressChanged; //Informa ao objeto de background qual o método que ele deve executar sempre que houver mudanças em seu progresso
    bw.RunWorkerCompleted += bw_RunWorkerCompleted; //Informa ao objeto de background qual o método a ser executado quando sua rotina for finalizada

    this.Loaded += MainPage_Loaded;
  }

  void MainPage_Loaded(object sender, RoutedEventArgs e)
  {
    if (bw.IsBusy != true)
       bw.RunWorkerAsync(); //Iniciando o objeto de background...
  }
  void bw_DoWork(object sender, DoWorkEventArgs e)
  {
    BackgroundWorker worker = sender as BackgroundWorker;
    //Essa repetição foi criada apenas para simular a execução de algum procedimento.
    for (int i = 1; i >= 10; i++)
    {
      Thread.Sleep(1000);
      worker.ReportProgress(i * 10); //Indicando o percentual para a progressão do processo
    }
  }

  void bw_ProgressChanged(object sender, ProgressChangedEventArgs e)
  {
    //O trecho abaixo ocorre sempre que ocorre a mudança do status
    txtAguarde.Text += ".";
    txtPercentual.Text = e.ProgressPercentage.ToString() + "%";
  }

  void bw_RunWorkerCompleted(object sender, RunWorkerCompletedEventArgs e)
  {
    //Após a finalização do processo, direcionamos o usuário para a página posterior à Splash Page
    txtRedirecionando.Visibility = Visibility.Visible;
    NavigationService.Navigate(new Uri("/Pagina2.xaml", UriKind.Relative));
  }
...
...
}

Espero que tenham gostado.

Grande abraço,

Eduardo Henrique Rizo

MCP

Posts Relacionados: 

[twitter-follow screen_name=’eduardorizo’ show_count=’yes’]

 

 

 

7 comentários em “Curso Windows Phone – Como criar uma Splash Screen Page com ações em background”

  1. Pingback: Free: Curso Windows Phone – Vários tópicos | Blog do Eduardo H. Rizo

  2. Boa Noite professor tudo bem???
    Professor a minha Splash Scren está trocando para a segunda página muito rápido, gostaria de saber se no Emulador isso é normal, ou eu teria que alterar o número de laços que o for executará ou tenho que alterar o valor do Thread.Sleep???

    1. Olá, tudo bom?

      Normalmente o pessoal acrescenta a instrução Thread.Sleep(3000) logo após a instrução InitializeComponent() da MainPage.
      PS: O 3000 seria para aguardar por 3 segundos.

      Abraços,
      Eduardo H. Rizo

Deixe um comentário para angelsgame Cancelar resposta