Windows Phone 8 | Cómo enviar correos con Email Compose Task

Este es el segundo artículo de la serie que empecé explicando cómo enviar SMS en Windows Phone. En esta ocasión le toca el turno al envío de correo electrónico.

Escenario

Supongamos que tenemos una aplicación de Windows Phone en la que que queremos compartir un contenido por medio del correo electrónico.

 

Solución

Windows Phone dispone de EmailComposeTask que se encuentra dentro del espacio de nombres Microsoft.Phone.Tasks y que nos va a permitir realizar el envío de un correo electrónico de forma simple y rápida.

Para el ejemplo, he puesto un botón al que hay que asignar el evento Click o Tap (Para lo que necesitamos hacer da lo mismo el que usemos).

 

Dentro del evento click, habrá que hacer uso de la clase EmailComposeTask para realizar la tarea de envío de correo.

   1:          private void btnEmail_Click(object sender, RoutedEventArgs e)

   2:          {

   3:              EmailComposeTask email = new EmailComposeTask();

   4:   

   5:              email.Subject = "Email subject";

   6:              email.Body = "Email body";

   7:              email.To = "johndoe@example.com";

   8:              email.Cc = "copyto@example.com";

   9:              email.Bcc = "hiddencopyto@example.com";

  10:   

  11:              email.Show();

  12:          }

 

Como se puede observar, lo único que se hace es crear una instancia de la clase EmailComposeTask y establecer un valor para las propiedades que tiene. Finalmente se realiza una llamada al método Show que lanzará la aplicación del envío de correo electrónico del sistema.

NOTA: En el emulador se mostrará un error por lo que habrá que realizar la prueba en un dispositivo.

Si probamos la aplicación, veremos que al presionar el botón se abrirá la aplicación de envío de correo del sistema, donde podremos modificar los datos del correo, adjuntar archivos, cancelarlo y enviarlo.

NOTA: Si no se tiene ninguna cuenta de correo configurada, el sistema mostrará un mensaje al usuario indicándole que debe configurarla.

 

Ha sido realmente sencillo y espero que os sea útil. Podéis descargaros el proyecto de ejemplo (Email) desde aquí donde además tenéis el resto de ejemplos que vaya publicando.

 

Artículos de la serie

Windows Phone 8 | Cómo enviar mensajes SMS con SMS Compose Task

Todos aquellos que desarrollen aplicaciones para móviles sabrán que algo muy importante en prácticamente cualquier aplicación es disponer de opciones para compartir algo, un contenido, un logro, una imagen, … ya que permite que la aplicación esté más viva y que anime a otros usuarios a descargarla y usarla. Con este artículo, en el que explicaré cómo enviar un SMS desde una aplicación para Windows Phone, quiero iniciar una serie de artículos en los que iré mostrando diferentes formas de compartir contenido acompañándolos de su código fuente.

Escenario

Supongamos que tenemos una aplicación de Windows Phone en la que que queremos compartir un contenido, en este caso un texto, con otra persona vía SMS.

Solución

Una de las grandes características de Windows Phone es la facilidad para hacer cualquier tarea y, para los desarrolladores no iba a ser menos, de hecho, es extremadamente sencillo.

Dentro del espacio de nombres Microsoft.Phone.Tasks, disponemos de un gran número de tareas relacionadas con funcionalidades como enviar SMS’s a la que le corresponde la clase SmsComposeTask que será la que necesitaremos usar para alcanzar nuestro objetivo.

Para establecer un ejemplo, comenzaré por crear un botón al que asignaremos el evento Click o Tap (Para lo que necesitamos hacer da lo mismo el que usemos).

 

Dentro del evento, tenemos que escribir el siguiente y complejísimo código.

1: private void btnSendSMS_Click(object sender, RoutedEventArgs e)

2: {

3: SmsComposeTask sms = new SmsComposeTask();

4: sms.To = "600123456";

5: sms.Body = "Testing SMS compose Task";

6: sms.Show();

7: }

 

Como podéis observar, lo que hacemos es crear una instancia de la clase SmsComposeTask y le asignamos un receptor “To”, el cuerpo del SMS “Body” y finalmente realizamos la llamada al método “Show” que será el encargado de abrir la tarea de envío de SMS’s

Una vez hecho, ejecutamos la aplicación y, al presionar el botón se abrirá la tarea de envío de SMS del sistema, lo que nos permitirá cambiar el receptor, editar el mensaje, enviarlo, añadir elementos como imágenes, vídeos, sonido, etc…

 

Ha sido realmente sencillo y espero que os sea útil. Podéis descargaros el proyecto desde aquí, además, progresivamente le iré añadiendo los nuevos ejemplos que vaya realizando.

 

NOTA: En el emulador el mensaje siempre aparecerá como enviado correctamente aunque realmente no se haya realizado el envío. Esto se debe a que el emulador simula GSM y la SIM. En un terminal, si el mensaje no se envía correctamente, aparecerá una notificación indicándolo.

 

Artículos de la serie

Windows Phone | Diferentes plantillas de elementos en LongListSelector con DataTemplateSelector

Escenario

Puede darse el caso en el que tengamos que aplicar diferentes plantillas a los elementos de una misma lista, en este artículo un LongListSelector. Para ello, tenemos varios métodos como por ejemplo usar Converters e ir aplicando distintos valores de propiedades según convenga (Lo explicaré en un próximo artículo), pero esto tiene un inconveniente y es que tendríamos que crear tantos converters como propiedades distintas queramos cambiar.

 

Solución

Bueno, ¿y cuál es la solución? Pues no es otra que hacer un uso un poco más avanzado de las herramientas de las que disponemos y crear un DataTemplateSelector que no es más que un “control” que nos permite crear un selector. Así pues, comencemos a ver cómo irlo creando paso a paso.

NOTA: En WPF y en Windows 8 se puede usar sin necesidad de este Workaround

 

Los datos

Bueno, para empezar debemos definir los datos con los que vamos a trabajar para poder determinar cuál va a ser el elemento diferenciador entre ellos. En este caso, he usado la lista de Speakers de las “Christmas Windows Phone Sessions” y les he añadido una propiedad “Type” que define el área a la que pertenecen entre Business, Developer y Designer. Así pues, tenemos a Alejandro Campos Magencio en el área Business, a mi como Designer y el resto como Developer. Y lo que quiero es diferenciarlos por el color de fondo de su nombre tal y como se muestra en la imagen de “resultado”.

El modelo que he creado es el siguiente:

public class SpeakerViewModel

{

    public int Id { get; set; }

    public string Type { get; set; }

    public string Title { get; set; }

    public string ProfilePhoto { get; set; }

}

 

Todos los Speakers los estoy recogiendo en una ObservableCollection<SpeakerViewModel> que tengo en mi ViewModel principal para, de esta forma, fácilmente pasárselo a la página de detalles (en la que no vamos a entrar ahora)

public void LoadSpeakers()

{

    this.Speakers.Add(new SpeakerViewModel() { Id = 1, Title = "Alejandro Campos Magencio", Type = "Business", ProfilePhoto = "/Assets/Speakers/Alejandro.jpg" });

    this.Speakers.Add(new SpeakerViewModel() { Id = 2, Title = "Josué Yeray", Type = "Developer", ProfilePhoto = "/Assets/Speakers/JosueYeray.jpg" });

    this.Speakers.Add(new SpeakerViewModel() { Id = 3, Title = "Roberto Luis Bisbé", Type = "Developer", ProfilePhoto = "/Assets/Speakers/RobertoLuisBisbe.jpg" });

    this.Speakers.Add(new SpeakerViewModel() { Id = 4, Title = "Javier Suárez Ruiz", Type = "Developer", ProfilePhoto = "/Assets/Speakers/JavierSuarez.jpg" });

    this.Speakers.Add(new SpeakerViewModel() { Id = 5, Title = "Rafa Serna", Type = "Developer", ProfilePhoto = "/Assets/Speakers/RafaSerna.jpg" });

    this.Speakers.Add(new SpeakerViewModel() { Id = 6, Title = "Santiago Porras", Type = "Designer", ProfilePhoto = "/Assets/Speakers/SantiagoPorras.jpg" });

}

 

Además de estos datos, que son los que se muestran al ejecutar la aplicación, como estamos diseñando cómo se verán los elementos querremos verlos en tiempo de edición, así que nos crearemos los Mockups dentro de un fichero XAML que referenciaremos en nuestra poniendo en la cabecera su referencia.

Referencia en la vista

d:DataContext="{d:DesignData SampleData/MainViewModelSampleData.xaml}"

 

Datos de ejemplo

<vm:MainViewModel.Speakers>

    <vm:SpeakerViewModel Id="1" Title="Alejandro Campos Magencio"   Type="Business" ProfilePhoto="/Assets/Speakers/Alejandro.jpg"/>

    <vm:SpeakerViewModel Id="2" Title="Josué Yeray"   Type="Developer" ProfilePhoto="/Assets/Speakers/JosueYeray.jpg"/>

    <vm:SpeakerViewModel Id="3" Title="Roberto Luis Bisbé" Type="Developer" ProfilePhoto="/Assets/Speakers/RobertoLuisBisbe.jpg"/>

    <vm:SpeakerViewModel Id="4" Title="Javier Suárez Ruiz"  Type="Developer" ProfilePhoto="/Assets/Speakers/JavierSuarez.jpg"/>

    <vm:SpeakerViewModel Id="5" Title="Rafa Serna"  Type="Developer" ProfilePhoto="/Assets/Speakers/RafaSerna.jpg"/>

    <vm:SpeakerViewModel Id="6" Title="Santiago Porras"   Type="Designer" ProfilePhoto="/Assets/Speakers/SantiagoPorras.jpg"/>

</vm:MainViewModel.Speakers>

NOTA: Si hemos usado una plantilla con datos al crear la aplicación (Windows Phone Databound App, Windows Phone Pivot App o Windows Phone Panorama App) dispondremos de un archivo “SampleData/MainViewModelSampleData” que ya está asociado a la vista MainPage.xaml y que podremos usar para realizar esta acción.

 

Una vez hayamos hecho esto y teniendo un LongListSelector enlazado a los datos, podremos ver que nos aparecen elementos en la Vista Diseño, con lo que podremos darle color a los elementos.

 

Implementar la clase DataTemplateSelector

Ahora que ya tenemos los datos, debemos crear la base del selector de plantillas que debe heredar de “ContentControl” que se encuentra dentro del espacio de nombres “System.Windows.Controls”.

public abstract class DataTemplateSelector : ContentControl

{

    public virtual DataTemplate SelectTemplate(object item, DependencyObject container)

    {

        return null;

    }

    protected override void OnContentChanged(object oldContent, object newContent)

    {

        base.OnContentChanged(oldContent, newContent);

        ContentTemplate = SelectTemplate(newContent, this);

    }

}

Como se puede apreciar, hay dos métodos virtuales que debemos implementar al heredar de ContentControl

• SelectTemplate: Selecciona una plantilla (De momento lo dejamos como null porque lo implementaremos más adelante en otra clase).
  
• OnContentChanged: Define la plantilla que se muestra al cambiar el contenido, cosa que sucede cuando se rellenan los datos con el Binding. Esta es la que usaremos para nuestro ejemplo.

 

Implementar la clase que gestione los elementos, ItemDataTemplateSelector

Continuamos con el trabajo creando la clase que realmente va a realizar el cambio de plantilla atendiendo al campo “Type” del modelo SpeakerViewModel.

Esta clase, que he llamado ItemDataTemplateSelector, hereda de DataTemplateSelector y contiene, una propiedad por cada diferente plantilla y la sobreescritura del método SelectTemplate que atiende al campo “Type” para definir la plantilla que se ha de mostrar.

public class ItemDataTemplateSelector : DataTemplateSelector

{

    public DataTemplate Designer

    {

        get;

        set;

    }

    public DataTemplate Developer

    {

        get;

        set;

    }

    public DataTemplate Business

    {

        get;

        set;

    }

    public override DataTemplate SelectTemplate(object item, DependencyObject container)

    {

        SpeakerViewModel speaker = item as SpeakerViewModel;

        if (speaker != null)

        {

            if (speaker.Type == "Designer")

                return Designer;

            else if (speaker.Type == "Developer")

                return Developer;

            else 

                return Business;

        }

        return base.SelectTemplate(item, container);

    }

}

 

Usar las diferentes plantillas gestionadas por ItemDataTemplateSelector

Ya sólo nos queda crear las plantillas e indicarle al LongListSelector que haga uso de ellas.

En primer lugar, tenemos que definir el espacio de nombres en el que hemos incluido el selector de plantillas ItemDataTemplateSelector que, en mi caso, he puesto en una carpeta Helpers. Así pues, en la cabecera de la vista donde tengamos el LongListSelector, debemos añadir la siguiente línea:

xmlns:local="clr-namespace:Sample_2.Helpers"

Nótese que “local” puede ser sustituido por lo que queráis, pero tenéis que tenerlo en cuenta más adelante.

El siguiente paso, es crear las plantillas dentro del LongListSelector, haciendo referencia a las propiedades correspondientes a cada una de las plantillas que definimos en ItemDataTemplateSelector, como por ejemplo “local:ItemDataTemplateSelector.Developer”.

<phone:LongListSelector Grid.Row="1" ItemsSource="{Binding Speakers}" LayoutMode="Grid" GridCellSize="180,180">

    <phone:LongListSelector.ItemTemplate>

        <DataTemplate>

            <local:ItemDataTemplateSelector Content="{Binding}" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">

                <local:ItemDataTemplateSelector.Developer>

                    <DataTemplate>

                        <Grid Height="180" Margin="5" Width="180" Background="#FFE00109">

                            <Border BorderBrush="Black" Height="50" VerticalAlignment="Bottom" Background="#FFE00109">

                                <TextBlock Text="{Binding Title}" Style="{StaticResource PhoneTextExtraLargeStyle}" Foreground="White" FontSize="24" VerticalAlignment="Center"/>

                            </Border>

                        </Grid>

                    </DataTemplate>

                </local:ItemDataTemplateSelector.Developer>

                <local:ItemDataTemplateSelector.Designer>

                    <DataTemplate>

                        <Grid Height="180" Margin="5" Width="180" Background="#FF009045">

                            <Border BorderBrush="Black" Height="50" VerticalAlignment="Bottom" Background="#FF009045">

                                <TextBlock Text="{Binding Title}" Style="{StaticResource PhoneTextExtraLargeStyle}" Foreground="White" FontSize="24" VerticalAlignment="Center"/>

                            </Border>

                        </Grid>

                    </DataTemplate>

                </local:ItemDataTemplateSelector.Designer>

                <local:ItemDataTemplateSelector.Business>

                    <DataTemplate>

                        <Grid Height="180" Margin="5" Width="180" Background="#FF7b057e">

                            <Border BorderBrush="Black" Height="50" VerticalAlignment="Bottom" Background="#FF7b057e">

                                <TextBlock Text="{Binding Title}" Style="{StaticResource PhoneTextExtraLargeStyle}" Foreground="White" FontSize="24" VerticalAlignment="Center"/>

                            </Border>

                        </Grid>

                    </DataTemplate>

                </local:ItemDataTemplateSelector.Business>

            </local:ItemDataTemplateSelector>

        </DataTemplate>

    </phone:LongListSelector.ItemTemplate>

</phone:LongListSelector>

Llegados a este punto, ya tenemos todo preparado para ejecutar el proyecto y ver el resultado.

 

Estructura final del proyecto

La estructura final del proyecto, debería contener algo como lo que muestro a continuación, con las dos clases que hemos creado para la selección de la plantilla, los ViewModel necesarios, los datos de ejemplo y la vista principal MainPage.xaml.

 

Código

Lo pondré en un próximo artículo con los recursos del Webcast en el que hablé de esto, siendo la solución que colgaré, más avanzada y con un aspecto algo diferente…

 

Enjoy it!

Windows Phone | Disponibles las nuevas versiones de los emuladores (Update 2 y Update 3)

En este nuevo año, Microsoft ha liberado actualizaciones de diferentes productos y, para los desarrolladores de Windows Phone no podía faltarnos la actualización de los emuladores.

• Desde el 2 de enero está disponible el Update 2 : Preparado para ambientes que sólo tengan Visual Studio 2013 RTM
• Desde el 6 de enero está disponible el Update 3 : Corresponden a Windows Phone Update 3 e incluso incluye un emulador con la resolución 1080p

En Verde UPDATE 2

En magenta UPDATE 3

NOTA: Estas actualizaciones requieren Visual Studio 2012 Update 3 o (b) RTM de Visual Studio 2013, con el SDK 8.0 de Windows Phone instalado.

¿Es importante aplicar estas actualizaciones? Desde mi humilde opinión, SÍ, para poder ofrecer aplicaciones adaptadas a las nuevas actualizaciones de Windows Phone y poder aportar a los usuarios la mejor experiencia posible. Además, como ya he comentado en otras ocasiones, cada actualización incluye una serie de mejoras y fixes absolutamente necesarios para que nuestras Apps aporten una calidad excelente.

Todas las descargas están disponibles en este enlace http://developer.windowsphone.com/en-us/downloadsdk

Windows Azure | Disponible una actualización de Windows Azure Storage Client Library (3.0.2)

El pasado 4 de enero, Microsoft liberó la nueva versión de la librería de Windows Azure Storage (3.0.2) y, cómo no, ésta está disponible en nuget.
Para instalarla, sólo tenemos que abrir el Package Manager Console y ejecutar el siguiente comando de PowerShell.

PM> Install-Package WindowsAzure.Storage

Esta acción actualizará la librería de Windows Azure Storage, no así el resto de componentes del SDK de Windows Azure.
Y os preguntaréis, ¿es una buena práctica actualizar sólo una librería cuando el resto se mantiene en la misma versión? La respuesta, al menos en este caso de la plataforma en la nube de Microsoft, es que sí, dado que cada versión incluye fixes y nuevas funcionalidades para adaptarse a la constante actualización, mejora y adición de componentes de Windows Azure. Veamos qué incluye esta actualización:

  - All (WP): Fixed an issue causing ArgumentOutOfRangeException in many APIs.

  - Queues: Fixed an issue causing NullReferenceException when trying to re-create an existing queue.

  - Tables: Fixed an issue with TableServiceContext causing NullReferenceException when the error response cannot be parsed.

  - Tables (RT): Do not allow users to set JsonFullMetadata format on RequestOptions in RT, because JSON is not supported on the RT library yet.


Como se puede observar,  han incluído 4 fixes que nos ayudarán a crear soluciones más robustas. Aquí podéis ver todas las notas de las versiones de la librería Windows Azure Storage.