The Lost Reference

Failed to load SKU «WP»

Ya hace algunas semanas que Microsoft lanzó públicamente las herramientas de desarrollo para Windows 10 pero aún están en preview y, como toda preview, podemos tener bastantes problemas a la hora de ejecutar acciones comunes. Entre ellas, uno de los problemas más comunes es que al intentar desplegar nuestra aplicación en un emulador de Windows 10 Mobile, nos aparezca un popup de error en Visual Studio con el mensaje «Failed to load SKU «WP»: Unable to load one or more of the requested types. Retrieve the LoaderExceptions property for more information» como muestro en la imagen más abajo.

¿A qué se debe este error?

Parece que hay algún conflicto con el emulador de Android que se instala con «Apache Cordova Tools» y que responde a la denominación «Microsoft Visual Studio Emulator for Android». Este conflicto se debe a una incompatibilidad entre las versiones de XDE que se instala con «Windows 10 Technical Preview Tools«.

Solución

La solución es ir al panel de control à Programas y características y desinstalar «Microsoft Visual Studio Emulator for Android». Sé que esto no es muy bonito que digamos, pero de momento es lo poco que podemos hacer.

Unable to start the the emulator – ¿Problemas con Hyper-V?

Otro error que incluso a mí me ha sucedido después de resolver el problema es que Visual Studio me indique que Hyper-V está desactivado.

Solución

Comprobar que tenemos se nos ha desactivado en la BIOS Nuevamente hay que ir al panel de control à Programas y características y aquí ir a «Activar/Desactivar características de Windows». Es posible que aparezca activado Hyper-V pero, aún así, parece que el sistema no esté bien configurado, así que desactivamos si lo está (reiniciar) y volvemos a activar (reiniciar de nuevo).

Tras activar y reiniciar, iniciad Visual Studio en modo administrador para que pueda generar la máquina virtual correspondiente al emulador y ya podremos desplegar nuestra aplicación en el emulador de Windows Phone. 

Espero que estas soluciones os ayuden a poder crear aplicaciones para Windows 10 y que disfrutéis de la experiencia.

Enjoy coding! J

Esta tarde tendremos un nuevo evento en TenerifeDev y, sorpresa, el ponente será un asistente a otras sesiones que hemos realizado que quiere contarnos su caso de éxito y nosotros queremos que lo cuente porque nos parece muy muy interesante lo que tiene que mostrarnos.

No os perdáis hoy a las 17.00 en el salón de grados de la ETSII a Andreas Wendl.

Más información y confirmación de asistencia en el Meetup de TenerifeDev

Azure Mobile Engagement

Lugar: Salón de grados de la ETSII (ULL)

Hora: 17.00 – 19.00

Ponentes: Andreas Wendl

Descripción: Después de haber publicado varias aplicaciones en la Tienda de Microsoft con más o menos éxito, en esta sesión Andreas quiere compartir sus experiencias en el desarrollo de apps para Windows Phone, desde la adaptación del uso de GPS a controles de Telerik, hasta el uso de Azure Mobile Engagement en el último proyecto, pasando por captura de pantalla en vídeo en tiempo real. No se quedarán fuera las herramientas de monitorización utilizadas ni el aspecto de monetización de las Apps.

Todos sabemos que Windows 10 está en Preview y que esto conlleva que las releases que se han publicado contengan N bugs, algunos más molestos o importantes que otros. El problema se agrava si se activa la opción de «Fast Updates» que permitirá que se nuestro sistema reciba actualizaciones mucho más a menudo pero también menos probadas.

Uno de los errores detectados y de fácil solución es que las Apps dejen de funcionar, como por ejemplo Spartan, la App de Fotos, la App de la Store,…

Para solucionarlo, tan sólo tienes que abrir Windows PowerShell
con permisos de Administrador
y ejecutar la siguiente instrucción. (visto en Microsoft Answers)

Get-AppXPackage -AllUsers | Foreach {Add-AppxPackage -DisableDevelopmentMode -Register «$($_.InstallLocation)AppXManifest.xml»}

Espero que os ayude

Enjoy coding! J

Escenario

Uno de los fuertes de SharePoint en ambientes de intranet son los perfiles de usuario que permiten no sólo mostrar información importante de un usuario, sino también obtener datos adicionales como por ejemplo el estado en Lync. Es por ello que cuando realizamos desarrollos para SharePoint, a menudo nos encontramos con que podemos o debemos añadir información del usuario conectado en alguna zona de la página.

Para exponer el caso, el escenario consiste en poner la foto del perfil del usuario al lado de su nombre en la ribbon.

Solución 1

Una de las soluciones que he encontrado es usar una URL directa a la imagen del usuario y que nos valdría para obtener la de cualquier otro usuario

http://SERVIDOR/_layouts/15/userphoto.aspx?size=M&accountname=ACCOUNTNAME

Esta URL nos permite, entre otras cosas obtener la imagen en función del tamaño (S, M, L)

Además, si no pasamos el parámetro “AccountName”, obtendremos la imagen por defecto.

Solución 2

Otra posible solución es realizar una llamada a la Api REST para obtener del usuario actual y asignar la URL a una imagen del DOM tal y como muestro en el siguiente código.

function setUserPicture() {

    var urlDefaultPicture = "/_layouts/15/userphoto.aspx?size=M";

    $.ajax({

        url: '/_api/SP.UserProfiles.PeopleManager/GetMyProperties/PictureUrl',

        headers: { "Accept": "application/json; odata=verbose" },

        dataType: 'json'

    }).done(function (data) {

        if (data.d.PictureUrl)

            $('img.user-picture').attr('src', data.d.PictureUrl);

        else

            $('img.user-picture').attr('src', urlDefaultPicture);

        console.log('done');

    }).fail(function (jqXHR, textStatus, errorThrown) {

        console.log('fail');

    });

}

Como se puede ver en el código, he hecho un mix con la primera solución, de forma que si la solicitud a la Api REST no nos devuelve el valor deseado, mostraremos la imagen por defecto; en otro caso, asignaremos la ruta de la foto del perfil del usuario a un elemento del DOM que en mi código identifico como un <img> que tiene una clase “user-picture”.

Hay otras posibles soluciones como por ejemplo hacer uso de SP.Web.get_currentUser() como se explica en una parte de este artículo de la MSDN y a partir de ahí elaborarnos un código mediante llamadas a la Api REST que nos devuelvan la imagen, pero el camino me parece un poco más largo además de que hay quer realizar la instancia del Contexto y el objeto SPWeb.

Hasta aquí este nuevo artículo que espero que os sea útil.

Enjoy coding! 🙂

En WPSUG volvemos a preparar un nuevo hangout para mostraros cosas interesantes a la hora de crear vuestras aplicationes para la plataforma Windows. En esta ocasión, contaremos con la presencia de Vanessa Estorach de e-growing, experta en ASO y “Mobile Sensei” (Esto suena muy molón) para hablaros sobre “App Store Optimization” y que consigáis que vuestras aplicaciones alcancen un nuevo nivel. Además, como siempre andaremos por allí Rafa Serna, Javier Suarez, Josué Yeray y yo mismamente.

Este hangout va a estar centrado en el trabajo que viene cuando hemos terminado de desarrollar nuestra app. Promoción en las store, optimización de los resultados… como hacerla destacar y obtener de ella el mayor beneficio posible.

Datos del evento

EL evento tendrá lugar el Jueves 26 de Marzo, a las 19:00 hora peninsular de España (GMT+1):

• Horario:

  • 13:00 en Colombia

  • 12:00 en México Centro

  • 13:30 en Venezuela

  • 15:00 en Chile continental

  • 18:00 en Canarias

• URL:

  • https://www.youtube.com/watch?v=dspt9kyVLO8

• Lugar:

  • Online – Hangout

Además, para los que llevéis vuestra agenda al día, el gran Yeray nos ha creado una cita de calendario que podéis descargar aquí

Enjoy y recordad que podéis acceder a la página de la comunidad para consultar/proponer/compartir lo que queráis!

Microsoft va a realizar un tour por diversas ciudades para contarnos a todos las novedades y cómo sacar buen provecho de Microsoft Azure y las herramientas y tecnologías de desarrollo web actuales. Para nuestra fortuna en Tenerife, han decidido hacernos una visita y, junto a TenerifeDev estará uno de los miembros del equipo de DX (Alejandro Campos Magencio) en una jornada de manañana y tarde en la que podremos compartir conocimientos e impresiones.

La jornada será GRATUITA y habrá comida y regalos para todos y por ello será importante que os registréis para que no falte nada 🙂

Registro

Registro para sesiones Cloud

Registro para sesiones Web

Más información aquí

¡¡No lo dejes pasar y regístrate ya!!

Información

Lugar: Aula magna de la facultad de Física

Día: 25 de marzo

Hora de inicio: 09:00

Hora de fin: 19:30

Programa:

Los pasados 27 y 28 de febrero, fueron los días elegidos para celebrar en la Universidad de Alcalá de Henares la “DotNetConference Spain” el mayor evento sobre .NET en España, organizado por el equipo de DX de Microsoft Ibérica. El evento contó con varios tracks en paralelo y grandes ponentes en cada uno de ellos.

Yo tuve la suerte de poder compartir el evento como speaker en una sesión sobre diseño de aplicaciones móviles que llamé “Tips&Tricks en diseño de aplicaciones móviles” y en el que os conté, no sin algún contratiempo, cómo realizar algunos trucos para dar otro aire a vuestras aplicaciones.

Aquí os comparto la presentación

Enjoy coding! 🙂

Me acaba de llegar un correo indicándome que a partir de marzo desaparecerán las Rooms (salas) en las que podíamos agrupar a personas para compartir notas, calendario, fotos y enviar mensajes entre todos. Parece una mala noticia pero, si nos atenemos a la información indicada por el equipo de Windows Phone, se están trabajando en nuevas características en Windows 10 y seguramente las Rooms serán sustituidas por algún otro elemento con mayores ventajas para todos nosotros. Por mi parte sí hacía buen uso de las Rooms para compartir información con mi familia y con unos pocos amigos afortunados de tener un Windows Phone.

¿Qué os parece?

Enjoy Windows Phone! 🙂

Escenario

Desde hace tiempo me era imposible ejecutar los emuladores de Windows Phone ya que alguna actualización de Windows 10 me lo impedía, sin dar ningún error ni mensaje que me pudiera guiar. El problema es que se quedaban iniciando el sistema “Windows Phone OS is starting…” y así hasta el fin de los siglos.

Como no me satisface quedarme esperando que se arregle sólo, supuse que alguien se habría enfrentado a esta situación y, buscando encontré la solución en un foro que no he vuelto a localizar, así que vamos con la solución

Solución

Lo primero que vamos a hacer es abrir el Administrador de Hyper-V y, tras seleccionar un emulador de Windows Phone, iremos a “Virtual Switch Manager”

Una vez abierta la ventana de Virtual Switch Manager, buscamos el switch de Windwos Phone y lo eliminamos.

Ahora debemos ejecutar Visual Studio con permisos de administrador y ejecutar el emulador que, al menos en la primera vez tardará un poco más de lo habitual en cargar el sistema pero funcionará 🙂

Enjoy coding! 🙂

En este artículo quiero compartir un nuevo tip sencillo para Apps desarrolladas con Apache Cordova o PhoneGap y no es otro que añadir un aviso de que se están cargando datos o un mensaje de loading para que el usuario esté al tanto de que se está realizando dicha operación mientras debe esperar. Esto además, nos puede servir para otras acciones como actualizaciones por cálculos, etc.

¿Por qué es tan importante un aviso de carga de datos?

Muchos desarrolladores obvian la inclusión de mensajes de aviso de carga de datos en sus Apps y, peor aún tampoco lo hacen en aplicaciones web o en las clásicas de escritorio. Esto es un enorme error de cara a la experiencia de usuario ya que provoca múltiples problemas derivados de los que enumero algunos a continuación:

• El usuario cree que la aplicación se ha colgado y la cierra con la consiguiente mala reputación que nos ganaremos.
• El usuario cree que la acción que ha realizado no se está ejecutando y vuelve a intentar realizarla. Si es una consulta no será tan drástica salvo que se volverá a generar el tráfico de red que corresponda pero, ¿si es una actualización o una creación de un registro? Puede que no hayamos controlado que el usuario le pueda dar varias veces y que nos genere datos erróneos, errores, … con la consiguiente insatisfacción por el usuario que se traduce en mala reputación.
• Las Apps DEBEN ser fluidas y de respuesta inmediata. Recordemos que estamos desarrollando Apps y que el usuario espera que las acciones se ejecuten instantáneamente, es decir, no admite tener que esperar como hacía antiguamente en un PC 386 donde tener que esperar unos segundos era la tónica general y por tanto se aceptaba. Además, debemos recordar que puede que sea un usuario de un dispositivo de gama alta donde tiene la idea de que todo debe ser “ipso facto”.
• Por simple buena experiencia de usuario UX. El usuario debe saber en todo momento qué ocurre con la aplicación en su dispositivo y esto no es negociable aunque el mensaje sólo aparezca, si todo va bien, unos milisegundos.
• Algunos casos más que no he considerado necesarios nombrar.

¿Cómo lo implementamos?

Hay mil y una formas de implementar un aviso de carga, con CSS, JavaScript, GiF, … pero os voy a dejar unas directrices que sirven en cualquier caso y que yo sigo por buenas prácticas basadas en mi experiencia:

• Debe ser claro y conciso, nada de mensajes como: “Estamos cargando los datos de la tabla de super héroes, calculando los índices, parseando el JSON y redimensionando las imágenes. Espere unos instantes, disculpe las molestias”. Un usuario no necesita saber tanto y, de hecho, probablemente nadie se lea tanto detalle. El usuario generalmente desea saber únicamente que se están cargando datos y, en caso de necesitar algo más de información podemos añadir algunas palabras pero sin pasarnos como “Cargando datos de superhéroes”.
• Se puede dar el caso en el que la carga requiera de varios procesos, en ese caso, intercambiaremos unos mensajes por otros en función del estado del proceso como por ejemplo, “Cargando datos”, “Calculándo índices”, “Redimensionando imágenes”, de forma que el usuario sólo verá en pantalla el mensaje concreto y, si el proceso se detuviera un instante en alguno de los subprocesos, siempre sabría qué es lo que está ralentizando la carga.
• Se DEBEN bloquear los elementos que generen la misma acción u otras que entren en conflicto. Lo más sencillo es bloquear la pantalla por completo con una capa que impida al usuario ejecutar cualquier acción. Puede darse el caso que por ejemplo, mientras se esté buscando queramos permitir al usuario ejecutar otras acciones en pantalla y, en este caso, sólo deberíamos mantener activos aquellos elementos que queramos que puedan ser accionados en ese caso. Si es una simple carga de datos incluso puede que no necesitemos bloquear ninguna acción, pero estudiad entonces muy bien esos casos “for if the flies”.
• Se debe ver claramente salvo que no queramos bloquear la pantalla como en el caso anterior. Por ejemplo, en cargas en background podemos permitirnos el lujo de usar algo muy sutil como los puntitos que aparecen y desaparecen en Windows Phone.

Con estas directrices, que podéis saltaros, ignorar, completar, reducir,… ya estamos listos para pensar cómo queremos que sea nuestro aviso de carga. A mi en concreto me gusta ser un poco original y no limitarme a las típicas rueditas girando acompañadas con el mensaje “Cargando…” así que os compartiré mi idea para mi aplicación de Super Héroes realizada con Cordova.

Como se puede observar he puesto un mensaje claro de carga que habla un poco de la aplicación usando para ello una posible situación de ciencia ficción, además de añadir la silueta de un superhéroe volando por la pantalla. Está claro que se podría hacer más atractivo pero esto no es más que un ejemplo. Ahora veamos cómo lo he realizado.

Para hacer la animación simplemente he usado las características que nos proporciona CSS3 y he puesto un desplazamiento de derecha a izquierda ascendente como podéis ver en el siguiente código y que os explico ahora para ahorraros verlo.

1. Añado un bloque oculto que contiene el texto y una imagen que será la que se mueva por la pantalla
2. Les establezco posición absoluta y que el contenedor ocupe toda la pantalla con fondo negro translúcido
3. Añado la animación mediante CSS de tal forma que vaya de derecha a izquierda en forma ascendente y que se repita infinitamente
4. En el código JavaScript, muestro el bloque con el mensaje de carga de datos cuando se esté realizando la carga y lo oculto cuando se haya acabado.
5. Las funciones JavaScript que he creado nos permiten indicar si se ha de mostrar o no, además del elemento que mostramos/ocultamos.

HTML

<div class="loading" style="display:none;">

    <div class="loading-text">Un momento, estamos salvando la galaxia</div>

    <img class="loading-img" src="images/layout/superhero-flying.png" />

</div>

CSS

body {

    margin: 0;

    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

}

.loading {

    position: absolute;

    top: 0;

    left: 0;

    height: 100%;

    width: 100%;

    background: rgba(0, 0, 0, 0.75);

    overflow: hidden;

}

    .loading .loading-text {

        position: relative;

        top: 50%;

        width: 100%;

        text-align: center;

        color: #ffde00;

        font-size: 17px;

    }

    .loading .loading-img {

        position: absolute;

        -moz-animation: loading 3s infinite;

        -o-animation: loading 3s infinite;

        -webkit-animation: loading 3s infinite;

        animation: loading 3s infinite;

    }

@-moz-keyframes loading {

    from {

        top: 60%;

        left: -60px;

    }

    to {

        top: 40%;

        left: 110%;

    }

}

@-webkit-keyframes loading {

    from {

        top: 60%;

        left: -60px;

    }

    to {

        top: 40%;

        left: 110%;

    }

}

@keyframes loading {

    from {

        top: 60%;

        left: -60px;

    }

    to {

        top: 40%;

        left: 110%;

    }

}

JavaScript

function onDeviceReady() {

    // Handle the Cordova pause and resume events

    document.addEventListener('pause', onPause.bind(this), false);

    document.addEventListener('resume', onResume.bind(this), false);

    // TODO: Cordova has been loaded. Perform any initialization that requires Cordova here.

    //checkConnection();

    loading(true);

    amscontext = new WindowsAzure.MobileServiceClient(

            "URL_SERVICIO_MÓVIL",

            "APPLICATION_KEY");

    getSuperHeros();

};

function getSuperHeros() {

    var superHeroTable = amscontext.getTable('superhero');

    superHeroTable.read().then(function (items) {

        displaySuperHeros(items);

        loading(false);

    });

}

...

...

...

function loading(visible, loadingSelector) {

    var selector = '.loading';

    if (loadingSelector != undefined)

        selector = loadingSelector;

    if (selector.indexOf('#') == 0) {

        var loadingElement = document.getElementById(selector.substring(1));

        DisplayElement(loadingElement, visible);

    }

    else if (selector.indexOf('.') == 0) {

        var loadingElements = document.getElementsByClassName(selector.substring(1));

        for (var i = 0; i < loadingElements.length; i++) {

            var loadingElement = loadingElements[i];

            DisplayElement(loadingElement, visible);

        }

    }

}

function DisplayElement(element, visible) {

    if (visible)

        element.style.display = 'block';

    else

        element.style.display = 'none';

}

Have fun & enjoy coding!!