Curso Windows Phone – Como trocar imagens dinamicamente

Olá a todos, tudo bom?

Vamos verificar aqui como possibilitar a troca de uma determinada imagem em tempo de execução (dinamicamente) em uma APP Windows Phone.

Exemplo da aplicação

Exemplo da aplicação

No exemplo, permitiremos que o usuário possa escolher a imagem que ele deseja para sua aplicação. Vejamos:

No arquivo .xaml deixe seu código similar ao que segue:


<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
 <Image Height="256" Width="256"
 HorizontalAlignment="Center" Margin="0,26,0,0"
 Name="imgPrincipal" VerticalAlignment="Top" />
 <TextBlock Text="Escolha uma das imagens abaixo:"
 Margin="0,400,0,0" HorizontalAlignment="Center" />
 <StackPanel Orientation="Horizontal" VerticalAlignment="Top"
 Margin="0,450,0,0">
 <Image Height="80" Width="80"
 Name="img1" Margin="20,0,10,0"
 Source="Imagens/NadaConsta.png" Tap="img_Tap" />
 <Image Height="80" Width="80"
 Name="img2" Margin="20,0,10,0"
 Source="Imagens/Documento.png" Tap="img_Tap" />
 <Image Height="80" Width="80"
 Name="img3" Margin="20,0,10,0"
 Source="Imagens/Restricao.png" Tap="img_Tap" />
 <Image Height="80" Width="80"
 Name="img4" Margin="20,0,10,0"
 Source="Imagens/Limite.png" Tap="img_Tap" />
 </StackPanel>
</Grid>

Repare que há um evento Tap para todas as miniaturas de imagem e é nesse evento que iremos realizar a codificação necessária para a troca da imagem principal. Vamos ao código em C#.


private void img_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
 //O objeto abaixo é criado para identificarmos qual imagem o usuário selecionou
 Image i = sender as Image;

 switch (i.Name)
 {
 case "img1":
 imgPrincipal.Source = new BitmapImage(new Uri("Imagens/NadaConsta.png", UriKind.RelativeOrAbsolute));
 break;
 case "img2":
 imgPrincipal.Source = new BitmapImage(new Uri("Imagens/Documento.png", UriKind.RelativeOrAbsolute));
 break;
 case "img3":
 imgPrincipal.Source = new BitmapImage(new Uri("Imagens/Restricao.png", UriKind.RelativeOrAbsolute));
 break;
 case "img4":
 imgPrincipal.Source = new BitmapImage(new Uri("Imagens/Limite.png", UriKind.RelativeOrAbsolute));
 break;
 }
}

Fica a dica!

Grande abraço a todos,
Eduardo Henrique Rizo

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

Posts relacionados:

Curso Windows Phone Gratuito

Marcado com: , , , , , ,
6 comentários sobre “Curso Windows Phone – Como trocar imagens dinamicamente
  1. robsonlouro disse:

    E como fazer pra atualizar a imagem com uma imagem da internet?
    Se eu, em vez de colocar o caminho do arquivo colocar um endereço de uma câmera, por exemplo, o aplicativo não atualiza a imagem (mesmo que a imagem tenha sido atualizada no servidor) e continua exibindo a primeira imagem carregada.
    Qual comando utilizar para apagar o cache?

  2. Davide Santos disse:

    Boas,

    Sabes como se poe duas imagens *.gif na mesma page estou a tentar por dois gifs diferentes na mesma page.
    Segui este toturial:

    http://www.c-sharpcorner.com/UploadFile/raj1979/show-gif-images-in-windows-phone-7-1/

    Se eu declarar uma nova variavel não aparece nada se eu mudar a imagem da varialvel aparece sempre a mesma

    ImageSource = new Uri(“Novaimagem2”, UriKind.Relative);

    para este caso estou a usar o VS 2012 express.

  3. Davide Santos disse:

    Já resolvi no construtor declaro as imagens todas.

  4. Tem como fazer isso utilizando usercontrols? Como se fosse trocar de usercontrols dimamicamente, atravez de butoes no AppBar.

1 Pings/Trackbacks para "Curso Windows Phone – Como trocar imagens dinamicamente"

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

*