[Desenvolvimento] Criando e utilizando UserControls em APPs para Windows Phone

Olá pessoal, tudo bom?

Nesse post demonstro como criar e utilizar UserControls em APPs para Windows Phone. Para exemplificar, criarei um UserControl que possui uma imagem que pode ser “arrastada” através da tela do Windows Phone e, no mesmo UserControl, também temos uma espécie de cronometro para percebemos que podemos colocar o mesmo UserControl mais de uma vez na mesma página e ainda assim cada uma de suas instâncias possuirá “vida própria” dentro da APP.

O código abaixo apresenta o fonte do arquivo MyUserControl.xaml. Vamos a ele:

Na sequência podemos observar o código do arquivo MyUserControl.xaml.cs que implementa as ações associadas à interface apresentada acima:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Windows.Threading;

namespace WPUserControlSample
{
    public partial class MyUserControl : UserControl
    {
        private TranslateTransform transLogo;

        public string HoraAtual
        {
            get { return txtHoraAtual.Text; }
        }

        public MyUserControl()
        {
            InitializeComponent();
            transLogo = new TranslateTransform();
            imgLogo.RenderTransform = transLogo;

            DispatcherTimer dt = new DispatcherTimer();
            dt.Interval = TimeSpan.FromSeconds(1);
            dt.Tick += delegate(object s, EventArgs e)
            {
                txtHoraAtual.Text = DateTime.Now.ToLongTimeString();
            };
            dt.Start();
        }

        private void GestureListener_GestureBegin(object sender, Microsoft.Phone.Controls.GestureEventArgs e)
        {
            imgLogo.Opacity = 0.5;
        }

        private void GestureListener_DragDelta(object sender, Microsoft.Phone.Controls.DragDeltaGestureEventArgs e)
        {
            transLogo.X += e.HorizontalChange;
            transLogo.Y += e.VerticalChange;
        }

        private void GestureListener_DragCompleted(object sender, Microsoft.Phone.Controls.DragCompletedGestureEventArgs e)
        {
            imgLogo.Opacity = 1;
        }
    }
}

Agora que temos o UserControl implementado, basta utilizá-lo nas partes da APP onde o mesmo se faz necessário. Veja no exemplo abaixo (arquivo MainPage.xaml) como associá-lo aos seus arquivos de layout:

A imagem abaixo apresenta um screenshot da APP em execução.

Grande abraço a todos!

Eduardo Henrique Rizo (@eduardorizo)

Fonte: Blog do Eduardo H. Rizo