Material del webcast “Descubriendo Windows Phone App Studio”

Javier Suárez Ruiz Deja un comentario

Christmas Windows Phone Sessions

Las Christmas Windows Phone Session son 12 webcasts cargados de información técnica tratando múltiples temas relacionados con Windows Phone.

El material

Recientemente realizamos el webcast “Descubriendo Windows Phone App
Studio” de las Christmas Windows Phone Session y ya tenemos el material
disponible.

La grabación la podéis volver a ver descagándola de la URL de registro.

También tenéis disponible la presentación de la charla:

Asi como los ejemplos de la misma:

Más información

Blog MSDN: Christmas Windows Phone Sessions

[Windows Phone] Rate My App

Javier Suárez Ruiz 3 comentarios

Introducción

En la Windows Phone Store un factor importante
que suelen tener en cuenta los usuarios para decantarse por descargar
una App u otra son las puntuaciones y las críticas de las mismas. Contar
con un número elevado de críticas manteniendo una nota media elevada
aumenta considerablemente las posibilidades de atraer a usuarios,
destacar en la Store y recibir un más que necesario feedback.

Rate My App

Una
forma efectiva de aumentar el número de críticas de la Aplicación suele
ser el recordar al usuario que realice la crítica tras ciertos usos de
la Aplicación. Rate My App es un componente de Nokia Developer que nos
permite realizar esta acción de una manera sumamente sencilla.
Basicamente muestra un recordatorio al usuario tras haber lanzado la
Aplicación 5, 10 o un número configurado de veces.

NOTA:
Por defecto, cuando una Aplicación con el componente Rate My App se
ejecuta por quinta vez se muestra el recordatorio de añadir crítica a la
misma.

Como solemos hacer, vamos a crear una Aplicación de ejemplo para utilizar y ver las posibilidades de Rate My App:


Creamos un proyecto desde la
plantilla más básica para concentrar nuestra atención en el componente
que nos ocupa en esta entrada.

Tras crear el proyecto lo primero
que vamos a hacer es instalar la librería necesaria para poder usar Rate
My App. Vamos a usar NuGet para ello. Accedemos a:

Tools > Library Package Manager > Manage NuGet Packages for Solution…

Se
nos abrirá una nueva ventana donde podremos buscar el componente.
Buscamos por «RateMyApp» e instalamos la primera opción creada por Nokia
Developer:

NOTA: También podemos instalar la librería usando el Package Manager Console ejecutando el comando: Install-Package RateMyApp

Tras
instalar la librería ya estamos preparados para usar el control. Vamos a
añadir el control en nuestra página principal (MainPage) creada con el
proyecto. Para ello, de entrada, añadimos una referencia a la librería
en el PhoneApplicationPage:

xmlns:rate="clr-namespace:RateMyApp.Controls;assembly=RateMyApp"

El control a utilizar se llamada FeedbackOverlay. Añadiremos el control al final de Grid principal ocupando las dos filas del mismo (propiedad adjunta RowSpan):

<rate:FeedbackOverlay x:Name="FeedbackOverlay"
     Grid.RowSpan="2"
     FeedbackTo="contacto@correo.es"
     ApplicationName="Ejemplo Rate My App"
     CompanyName="Nombre Compañia"/>

Hemos creado el control junto a sus tres propiedades principales:

  • FeedbackTo: Propiedad de tipo string que espera el correo electrónico donde se enviará el feedback escrito por el usuario.
  • ApplicationName: Propiedad de tipo string que mostrará el nombre de la Aplicación en el recordatorio.
  • CompanyName: Propiedad de tipo string que mostrará el nombre de la compañia responsable de la Aplicación.

Todas las propiedades podrían estar en archivos de recursos:

Quedando el control de una manera similar pero realizando bindings a las cadenas del archivo de recusos:

<rate:FeedbackOverlay x:Name="FeedbackOverlay"
     Grid.RowSpan="2"
     FeedbackTo="{Binding Path=LocalizedResources.FeedbackTo, Source={StaticResource LocalizedStrings}}"
     ApplicationName="{Binding Path=LocalizedResources.ApplicationTitle, Source={StaticResource LocalizedStrings}}"
     CompanyName="{Binding Path=LocalizedResources.CompanyName, Source={StaticResource LocalizedStrings}}"
     FirstCount="2"
     SecondCount="4" />

En esta ocasión hemos añadidos otras dos propiedades nuevas. El
control FeedbackOverlay muestra el recordatorio para añadir la crítica
al usuario tras la quinta ejecución de la Aplicación volviendo a
mostrarlo en caso de no haberla añadido tras la décima apertura de la
Aplicación.

Las propiedades añadidas:

  • FirstCount: Propiedad de tipo entero que permite indicar tras cuantas ejecuciones se muestra por primera vez el recordatorio.
  • SecondCount:
    Propiedad de tipo entero que permite indicar tras cuantas ejecuciones
    se muestra por segunda vez el recordatorio si no se ha añadido crítica
    previamente.

Hasta este punto tenemos todo lo necesario para
utilizar el control. Para poder probarlo todo de manera adecuadamente
tenemos a nuestra disposición un helper que nos facilita el acceso a
toda la información relacionada con el control. Podemos asignar esa
información como contexto:

#if DEBUG
DataContext = FeedbackHelper.Default;
#endif

Y acceder a ella desdela interfaz:

<StackPanel>
     <TextBlock Text="{Binding FirstCount, StringFormat='Propiedad First count: {0}'}" />
     <TextBlock Text="{Binding SecondCount, StringFormat='Propiedad Second count: {0}'}" />
     <TextBlock Text="{Binding State, StringFormat='Estado: {0}'}" />
     <TextBlock Text="{Binding LaunchCount, StringFormat='Se ha abierto: {0} veces'}" />
     <TextBlock Text="{Binding IsReviewed, StringFormat='Tiene ya crítica: {0}'}" />
     <TextBlock Text="{Binding LastLaunchDate, StringFormat='Última ejecución: {0:G}'}" />
</StackPanel>

El resultado:

Tenemos información de cuantas veces se ha registrado la ejecución de
la Aplicación, cuando fue la última vez que se ejecuto, estado, valores
de las propiedad First Count y Second Count y si se ha añadido ya una
crítica o no. Sin duda, una información muy útil en el desarrollo.

Con
lo visto hasta ahora tenemos todo lo necesario exigible a un control
para gestionar los recordatorios de añadir crítica. Sin embargo, el
control es totalmente personalizable y contamos con muchas más opciones:

<ctrl:FeedbackOverlay Grid.RowSpan="2"
     EnableAnimation="True"
     RatingTitle="RatingTitle"
     RatingMessage1="Rating Message 1"
     RatingMessage2="Rating Message 2"
     RatingYes="Yes"
     RatingNo="No"
     FeedbackTitle="FeedbackTitle"
     FeedbackMessage1="Feedback Message 1"
     FeedbackYes="Yes"
     FeedbackNo="No"
     FeedbackTo="{Binding Path=LocalizedResources.FeedbackTo, Source={StaticResource LocalizedStrings}}"
     FeedbackSubject="Feedback Subject"
     FeedbackBody="Feedback Body"
     CompanyName="MyCompany"
     FirstCount="2"
     SecondCount="4"
     CountDays="False"
     />

Podemos personalizar los textos de cabecera, de los botones, etc. El resultado podría ser algo como:

Si no se añade crítica se pide feedback al usuario:

Podéis descargar el ejemplo realizado del siguiente enlace:


Más información

Material del Webcast "Windows Phone 8 Update 3. Cambios para los desarrolladores"

Javier Suárez Ruiz Deja un comentario

Christmas Windows Phone Sessions

Las Christmas Windows Phone Session son 12 webcasts cargados de información técnica tratando múltiples temas relacionados con Windows Phone.

El material

Recientemente
realizamos el webcast «Windows Phone 8 Update 3. Cambios para los
desarrolladores» de las Christmas Windows Phone Session y ya tenemos el
material disponible.

La grabación la podéis volver a ver descagándola de la URL de registro.

También tenéis disponible la presentación de la charla:

 

Asi como los ejemplos de la misma:


Más información

Blog MSDN: Christmas Windows Phone Sessions

[Tips and Tricks] Windows Phone. Obtener el operador de telefonía

Javier Suárez Ruiz Deja un comentario

Introducción

En la entrada actual nos vamos a centrar en las opciones que nos brinda la clase DeviceNetworkInformation.
Esta clase nos expone propiedades que nos ayudan a  identificar y
conocer más sobre las capacidades de la red, como por ejemplo,
identificar la disponibilidad de la red, la disponibilidad de roaming de
datos, de red WiFi, etc.

DeviceNetworkInformation es una clase estática que tenemos disponible dentro del espacio de nombres Microsoft.Phone.Net.NetworkInformation que cuenta con una serie de propiedades booleanas además de los métodos ResolveHostNameAsync y NetworkAvailabilityChanged.

NOTA: Todas  las propiedades son estáticas por lo que no es necesario crear instancia.

Las propiedades son:

  • CellularMobileOperator
  • IsCellularDataEnabled
  • IsCellularDataRoamingEnabled
  • IsNetworkAvailable
  • IsWiFiEnabled

Obtener el operador

Entre el listado de propiedades, contamos con una de ellas, CellularMobileOperator que es bastante interesante. Esta propiedad nos permite obtener el nombre del operador móvil usado en el dispositivo.

NOTA: En el caso del emulador siempre obtendremos el valor “Fake GSM Network”.

Vamos a crear un pequeño ejemplo para probar la clase. Tras crear un
proyecto nuevo, en la interfaz añadiremos un simple botón para tras
pulsarlo obtener el operador:

<Button Content="Ver Operador" Height="100" Click="Button_Click"/>
El resultado visual será algo simular a lo siguiente:

 

Al pulsar el botón, realizaremos:
private void Button_Click(object sender, RoutedEventArgs e)
{
     MessageBox.Show(DeviceNetworkInformation.CellularMobileOperator);
}
Obtendremos el nombre del operador en el mensaje en pantalla:

Podéis descargar el ejemplo desde el siguiente enlace:

Más información

[Evento] Christmas Windows Phone Sessions

Javier Suárez Ruiz Deja un comentario

Introducción

El pasado octubre nos juntamos Josue Yeray, Rafa Serna, Alejandro Campos, Roberto Luis Bisbé y un servidor para organizar un gran evento sobre Windows Phone en Madrid llamado Windows Phone Week Spain.

Fue un día intenso con muchas charlas técnicas tratando temas como
Azure Mobile Services, Windows Phone App Studio, MVVM y buenas
prácticas, análisis de rendimiento, pasar apps de WP7 a WP8, Nokia
Imaging SDK y mucho más donde. Además tuvimos un divertido concurso
final con regalos, muchas charlas interesantes, devirtualización de
muchos, etc. En definitiva, un gran día dedicado a Windows Phone con una
enorme aceptación. Tanta que, debido a personas que no pudieron
asistir, a los límites del aforo y por petición popular, estas navidades, 
vamos a realizar una serie de webcasts con todo lo que contamos en la
Windows Phone Week Spain. Pero como no podíamos quedarnos quietos, hemos
añadido webcast nuevos con más temática que a buen seguro serán de tu
interés.

Christmas Windows Phone Sessions

Asi nace las Christmas Windows Phone Session,  12 webcasts cargados de información técnica tratando múltiples temas relacionados con Windows Phone con los ponentes del Windows Phone Week como encargados además contando con la colaboración de Santiago Porras.

Las sesiones

Las sesiones serán las siguientes:

  • Introducción al diseño de Apps para Windows Phone

Lunes 2 de diciembre de 6pm a 7pm, por Santiago Porras

¿Aún no conoces Modern UI y sus
reglas? Descubre la guía de diseño Modern UI para Windows Phone, las
bases sobre las que se ha desarrollado este revolucionario estilo de
diseño y cuáles son las reglas que debemos seguir para diseñar nuestras
aplicaciones.
Regístrate

  • Desde Windows Phone 7 a Windows Phone 8

Martes 3 de diciembre de 6pm a 7pm, por Roberto Luis Bisbé

Migrar aplicaciones de Windows Phone 7
a Windows Phone 8 es algo relativamente sencillo, que se puede
convertir en una travesía por el desierto en función de la complejidad
de
nuestra app, En esta sesión veremos algunos trucos a tener en cuenta al
migrar nuestras apps, y las opciones que tenemos para mantener
compatibilidad entre Windows Phone 8 y 7.5.
Regístrate

  • Desarrollando con MVVM

Miércoles 4 de diciembre de 6pm a 7pm, por Josue Yeray

Aprende a escribir mejor código, más
mantenible y extensible, usando el patron MVVM, IoC y servicios. Veremos
los conceptos necesarios para escribir buen código que nos permita
crear mejores apps.
Regístrate

  • Windows Phone 8 Update 3. Cambios para los desarrolladores

Jueves 5 de diciembre de 6pm a 7pm, por Javier Suarez Ruíz

A pesar de no contar con nueva versión
del SDK sí que contamos con interesantes novedades en el último Update
del sistema. En esta sesión aprenderemos todas esas novedades a nivel de
desarrollo como por ejemplo, todos los cambios necesarios a realizar
para adaptar nuestras aplicaciones actuales a las nuevas pantallas a
1080p que están a punto de llegar.
Regístrate

  • Optimiza tus apps de Windows Phone 8

Lunes 9 de diciembre de 6pm a 7pm, por Alejandro Campos Magencio

¿Desarrollas o tienes pensado
desarrollar apps para Windows Phone con .NET y XAML? Entonces
necesitarás saber qué puede afectar al rendimiento de tu app, cómo
mejorarlo para que su comportamiento sea el más óptimo posible, y qué
herramientas tienes a tu disposición. Y en esta sesión te lo contamos
con ejemplos prácticos.
Regístrate

  • ¡¡¡NFC a tope!!!

Martes 10 de diciembre de 6pm a 7pm, por Rafa Serna

¿Sabes qué es NFC? ¿dónde y cómo
podemos usarlo? Estas y otras preguntas más intentaremos resolverlas en
este webcast, en donde veremos cómo poder interactuar entre nuestras
aplicaciones
Windows Phone con la tecnología NFC.
Regístrate

  • Descubriendo Windows Phone App Studio

Jueves 12 de diciembre de 6pm a 7pm, por Javier Suarez Ruíz

¿Conoces Windows Phone App Studio?,
¿aún no? En esta sesión conoceremos todas las posibilidades de esta
nueva herramienta web gratuita destinada a la creación de Aplicaciones
para Windows Phone 8.
Regístrate

  • Efectos alucinantes con Nokia Imaging SDK

Viernes 13 de diciembre de 6pm a 7pm, por Josue Yeray

¿Quieres hacer una aplicación que
trabaje con imágenes? ¿Te parecen alucinantes los filtros de Instagram?
En esta sesión veremos como implementar en nuestras aplicaciones filtros
alucinantes con la nueva librería de imágenes de Nokia!
Regístrate

  • Diseño de Apps exclusivas para Windows Phone

Lunes 16 de diciembre de 6pm a 7pm, por Santiago Porras

¿Quieres hacer aplicaciones más
atractivas para Windows Phone con interfaces con un toque exclusivo como
la App de Facebook? Descubre tips para diseñar Apps para Windows
Phone creando interfaces que las hagan exclusivas y fascinantes y que
consigan que los usuarios descubran nuevas experiencias con sus
dispositivos.
Regístrate

  • Azure Mobile Services, desde las trincheras

Martes 17 de diciembre de 6pm a 7pm, por Rafa Serna

La pata de servicios
móviles de Windows Azure es muy extensa y golosa. Con esta charla
intentaremos ver que nos aporta Mobile Services y como podemos de una
forma fácil, integrar en nuestra aplicación de Windows Phone un completo
y extenso BackEnd en la nube. Autenticación, lógica, servicio de datos y
demás complementos, casi a un click de distancia.
Regístrate

  • Cimbalino Toolkit y Multilingual Toolkit

Miércoles 18 de diciembre de 6pm a 7pm, por Josue Yeray

Cuando estamos desarrollando nuestras
aplicaciones, no necesitamos reinventar la rueda. Existen ciertos
frameworks que pueden ayudarnos en tareas comunes, simplificar el
desarrollo y ayudarnos a realizar cosas complejas. Cimbalino Toolkit,
creado por Pedro Lamas de Nokia, nos ayudará con multitud de servicios,
behaviors y controles ya listos para trabajar. Multilingual App Toolkit
nos ayudará a
soportar multiples idiomas en nuestra aplicación.
Regístrate

  • Distribución empresarial en Windows Phone 8

Jueves 19 de diciembre de 6pm a 7pm, por Javier Suarez Ruíz

En esta sesión aprenderemos todo lo
necesario para distribuir Aplicaciones Windows Phone en la empresa sin
necesidad de pasar por la Store. Aprenderemos como obtener un
certificado empresarial, como firmar aplicaciones, como distribuirla e
incluso aprenderemos el concepto de Company Hub creando uno paso a paso.
Regístrate

NOTA: Todas las sesiones serán grabadas para poder
visualizarlas posteriormente aunque no dudéis en conectar online para
aprovechar y poder realizar preguntas al ponente de turno.

Más información

[Tips and Tricks] Windows Phone. Detener la sintetización de voz

Javier Suárez Ruiz Deja un comentario

Introducción

Una de las novedades más interesantes del SDK de Windows Phone 8 son las Speech APIs (Text to Speech, Speech to Text, Comandos de voz, etc.). Nos centrarnos en TTS (Text To Speech) o lo que es lo mismo sintetizar un sonido a partir de un texto escrito.

El problema

Ya en un artículo anterior
vimos como utilizar esta API. Sin embargo, ene se artículo no veíamos
un detalle muy importante. Una vez iniciada la slintetización de un
texto, ¿cómo lo paramos?. A esa sencilla pregunta responderemos en este
Tips and Tricks.

La solución

Vamos a crear una aplicación de ejemplo:

Aplicación de Windows Phone


Lo primero que debemos hacer antes de continuar es aádir la capacidad de Reconocimiento de voz (ID_CAP_SPEECH_RECOGNITION).
Para ello dentro de carpeta Properties encontramos el archivos
WMAppManifiest.xml. Lo abrimos y nos dirigimos a la pestaña Capacidades:

ID_CAP_SPEECH_RECOGNITION

Creamos
la interfaz. Añadiremos la interfaz más simple posible para nuestro
objetivo, un par de botones. Uno para comenzar a sintetizar texto en voz
y el segundo para detenerlo:

<StackPanel>
     <Button Content="Leer" Click="Leer_Click"/>
     <Button Content="Parar de leer" Click="Parar_Click"/>
</StackPanel>

 

 

Añadimos los eventos en el code-behind:

private void Leer_Click(object sender, RoutedEventArgs e)
{
 
}
 
private void Parar_Click(object sender, RoutedEventArgs e)
{
 
}
Nos centramos en la lógica del primer botón. Para cancelar la síntesis
de voz tenemos que asignar el valor devuelto por el método SpeakTextAsync del objeto SpeechSynthesizer a una variable de tipo IAsyncAction
para posteriormente llamar al método Cancel del IAsyncAction para
cancelar la síntesis de voz. Para ello, creamos una variable global de
tipo IAsyncAction:
private IAsyncAction _task;
Y en la lógica del clic del botón:
var synth = new SpeechSynthesizer();
 
var voices = InstalledVoices.All.Where(v => v.Language == "es-ES").OrderByDescending(v => v.Gender);
 
synth.SetVoice(voices.FirstOrDefault(v => v.Gender == VoiceGender.Male));
 
_task = synth.SpeakTextAsync("Esto es una prueba. Realmente dura mucho más de lo necesario. Si quieres puedes parar pulsando el botón Parar Voz");

Instanciamos un objeto de tipo SpeechSynthesizer. Con LINQ seleccionamos el conjunto de sintetizadores españoles de la clase InstalledVoices. Seleccionamos el genéro masculino por ejemplo. Establecemos el sintetizador elegido utilizando el método SetVoice. Por último, llamamos al método SpeakTextAsync que recibirá como parámetro el texto a sintetizar en voz.

En el clic del segundo botón:

_task.Cancel();

Fácil, ¿verdad?

Podéis descargar el ejemplo desde el siguiente enlace:

Más información

[Tips and Tricks] Windows Phone. Optimiza tus Apps a pantallas grandes

Javier Suárez Ruiz Deja un comentario

Novedades de la actualización Update 3

Desde hace unas semanas ya tenemos disponible la actualización Update 3 (también conocida previamente como GDR3). Entre el listado de mejoras incluidas contamos con:

  • Más grande. Se suprime el límite de tamaño en
    resolución establecido permitiendo la llegada en el futuro de teléfonos
    con pantallas de 5 o 6 pulgadas con resolución de 1080p (1080 × 1920).
  • Más potencia. La actualización permite también utilizar los procesadores de cuatro núcleos de Qualcomm.
  • Mayor personalización. La actualización permite asignar tonos diferentes a diferentes Apps como mensajes, correos, recordatorios, alarmas, etc.
  • Mayor control. Podemos controlar que Apps se ejecutan en Background y ahora además podemos cerrarlas.
  • Más accesible. Se realiza un esfuerzo por facilitar
    el uso del dispositivo a personas invidentes. Se permite la gestión de
    llamadas, correos, contactos, uso de Skype o Lync, etc.

Nuevos dispositivos llegan…

El pasado 22 de Octubre Nokia presentaba en Abu Dhabi su primera flamante tablet, el Lumia 2520. También desvelaba dos nuevos smartphones de pantalla grande los Lumia 1520 y 1320:

Con los dispositivos recién anunciados por Nokia se aumenta el rango
de posibilidades en resoluciones y aspect ratio. El Nokia Lumia 1520
cuenta con una resolución de 1080x1920px y el Nokia Lumia 1320 cuenta
con una resolución de 720x1280px, ambos con una pantalla de 6 pulgadas y
16:9 de aspect ratio.

Esto abre un nuevo debate a los desarrolladores, ¿cómo preparo mis
Apps para sacar el máximo provecho en este tipo de dispositivos?

Impacto en Apps existentes

Aplicaciones Windows Phone 8

En el archivo de manifiesto vienen incluidas las resoluciones que soportará nuestra Aplicación:

<ScreenResolutions>
     <ScreenResolution Name="ID_RESOLUTION_WVGA"/>
     <ScreenResolution Name="ID_RESOLUTION_WXGA"/>
     <ScreenResolution Name="ID_RESOLUTION_HD720P"/>
</ScreenResolutions>
La resolución 1080p no se distingue de los 720p, por lo tanto, si nuestra Aplicación soporta 720p (ID_RESOLUTION_HD720P) funcionará en dispositivos 1080p.

NOTA: Si tu Aplicación Windows Phone 8 no soporta 720p tampoco estará disponible para dispositivos 1020p.

Aplicaciones Windows Phone 7

Las Aplicaciones Windows Phone 7 funcionaran sin problemas en
dispositivos con la actualización Update 3 y con un aspect ratio de
16:9. Sin embargo, y dado que estas Aplicaciones se crearon con un
aspect ratio de 15:9, no se reescalaran correctamente dejando una banda
negra en la parte superior de la pantalla.

Optimizando Apps a pantallas grandes

Como ya hemos comentado, contamos con una nueva resolución. Sin duda,
para poder ofrecer a nuestros usuarios la mejor experiencia posible en
cualquiera de las resoluciones disponibles, necesitamos identificar cada
una de ellas, la nueva resolución de 1080p incluida:

Sin embargo, entre las resoluciones 720p y 1080p no podemos encontrar
diferencias utilizando la propiedad App.Current.Host.Content.ScaleFactor o Application.Current.Host.Content.ActualHeight ya que en ambas devuelven los mismos resultados, 150 y 853 respectivamente.

¿Cómo diferenciar entonces entre un dispositivo 720p y otro 1080p?

Microsoft nos facilita una nueva clase DeviceExtendedProperties que nos facilita información relacionada con la resolución. Las nuevas propiedades son:

  • PhysicalScreenResolution: Variable de tipo Size, nos devuelve el ancho y alto de la pantalla en pixeles.
  • RawDpiX: Variable de tipo double, devuelve los DPI del horizontal de la pantalla.
  • RawDpiY: Variable de tipo double, devuelve los DPI del vertical de la pantalla.

Podremos detectar si estamos ante un dispositivo 1080p de la siguiente forma:

static private double _screenSize = -1.0f;
static private double _screenDpiX = 0.0f;
static private double _screenDpiY = 0.0f;
static private Size _resolution;
 
try
{
     _screenDpiX = (double)DeviceExtendedProperties.GetValue("RawDpiX");
     _screenDpiY = (double)DeviceExtendedProperties.GetValue(";RawDpiY");
     _resolution = (Size)DeviceExtendedProperties.GetValue("PhysicalScreenResolution");
 
     _screenSize = Math.Sqrt(Math.Pow(_resolution.Width / _screenDpiX, 2) +
                   Math.Pow(_resolution.Height / _screenDpiY, 2));
}
catch (Exception e)
{
     _screenSize = 0;
}
 
return (_screenSize >= 6.0f);

NOTA: Gracias a las nuevas propiedades vistas anteriormente podemos calcular el tamaño en pulgadas de la pantalla. Podéis ajustar el valor. De momento no existen dispositivos con pantallas de 5″ aunque podríamos considerar un Phablet a un dispositivo de 5″.

Detectado cuando estamos ante las nuevas pantallas de 6″ de los
nuevos dispositivos que llegarán como el Nokia Lumia 1520 o el Nokia
Lumia 1320 nos permite adaptar dinamicamente el layout de nuestra
Aplicación para aprovechar de la mejor manera posible cada dispositivo.

¿Cómo?

Bien, como solemos hacer, vamos a crear una Aplicación de ejemplo para ello:

Vamos a crear un listado tipo album que
adaptaremos segun el tipo de resolución. En dispositivos WVGA y WXGA
mostraremos dos columnas mientras que en dispositivos 720p y 1020p
mostraremos una columna más de una forma similar a como el propio
sistema muestra una columna más de tiles.

Comenzamos centrándonos en la interfaz de la Aplicación, añadimos el listado donde mostrar todas las fotos del album:

<phone:LongListSelector>
</phone:LongListSelector>
Definimos el template de cada elemento del listado:
<DataTemplate>
     <Grid Margin="10, 5">
     <Grid.RowDefinitions>
          <RowDefinition Height="*" />
          <RowDefinition Height="Auto" />
     </Grid.RowDefinitions>
     <Image Grid.Row="0" Source="{Binding Image}" Style="{StaticResource GridImage}" />
     <TextBlock Grid.Row="1" Margin="0" Text="{Binding Title}" />
</Grid>
</DataTemplate>

Necesitamos datos para poder probar… vamos a darle solución.
Crearemos una viewmodel para nuestra vista donde obtendremos un listado
de elementos.

Antes de crear la viewmodel, definiremos el modelo, cada elemento del album:

public class Item
{
     public string Title { get; set; }
     public string Image { get; set; }
}
A continuación, en nuestro viewmodel crearemos una colección de elementos:
private ObservableCollection<Item> _items;
 
public ObservableCollection<Item> Items
{
     get
     {
          return _items;
     }
}
Creamos un método LoadData donde se creará un listado de datos que para
este ejemplo será el listado de juegos de la inminente Xbox One:
private void LoadData()
{
_items = new ObservableCollection<Item>
{
new Item
{
     Title = "Forza Motorsport 5",
     Image = "http://compass.xboxlive.com/assets/cd/33/cd33e4ec-5406-40d4-8129-b92504e877d3.jpg?n=Forza%205.jpg"
},
new Item
{
     Title = "Ryse: Son of Rome",
     Image = "http://compass.xboxlive.com/assets/4a/8c/4a8cc02a-ed1a-432f-9fbd-42de90a4525e.jpg?n=Ryse.jpg"
},
new Item
{
     Title = "Kinect Sports Rivals",
     Image = "http://compass.xboxlive.com/assets/95/1e/951e1851-a32b-4738-903a-ed58839cb0bc.jpg?n=KinectSportsRivals.jpg"
},
new Item
{
     Title = "Dead Rising 3",
     Image = "http://compass.xboxlive.com/assets/bd/83/bd835a75-d7be-4134-b7c7-b9730f8b3dde.jpg?n=DeadRising3_hubhero.jpg"
},
new Item
{
     Title = "Halo para Xbox One",
     Image = "http://compass.xboxlive.com/assets/17/69/1769a7af-4a9a-4b23-9ef7-ddb9dbdc10a3.jpg?n=HaloXboxOne-200x190.jpg"
},
new Item
{
     Title = "Sunset Overdrive",
     Image = "http://compass.xboxlive.com/assets/f9/60/f9606a94-2318-4b8a-87b1-a387cfe96661.jpg?n=SunsetOverdrive.jpg"
},
new Item
{
     Title = "Quantum Break",
     Image = "http://compass.xboxlive.com/assets/97/16/9716a7e4-62ed-403b-a2de-19aa9e34445a.jpg?n=Quantum%20Break.jpg"
},
new Item
{
     Title = "Killer Instinct",
     Image = "http://compass.xboxlive.com/assets/07/1c/071c4e77-273e-45e2-84fd-2a0006eb582a.png?n=KillerInstinct200x190.png"
},
new Item
{
     Title = "Project: Spark",
     Image = "http://compass.xboxlive.com/assets/ab/bf/abbfc373-38e0-4fe6-88a1-3d325ff571d0.png?n=ProjectSpark_banner_tree_200x190.png"
},
new Item
{
     Title = "Zoo Tycoon",
     Image = "http://compass.xboxlive.com/assets/fb/df/fbdfa0e9-fc9b-4c38-a512-f6fb421e4924.jpg?n=Zoo_Tycoon_200x190.jpg"
},
new Item
{
     Title = "Titanfall",
     Image = "http://compass.xbox.com/assets/8f/db/8fdb6276-3d2e-49e5-9ba6-76082d63e715.jpg?n=hero-titanfall-metro-200x190.jpg"
},
new Item
{
     Title = "Call of Duty: Ghosts",
     Image = "http://compass.xboxlive.com/assets/c7/b9/c7b96d97-d1f7-4ffe-9d52-a29298383e3f.jpg?n=COD_Ghosts.jpg"
}
};
Cargamos los datos desde el constructor:
public MainViewModel()
{
     LoadData();
}

Creamos un estilo por defecto que se utilizará en nuestra Aplicación. En
este archivo de recursos crearemos los estilos a usar por defecto, en
nuestro ejemplo, el estilo por defecto del listado:

<Style x:Key="ListStyle" TargetType="phone:LongListSelector">
     <Setter Property="GridCellSize" Value="140, 140" />
</Style>
Añadimos el archivo de recursos en nuestro App.xaml:
<ResourceDictionary>
     <ResourceDictionary.MergedDictionaries>
          <ResourceDictionary Source="Themes/DefaultStyles.xaml" />
     </ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
Asignamos el estilo correspondiente al listado:
Style="{StaticResource ListStyle}"
Todo listo!. Si ejecutamos nuestra Aplicación obtendremos el siguiente resultado:

Pinta bien, aunque… podemos mejorar la experiencia de uso segun el dispositivo!

Crearemos otro archivo de recursos destinado a sobrescribir el
utilizado por defecto en dispositivos con pantallas grandes. En este
archivo de recursos definimos el estilo a usar en nuestra lista album:

<Style x:Key="ListStyle" TargetType="phone:LongListSelector">
     <Setter Property="GridCellSize" Value="140, 140" />
</Style>
Nos crearemos un helper que utilizaremos para detectar si estamos ante
un dispositivo 1080p (tal y como vimos previamente) para cargar
dinámicamente el archivo de recursos destinado a pantallas grandes y
sobrescribir el layout:
public static void Set1080PTheme()
{
     if (ResolutionHelper.Is1080P)
     {
         var the1080PTheme = new ResourceDictionary
         {
             Source = new Uri("/EjemploResolucion;component/Themes/HDStyles.xaml", UriKind.RelativeOrAbsolute)
         };
 
         Application.Current.Resources.MergedDictionaries.Add(the1080PTheme);
     }
}
Lo llamaremos al inicio de nuestra Aplicación en el App.xaml.cs:
ThemeSelector.Set1080PTheme();
Y el resultado es el siguiente:

Podéis descargar el ejemplo realizado en el siguiente enlace:

NOTA: Es importante
recordar que con el Update 3 no hemos recibido un nuevo SDK. Tendremos
emulador de 1080p proximamente pero por ahora probaremos usando los
emuladores actuales, en concreto, el emulador 720p. Nokia pondrá en su
servicio Remote Device Access dispositivos 1080p a disposición de los desarrolladores.

Otros detalles

Tenemos otro listado de puntos importantes en los cuales centrar
nuestra atención con el objetivo de preparar la Aplicación a cualquier
resolución:

  • SplashScreen: Para poder utilizar una SplashScreen
    en dispositivos 1020p debemos utilizar una imagen llamada
    SplashScreenImage.Screen-720p.jpg. Para que se visualice correctamente
    la imagen debe ser de 720x1280px. La imagen se escalara en dispositivos
    1080p para ocupar la pantalla completa. Si queremos evitar este escalado
    debemos utilizar una imagen de 1080x920px. En este caso, en 1080p no se
    realizaría ningun escalado pero si se reduciría en dispositivos 720p.
  • Uso de imágenes a mayor resolución. Es recomendable
    utilizar recursos preparados para 1080p y dejar al sistema escalar la
    imagen a resoluciones menores como 720p en caso necesario.
  • Mayor uso de memoria. Con una pantalla mayor y
    mejor resolución como hemos visto se tiende a utilizar recursos de mayor
    calidad, lo que provoca también un mayor consumo de memoria. Recordar
    que podemos solicitar un mayor consumo de memoria utilizando la
    etiqueta ID_FUNCCAP_EXTEND_MEM en el archivo de manifiesto. Más información en el siguiente enlace.

Más Información

[Evento CartujaDotNet] Tips and Tricks de Resharper + Conociendo WebStorm

Javier Suárez Ruiz Deja un comentario

El evento

En esta ocasión tendremos un evento doble. Contaremos con dos interesantes charlas.

Como
desarrolladores debemos esforzarnos no solo por escribir código que
resuelva la problemática planteada, sino escribir código de calidad y
añadir test  al mismo entre otras tareas. ¿Y si contásemos con ayuda?.
En la primera de las charlas se hablará de Resharper,
herramienta que entre otras características resalta los errores de toda
la solución al vuelo, nos facilita técnicas avanzadas de
refactorización, proporciona herramientas de pruebas unitarias,
funciones de búsqueda y navegación, formateado o limpieza de código para
C#, VB.NET, ASP.NET, XML y XAML. Si no conoces la herramienta no te
arrepentirás de acercarte al evento, y si la conoces, seguro que te
sorprenderás de conocer ciertos trucos y características de la herramienta que probablemente no conocías.

En la segunda charla hablaremos de WebStorm,
IDE para JavaScript que facilita el desarrollo. Para cada objeto
muestra sus posibles métodos y propiedades. También tiene un editor HTML
que muestra el CSS asociado a cada etiqueta de la página que estamos
editando.

Fecha

El evento tendrá lugar el próximo Jueves, 21 de Noviembre de 18:30h a 21:00h. Cada charla tendrá una duración de 1 hora con descanso intermedio.

Lugar

Tendrá lugar en el Cloud Pointing de Sevilla situado en el Parque Empresarial Nuevo Torneo. Tenéis la información exacta del lugar a continuación:

c Biología, 12, Edificio Vilamar 2, 3ª Planta
Parque Empresarial Nuevo Torneo
41015 Sevilla

Ponente

Contaremos con un ponente de lujo, Hadi Hariri. Hadi es consultor y desarrollador, MVP de
C# durante los últimos años. Sus mayores interes recaen en la
arquitectura de software y el desarrollo web. Autor de libros y
colaborador frecuente en múltiples publicaciones técnicas, Hadi lleva
dando charlas técnicas a nivel internacional durante más de una década.
También lleva adelante la comunidad Málaga. NET User Group.

¿Te lo vas a perder?

Más información

[Windows Phone] ASP.net SignalR, mundo de posibilidades!

Javier Suárez Ruiz Deja un comentario

Introducción

La evolución en el mundo de las Aplicaciones es constante y rápido y
los usuarios cada vez requieren funcionalidades más exigentes. Muchas de
las Applicaciones destacadas en la tienda hacen un correcto uso de
respuesta inmediata, famosos chats, famosos juegos donde los usuarios
dibujan en tiempo real, finanzas, etc. ¿Como realizar este tipo de
Aplicaciones?. Si estas interesado sigue leyendo porque en este artículo
aprenderemos como crear Aplicaciones en tiempo real para Windows Phone
utilizando SignalR.

¿SignalR?

SignalR es una biblioteca Open Source (disponible en GitHub) perteneciente a la familia ASP.NET destinada a la creación de aplicaciones que respondan en tiempo real.
Si alguna vez habéis trabajado con conexiones persistentes conceptos
como “Long Polling” o “Web Sockets” os serán familiares. Estos conceptos
se utilizan en conexiones persistentes que permiten una interacción
continua por parte de clientes con el servidor. No entraremos a analizar
los problemas concecuentes en los conceptos anteriores ya que no es el
objetivo del artículo, lo que si vamos a destacar es que SignalR nos
añade una capa de abstracción que negocia automáticamente los
transportes a autilizar e irá haciendo “fallback” hasta encontrar una
capa que se pueda usar. Automáticamente verificará si se soporta “Web
Sockets”, en caso contrario utilizará “Server Sent Events”, y asi hasta
llegar al “Long Polling” como última alternativa.

NOTA: En este artículo utilizaremos la versión 2.0
para crear nuestras Aplicaciones. Si queréis ver que cambios hay entre
SignalR 1.x y la versión 2.0 podéis echarle un vistazo al siguiente enlace.

Manos a la obra!

Vamos a comenzar creando una simple web que utilizará el cliente jQuery de SignalR donde los usuarios conectados entrarán a un chat donde poder comunicarse entre ellos.

Para ello:

  1. Crearemos un proyecto web.
  2. Añadiremos las librerías de SignalR haciendo uso de NuGet.
  3. Crearemos una clase OWIN para ayudarnos a configurar el arranque de la Aplicación.
  4. Usaremos las librería jQuery de SignalR en la web para enviar mensajes y mostrar los mensajes recibidos desde el Hub.

Comenzamos por el primer paso, vamos a crear un proyecto Visual Studio utilizando la plantilla “ASP.NET Empty Web Application”:

Procedemos a instalar las librerías de SignalR. Para ello utilizaremos NuGet y tenemos dos opciones:

  • Opción A: Hacemos clic drecho sobre las referencias del proyecto,
    elegimos gestionar paquetes NuGet, buscamos SignalR y elegimos el
    paquete deseado pulsando instalar:

  • Opción B: Abrimos la consola de NuGet, Package Manager Console (Tools | Library Package Manager | Package Manager Console) y ejecutamos el siguiente comando:

install-package Microsoft.AspNet.SignalR

Tras la instalación podemos comprobar que contamos con nuevas
referencias en el proyecto además de nuevos scripts dentro de la carpeta
Scripts.

Añadimos una nueva clase a nuestro proyecto, la llamaremos ChatHub:

public class ChatHub : Hub
{
     public void EnviarMensaje(string mensaje)
     {
          Clients.All.Enviar(mensaje);
     }
}

Analicemos que hemos incluido en esas cortas líneas. De entrada, la clase deriva de la clase Microsoft.AspNet.SignalR.Hub. La clase Hub nos aporta un RPC de alto nivel sobre una conexión persistente. Microsoft.AspNet.SignalR.Hub.Clients
es un objetivo de tipo dynamic que utilizaremos para relacionar la
parte del cliente con la del servidor. La clase basicamente permite a la
parte cliente, por ejemplo desde jQuery, acceder a sus métodos.

Por lo tanto:

  • Declaramos métodos públicos en el hub para que desde la parte cliente se pueda acceder a ellos.
  • Usamos un objetivo dynamic llamado Clients para acceder a los clientes conectados al Hub.
  • Llamamos a una función en el cliente para actualizar la información (en nuestro ejemplo esa función es Enviar).

Continuamos, añadimos otra clase llamada Startup:

public class Startup
{
     public void Configuration(IAppBuilder app)
     {
          // Any connection or hub wire up and configuration should go here
          app.MapSignalR();
     }
}
Añadimos la página HTML (Add | HTML Page). En el código
añadido añadiremos el código necesario para crear el chat. De entrada
en el Header dela página incluiremos los scripts necesarios:
<script src="Scripts/jquery-1.6.4.min.js"></script>
<script src="/Scripts/jquery.signalR-2.0.0.min.js"></script>
<script src="/signalr/hubs"></script>
Dentro del Body añadimos:
<h1>SignalR Chat </h1>
<p>
<label for="Mensaje">Mensaje:</label>
<input type="text" id="Mensaje" />
</p>
<p>
<input type="button" id="Enviar" value="Enviar Mensaje" />
</p>
<ul id="Mensajes">
Simple. Una caja de texto donde permitir al usuario escribir su mensaje,
un botón para enviarlo y un listado donde ir mostrando todos los
mensajes. Por último, añadimos el siguiente script:
<script type="text/javascript">
$(function () {
var chat = $.connection.chatHub;
chat.client.enviar = function (mensaje) {
$('#Mensajes').append('<li>' + mensaje + '</li>');
};
$.connection.hub.start().done(function () {
$("#Enviar").click(function () {
chat.server.enviarMensaje($('#Mensaje').val());
$('#Mensaje').val("");
});
});
});
</script>
Analicemos detenidamente el código añadido en el script. El objetivo del
mismo es comunicarse con el Hub creado. Creamos un proxy del hub
utilizando:
$.connection.yourHubClass
E inicializamos el hub usando:
$.connection.hub.start()
Listo!. Pulsamos F5 y ejecutamos el proyecto en modo debug en el
navegador. Copiamos la URL y abrimos más instancias del navegador u
otros navegadores. Para probar el resultado bastará con enviar mensajes
desde cada navegador y ver como el resultado aparece en cada uno de
ellos. Impresionante, ¿cierto?

La Aplicación Windows Phone

Ya hemos visto la potencia de SignalR y posiblemente a estas alturas
muchas ideas estarán rondando vuestra cabeza. Sería fantástico poder
utilizar la tecnología en Aplicaciones móviles…

Se puede!. Hay librerías para trabajar con SignalR para:

  • jQuery (ya la hemos probado)
  • .NET 4.0/4.5
  • Silverlight 5
  • Windows Store Apps
  • Windows Phone
  • Portable Class Library
  • MonoTouch
  • MonoDroid

Además el equipo de SignalR se encuentra trabajando para que en un futuro se tenga también librerías para:

  • IOS (nativa)
  • Java
  • C++
  • …

Vamos a crear una aplicación Windows Phone donde utilizaremos las
librerías SignalR para Windows Phone y analizar todas las posibilidades:

En este ejemplo para simplificar al máximo el proceso y lograr
concentrar toda la atención en SignalR vamos a seleccionar un proyecto
de tipo Windows Phone Application.

Comenzamos añadiendo las librerías SignalR cliente para Windows
Phone. Al igual que hicimos previamente con la parte web, utilizaremos
NuGet para instalar las librerías:

Tras instalar las librerías vamos a comenzar a crear nuestra Aplicación Chat. Comenzamos por la interfaz:

<StackPanel Orientation="Vertical" VerticalAlignment="Bottom">
     <ScrollViewer Height="450">
          <TextBlock Name="chatDialog" Width="320" Padding="5"
          Foreground="{StaticResource PhoneAccentBrsh}" FontSize="36"/>
     </ScrollViewer>
     <StackPanel Orientation="Horizontal">
          <TextBox Name="chatTextbox" MaxLength="20" Width="350" HorizontalAlignment="Center"/>
          <Button Content="Enviar"/>
     </StackPanel>
</StackPanel>
Añadimos un texto (control TextBlock) donde iremos añadiendo los
mensajes enviados y recibidos del chat además de por supuesto una caja
de texto (control TextBox) donde escribir los mensajes y un botón para
enviarlos.
IHubProxy _chat;
HubConnection _hubConnection;
En el evento OnNavigatedTo, evento que se ejecutará siempre que una
página pasa a ser la página activa (se entra en la página) iniciamos el HubConnection con la ruta hacia nuestro servidor.  Una vez creado el Proxy Hub, usamos la síntaxis HubProxy.On<T>
para registrar un evento del lado del cliente (que el servidor podrá
llamar). En nuestro caso el evento será Message que añadirá a un
TextBlock dela interfaz el mensaje recibido:
protected async override void OnNavigatedTo(NavigationEventArgs e)
{
     base.OnNavigatedTo(e);
 
     // Conectamos con el servicio:
     _hubConnection = new HubConnection("http://localhost:12345/");
 
     // Creamos un proxy con el servicio chat:
     _chat = _hubConnection.CreateHubProxy("ChatHub");
 
     // Cuando recibamos un mensaje, los mostraremos:
     _chat.On<string>("Message", message => Deployment.Current.Dispatcher.BeginInvoke(() =>
     {
          chatDialog.Text += "n" + message;
     }));
 
     // Inicio de la conexión:
     await _hubConnection.Start();
}
El clic de botón utilizará el Hub Proxy creado anteriormente para
incovar métodos del servidor. El primer parámetro de la función Invoke
es el nombre del método (en el servido)r y a continuación tenemos la
lista de los parámetros aceptados por el servidor:

Todo listo!. Pulsamos F5 y ejecutamos la aplicación en el emulador.
Tras ejecutarse la aplicación y esperar unos leves segundos (tiempo que
tardará el programa en llamar al servicio) y…

Error!. No podemos conectar con nuestro servicio.

Oops!, ¿que ocurre?

Ya sabemos porque. El emulador de Windows Phone 8 es una máquina
virtual en Hyper-V y la red de la misma es distinta a la de la máquina
de desarrollo.

Para resolver el problema causado por la dirección localhost debemos
reconfigurar el servicio web e IIS Express para aceptar conexiones de
otros dispositivos. Estos dispositivos conectarán con el servicio
utilizando la IP de la máquina de desarrollo.

Ya hemos mencionado que vamos a utilizar la IP de la máquina de
desarrollo. Abre el símbolo del sistema en la máquina de desarrollo y
escribe:

ipconfig

Esta línea de comando nos facilitará la dirección IP de la máquina.
Vamos a modificar el archivo de configuración de IIS Express que lo
podéis encontrar en la ruta:

%USERPROFILE%<your user name>DocumentsIISExpressconfig

El nombre del fichero es applicationhost.config. Lo
abrimos y buscamos la sección <sites>. Buscamos el sitio que tenga
el nombre de nuestro servicio y nos fijamos en el apartado
<bindings>.

Tenemos un binding ya establecido a localhost que no podemos
eliminar. Por lo tanto, añadimos un segundo binding igual al ya creado
reemplazando localhost por la IP de la máquina de desarrollo. Añadimos
también en el Firewall de Windows una excepción para IIS Express en el
puerto que estámos utilizando.

Guardamos los cambios. Cerramos Visual Studio y lo volvemos a
ejecutar con privilegios de Administrador (es necesario para registrar
nuestra aplicación con un servicio no alojado en localhost). Ejecutamos
la aplicación.

Todo listo. Pulsa F5 para ejecutar la aplicación en el emulador. El emulador arrancará y si probramos el chat… mágico!

El resultado

Llegado a este punto lo tenemos todo listo. Podéis ver el resultado a continuación:

Podéis descargar el ejemplo desde el siguiente enlace:

NOTA: En la descarga tambien tenéis disponible la Aplicación Windows 8 del chat.

Conclusiones

Hemos aprendido las posibilidades que nos brinda SignalR, framework destinado a la creación de Aplicaciones en tiempo real.
Hemos sido capaces de configurar SignalR en un Host OWIN  creando un
cliente sencillo HTML + JavaScript. A continuación hemos creado una
Aplicación Windows Phone 8 utilizando C # + XAML que puede comunicarse
con nuestro servidor SignalR.

Más información

Unificación de las Stores de Windows y Windows Phone

Javier Suárez Ruiz Deja un comentario

Introducción

Hasta el momento actual, como
desarrolladores si nos interesaba crear Aplicaciones Windows Phone y
Windows Store necesitábamos contar con dos cuentas de desarrollador, uno
para cada plataforma. El coste de cada cuenta de desarrollador es:

  • Usuario individual, 19$ para la Windows Phone Store y 49$ para la Windows Store.
  • Empresa, 19$ para la Windows Phone Store y 99$ para la Windows Store.

Además, contábamos con dos portales para cada Store. Hasta ahora…

¿Qué cambia exactamente?

Las Stores se unifican!.
A partir de ahora como desarrolladores tendremos que realizar un
único pago pudiendo publicar para ambas plataformas. El coste se queda
de la siguiente forma:

  • Usuario individual: 19$ por las dos.
  • Empresa: 99$ por las dos.

Nos ahorramos dinero como desarrollador además de tener mayor facilidad al publicar Aplicaciones.

¿Y si…?

  • ¿Y si ya tenía cuenta de desarrollador de la Windows Store?

Ya tienes también cuenta de la Windows Phone Store.

  • ¿Y si ya tenía cuenta de desarrollador de la Windows Phone Store?

Ya tienes cuenta de la Windows Store.

  • ¿Y si tenía cuenta de ambas?

Pues Microsoft quiere premiar tu compromiso y te regalará un Token para poder renovar gratuitamente cuando caduque.

Más Información