Monthly Archives: febrero 2016

#AZURE – #AzureIoT Hub Sample using Windows Universal Apps #Windows10

Hi !

So, after a couple of week learning on how to use Garmin ConnectIQ SDK, now I got my Garmin device ready to interact with the cloud. In order to prepare my Azure IoT environment, I’ll write a couple of posts on the basic steps to perform this. This post is also based on an article in the Azure portal which have plenty of additional details on Azure IoT Hub also.

The final output of the post will be a couple of Windows Universal Apps sending and receiving information as you can see in the next video.

2016 02 28 Azure Iot Wua Samples

Create the Azure IoT Hub

Let’s start from the beginning. First of all, we need an Azure Account (or a trial one). From the Azure Portal, we need to create an AzureIot Hub.

image

I’ll name this one IoTGarminLabs

Important: The default value for the price and scale is S1, if you are going to use this for a test, change it to F1 Free.

image

After a couple of minutes, the IoT Hub will be created. If there is any problem with the deploy, the alert section will display a nice message with all the details about it.

image

Once you get the correct configurations, the IoT hub  will be created. The important information to be used later is the Host Name: <YourIoTHubName>.azure-devices.net and also the credentials and connection string. To access this information

  • Click on the key on the toolbar
  • Click on the iothubowner policy
  • Copy the connection string primary key value

image

The

Create sample Visual Studio Console App projects

So now is time to go to Visual Studio and create a Console App to connect and test the HUB. I’ll create the main console app named “ConsoleAzureIoT01

image

Now we need to add a NuGet package named Microsoft.Azure.Devices

image

So, as the tutorial explains the first step is to create a device identity for our device in the IoT Hub. With the following lines we can perform this device registration

Note: Replace the IoT Connection String (line 11) and choose the Device Name (line 12) as your own choice.

image

We run the program and we have the device registered. And we also have the DEvice Key, we need to store this key.

image

Now we can see one device registered in the Azure portal in our IoT Hub “IoTGarminLabs

image

Ok, next step in the Azure IoT Hub tutorial is to create another Console App to read device-to-cloud messages from the IoT Hub. I created a Console app named “ConsoleAzureIoT02”, and later I added the “WindowsAzure.ServiceBus” NuGet package.

image

A couple of lines of code will allows us to display the received messages.

Note: Again, is important to type the correct connection string.

image

Finally we need to create a 3rd Console app to publish the messages. My data for this app is

Name: ConsoleAzuireIot03

NuGet packages: Microsoft Azure Devices Client

image

With the following code, where is important to use the Information generated with the ConsoleAzureIot01 app.

image

If we setup the app to run both the 02 and 03 app we will the send and receive flow of messages every one second. And if we go back to the Azure portal, we will see the messages we send during the execution time.

image

Sample using Visual Studio Windows Universal App projects

So, as a sample this works great however I want to make a test with some other technologies so I added 2 new Windows Universal App projects to the solution.

The first app to receive the messages has the following configuration

Name: WuaAzureIotSendMessage

Objective: Send messages with a button

image

The fist time I run the app I get the following error

System.NotImplementedException occurred
HResult=-2147467263
IsTransient=false
Message=Amqp protocol is not supported
Source=Microsoft.Azure.Devices.Client
StackTrace:
at Microsoft.Azure.Devices.Client.DeviceClient.CreateFromConnectionString(String connectionString, TransportType transportType)

There seems to be a problem with WUA and AMQP (I still don’t have my Raspberry PI 2 here in Toronto to test this with Windows IoT Core). So after a quick review I realize that I need to overwrite the default connection message in the Windows Universal App to sent messages, because AMQP was not supported. I changed the device creation line, and I explicit used the HTTP transport protocol for this type of apps. Line 22

image

I’ve also created another app to receive the messages with the following configuration

Name: WuaAzureIotReceiveMessage

Objective: Receive messages and display Toast notification into the Windows 10 Action Center

image

For this app I realize that I can’t use the ,WindowsAzure.ServiceBus, package because is not supported in Universal Apps (glup!). So I used Azure SB Lite pack from the great Paolo Patierno to manage the receive event from Azure Service Bus.

And later when the app receives a message, a new Toast notification is displayed using the Notification Extension Win 10 NuGet package

And now is the moment to go back to the beginning and review the video with the 3 apps sending and receiving messages.

Greetings @ Toronto

-El Bruno

References


Filed under: Azure, EnglishPost, IoT Tagged: Azure, English Post, IoT

#Humor – How to write device drivers with #Javascript

Hi !

You only need to know a little about software to understand this one …

CcCYUV0XIAUqSmJ

By the way, the book is really really good ;)

Greetings @ Toronto

-El Bruno

Source

 


Filed under: EnglishPost, Humor Tagged: English Post, Humor

#Garmin – Mostrar gráficos e información de varios sensores al mismo tiempo

Hola !

El post de hoy es uno de los rápidos. Durante estos últimos días, mi principal objetivo era completar todo lo necesario para poder comenzar a vivir en Toronto, y aprovechando huecos de ocio, me puse a conocer el Garmin ConnectIQ SDK.

Como se puede ver en el siguiente video, hoy he llegado a un punto donde he creado una app

  • Que puede leer información de diferentes sensores: posición y ritmo cardíaco
  • En base a una muestra SDK la app puede dibujar un gráfico con los datos del sensor de latidos de corazón
  • La app crea un diseño de forma dinámica con colores diferentes (y bastante feos) para cada línea de texto, cuando el dispositivo está utilizando datos de sensores

2016 02 25 Garmin display multiple sensors

Sobre la app, un par de detalles a tener en cuenta

  • La app debe configurarse para utilizar sensores y obtener información, en las propiedades de aplicación

image

  • La clase App inicializará los eventos para la captura de datos de los sensores y el posicionamiento global. En cada evento de captura de datos, se invocará la clase View para mostrar estos datos
  • La clase de vista tiene algún código para dinámicamente trabajar en el diseño para crear textos y gráficos para la View

image

  • El gráfico utilizado para los datos de frecuencia cardíaca es un archivo de Graph.mc de los ejemplos del SDK

Y eso es todo! la aplicación es lo suficientemente inteligente y sencilla como para mostrar información en tiempo real de sensores y posiciones de una manera muy sencilla!

GitHub Source Code: https://github.com/elbruno/Blog/tree/master/Garmin

Saludos @ Toronto

-El Bruno

References


Filed under: Code Sample, Garmin, SpanishPost Tagged: Code Sample, Garmin, SpanishPost

#Garmin – Display charts and several sensors information at once

Hi !

Today’s post is a quick one for Friday. My main goal in the past days was to complete all the necesarry stuff I’ll need to live in Toronto, and in the meantime I’ll continue to play around with the ConnectIQ Garmin SDK.

As you can see in the next video, I get to a point where

  • The app can read information from different sensors: position and heart rate
  • Based on a SDK sample the app can draw a chart for the HR data
  • The app creates a dinamyc layout with different (and ugly!) colors when the device is using sensors data or not

2016 02 25 Garmin display multiple sensors

So, the important stuff for this demo is

  • The app must be configured to use Sensors and Position information, in the app properties

image

  • The App class will initialize the sensors and positions. On each “get data” event, it will invoke the View class to display this data
  • The View class has some code to dinamically work in the layout to create texts and charts for the View

image

  • The chart used for the Heart Rate data is a Graph.mc file from the SDK samples

And that’s it ! the app is kind of smart enought to display real time information of positions and sensors in a very simple way!

GitHub Source Code: https://github.com/elbruno/Blog/tree/master/Garmin

Greetings @ Toronto

-El Bruno

References


Filed under: Code Sample, Garmin, SmartWatch Tagged: Code Sample, Garmin, SmartWatch

#VisualStudio – #Microsoft ha comprado #Xamarin

Hola !

El resumen rapido sería algo así como:

Microsoft buys Xamarin

Estas son excelentes noticias y la mejor forma de expresarlo es con un

Ahora tenemos que esperar hasta el Build para conocer los cambios en los modelos de licencias, en que equipo de producto será integrada la gente de Xamarin y mucho más!

Lo dicho, excelentes noticias !!!

Greetings @ Toronto

-El Bruno

Source

http://weblogs.asp.net/scottgu/welcoming-the-xamarin-team-to-microsoft


Filed under: Microsoft, Xamarin Tagged: Microsoft, Xamarin

#VisualStudio – #Microsoft buys #Xamarin

Hi !

So, long story short: Microsoft buys Xamarin, The better way to express this is

Now we have to wait until Build to see if there is going to be changes in the licensing model, where the Xamarin team will be relocated, etc.

So is time for great changes !!!

Greetings @ Toronto

-El Bruno

Source

http://weblogs.asp.net/scottgu/welcoming-the-xamarin-team-to-microsoft


Filed under: EnglishPost, Microsoft, Xamarin Tagged: English Post, Microsoft, Xamarin

#Garmin – Trabajando con recursos y culturas en una app #ConnectIQ

Hola !

Cuando creamos una aplicación para un dispositivo Garmin, trabajar con un recursos es un #MustHave. En el siguiente video se muestra un escenario sencillo en el que se cambia el lenguaje de una aplicación. En el mismo, la etiqueta principal de la aplicación cambiará cada vez cambie el lenguage del reloj.

2016 02 24 Garmin Resource Languages

About Resources and Cultures

Las aplicaciones de ConnectIQ tienen una estructura de recursos estándar donde podemos definir strings, almacenar imágenes y también definir layouts o menús para nuestras apps. Podemos encontrar todos estos elementos en la carpeta de la raíz principal de nuestro proyecto.

image

La carpeta contenido de raíz, para esto es “resources”. Para cada cultura diferente, podemos agregar un nuevo folder y añadir sólo los diferentes elementos que necesitamos para cada uno. En el ejemplo, el principal recurso tiene este contenido en el archivo “resourcesstringsstrings.xml”

<strings>
<string id=”AppName”>App04</string>
<string id=”prompt”>Hello Martina</string>
<string id=”menu_label_1″>Item 1</string>
<string id=”menu_label_2″>Item 2</string>
</strings>

El contenido mismo de la cultura española se encuentra en “resources-spastringsstrings.xml” e incluye este contenido

<strings>
<string id=”AppName”>App04</string>
    <string id=”prompt”>Hola Martina</string>
    <string id=”menu_label_1″>Item 1</string>
<string id=”menu_label_2″>Item 2</string>
</strings>

También hay otro elemento importante en la aplicación: Layouts (claramente explicadas en la guía de programadores). He creado un diseño personalizado que se almacena en un archivo llamado “resourceslayoutslayoutcustom.xml”, que incluye el siguiente contenido

<layout id=”CustomLayout”>
<label x=”center” y=”5″ text=”@Strings.prompt” color=”Gfx.COLOR_WHITE” justification=”Gfx.TEXT_JUSTIFY_CENTER” />
<bitmap id=”id_martina” x=”center” y=”30″ filename=”../drawables/martina.png” />
</layout>

Hay varios elementos que pueden utilizarse en un archivo de diseño, como textos, imágenes, formas, etc.. Nuevamente la guía de programadores explica toda la información necesaria para ello.

Resource Compiler

Por último tenemos el compilador de recursos. Cada vez construimos nuestra aplicación, el compilador de recursos crea un conjunto de clases y modulos que permiten trabajar con estos elementos. Si tenemos cualquier problema o mal archivo definido, en el registro de consola de ConnectIQ podremos ver un poco de ayuda al respecto.

image

Una vez que tenemos una estructura exitosa en nuestra aplicación, podemos acceder a estos elementos mediante código utilizando un módulo llamado Rez. Se trata de un módulo generado automáticamente una estructura similar a esta

module Rez
{
    module Drawables
    {
        var bitmap_id = 123;
    }
    module Strings
    {
       var hello_id = 456;
    }
    module Fonts
    {
       var font_id = 789;
    }
}

En nuestra muestra, con el fin de acceder y utilizar el diseño personalizado, la forma de hacer esto es

image

De la misma manera podemos acceder a secuencias, mapas de bits, fuentes, etc..

En el siguiente post más cosas y tal vez un ejemplo conectado a AZURE.

GitHub Source Code: https://github.com/elbruno/Blog/tree/master/Garmin

Greetings @ Toronto

-El Bruno

References


Filed under: EnglishPost

#Garmin – Working with resources and cultures in a #ConnectIQ app

Hi !

When we create an app for a Garmin device, working with a resources is a #MustHave. We need to take take of simple stuff like change the culture of an app, In the following video, the main label of the app will change every time I change the culture of the smartwatch.

2016 02 24 Garmin Resource Languages

About Resources and Cultures

The ConnectIQ apps have a standard resource structure where we can define strings, store images and also define UI layouts or menus for our apps. We can find all of this elements in the main root folder of our project.

image

The root content folder for this is “resources”. For each different culture, we can add our owns folders and add only the different elements we need for each culture. In example, the main resource has this content in the “resourcesstringsstrings.xml” file

<strings>
<string id=”AppName”>App04</string>
<string id=”prompt”>Hello Martina</string>
<string id=”menu_label_1″>Item 1</string>
<string id=”menu_label_2″>Item 2</string>
</strings>

The same content for the Spanish culture will be located in “resources-spastringsstrings.xml” and includes this content

<strings>
<string id=”AppName”>App04</string>
    <string id=”prompt”>Hola Martina</string>
    <string id=”menu_label_1″>Item 1</string>
<string id=”menu_label_2″>Item 2</string>
</strings>

There is also another important element in the app: the layouts (clearly explained in the programmers guide). I created a custom layout stored in a file named “resourceslayoutslayoutcustom.xml”, which includes the following content

<layout id=”CustomLayout”>
<label x=”center” y=”5″ text=”@Strings.prompt” color=”Gfx.COLOR_WHITE” justification=”Gfx.TEXT_JUSTIFY_CENTER” />
<bitmap id=”id_martina” x=”center” y=”30″ filename=”../drawables/martina.png” />
</layout>

There are several elements which can be used in a layout file, like texts, images, shapes, etc. Again the programmers guide explains all the necessary information for this.

Resource Compiler

Finally we have the resource compiler. Every time we built our app, the resource compiler creates a set of classes which will allow us to work with this elements. If we have any issue or bad defined file, we’ll get some guidance in the Console log for Connect IQ.

image

Once we have a successful build in our app, we can access to this elements via code using the Rez module. This is an autogenerated module with a structure similar to this one

module Rez
{
    module Drawables
    {
        var bitmap_id = 123;
    }
    module Strings
    {
       var hello_id = 456;
    }
    module Fonts
    {
       var font_id = 789;
    }
}

In our sample, in order to access and use the Custom Layout, the way to do this is

image

In the same way we can access strings, fonts, bitmaps, etc.

In the next post more stuff and maybe some Azure connected sample.

GitHub Source Code: https://github.com/elbruno/Blog/tree/master/Garmin

Greetings @ Toronto

-El Bruno

References


Filed under: Code Sample, Garmin, SmartWatch Tagged: Code Sample, Garmin, SmartWatch

#Xamarin – Algunos recursos para crear app “bonitas en #XamarinForms (Actualización!)

Hola!

Actualización: Este post tiene un poco de material nuevo sobre el post original que escribí hace un tiempo. Este nuevo material son algunas sugerencias de personas que conocen mucho de XF, gracias!

Después de invertir tiempo en conocer como trabajar con Bluetooth, beacons y otras tecnologías en Xamarin Forms, llega el momento de crear las apps. Aquí a más de uno se le puede caer el alma al piso, porque los controles por defecto que nos da Xamarin Forms son “un poco pobres”. Así que dejo un par de recursos que me he encontrado sobre ejemplos para mejorar el Look&Feel de nuestras Xamarin Forms Apps.

Xamarin Jump-start your next project with a prebuilt app

El primer ejemplo pueden ser las 4 apps de ejemplo que comparte el equipo de Xamarin donde además del código fuente, algunas de ellas están disponibles en las stores de Apple, Android y Windows Phone.

image

Xamarin Sport: A Beautiful Open Source Consumer App

Sobre la ultima app hay un post completo donde se explican los componentes que forman la misma. Además de como integrarla con Azure, y un pequeño video sobre la app

https://www.youtube.com/watch?v=GmdvxDVluRA

Adam Wolf Syntax is my UI

Un must read. Adam Wolf (Xamarin MVP) tiene unos recursos muy intersantes para el desarrollo con Xamarin Forms. Su Cookbook series es imprescindible si quieres ver hasta done puedes llegar

Xamarin.Forms Grid Recipe

Adam Wolf Xamarin.Forms ListView Custom ViewCell Recipe

Un ejemplo de la serie anterior. En esta entrada, Adam nos muestra como con un poco de código sobre un ListView, se puede tener un look&feel bastante atractivo.

image

GitHub PlugIns for Xamarin

Saliendo un poco de blogs de developer, en este caso este repo de GitHub tiene una colección de links a elementos muy útiles si desarrollas apps con Xamarin. Por ejemplo,

  • Compass: Easily access compass heading 0-360 degrees.
  • Local Notifications: Easily show and schedule local notifications.
  • Permissions: Check and request runtime permissions.
  • Share: Easily share text or open a browser

DevExpress Grid

Los controles de 3ros suelen tener sus mas y sus menos. Yo personalmente prefiero sacarme trabajo, si los controles son buenos y con los controles de DevExpress he tenido buenas experiencias. Es por esto, que esta grid para Xamarin Forms, está en mi lista de #MustTest. Además de que tiene varias features interesantes, es gratis!

 

Telerik UI for Xamarin

Finalmente, si puedes invertir un poco de dinero los controles de Telerik on una alternativa interesante. Controles para hacer gráficos, calendarios y una listview con más funcionalidades pueden acelerarnos mucho los tiempos de desarrollo.

image

Grial UI.Kit

Otro ejemplo donde es necesario invertir un poco de dinero, pero que nos permite ganar mucho tiempo.

Los amigos de Plain Concepts han hecho un interesante review de este kit que se puede leer aquí.

SyncFusion Essential Studio

Otra suite de controls donde toca poner un par de €uros. Eso si, hay planes específicos gratis para startups y demás. No he leído todas las opciones, pero es bastante interesante.

La suite de controles tiene cosas interesantes como el soporte para MVVM, integración nativa en Visual Studio con Nuget y más cosas.

En la página what’s new, se muestran las últimas actualizaciones con algunos controles muy buenos como el Calendar, Rating o el Schedule. Y como siempre, mejor explicarlo con un video

Saludos @ Madrid

-El Bruno

References


Filed under: Xamarin, Xamarin Forms Tagged: Xamarin, Xamarin Forms

#Xamarin – Resource list to create “nice apps” with #XamarinForms (Updated)

Hello!

Update: This is an update from my previous post with some new resources and some suggestions people told me to work with XF!

After investing some time on learning how to work with Bluetooth, beacons, and other technologies with Xamarin Forms, now is the time to create Apps. Someone (like me) could feel some disappointment, because the default controls supported by Xamarin Forms are “kind of poor”. So I pack a couple of resources which I found on samples on how to improve the Look & Feel of our Xamarin Forms Apps.

Xamarin Jump-start your next project with a prebuilt app

The first example can be the sample 4 apps shared by the Xamarin team, where besides the source code, some of which are available in the stores of Apple, Android, and Windows Phone.

image

Xamarin Sport: A Beautiful Open Source Consumer App

The last app has also a complete post, in which explains the components used in the app. As well as how to integrate it with Azure, and a short video about the app

Adam Wolf Syntax is my UI

A #MustRead website. Adam Wolf (Xamarin MVP) has a very interesting development resources with Xamarin Forms. His Cookbook series is essential if you want to see up to donate you can get

Adam Wolf Xamarin.Forms ListView Custom ViewCell Recipe

An example of the previous series. In this post, Adam shows us how with a little bit of code on a ListView, you can have a look & feel quite attractive.

image

GitHub PlugIns for Xamarin

Let’s leave dev blogs and go for GitHub. In this GitHub repository we can find a very useful collection of links to develop apps with Xamarin. For example:

  • Compass: Easily access compass heading 0-360 degrees.
  • Local Notifications: Easily show and schedule local notifications.
  • Permissions: Check and request runtime permissions.
  • Share: Easily share text or open a browser

DevExpress Grid

3rd party controls tend to have their advantages and disadvantages. If the controls are good, I usually try to use them. And I’ve good some very good experiences with DevExpress controls. That is why, this Xamarin Forms Grid, is on my #MustTest list. Besides that it has several interesting features, it’s free!

Telerik UI for Xamarin

Finally, if you can invest some money, the Telerik controls on an cool choice. Controls to make graphics, calendars and a extended listview can speed up our development time.

image

Grial UI.Kit

Another example where it is necessary to invest a little money, but that allows us to buy much time.

My good friends in Plain Concepts have made an interesting review of this kit which you can read here.

SyncFusion Essential Studio

Another suite where you need to spend some money (altought they have some free plans for startups). The nice things about this one is the support for MVVM, Nuget integration for Visual Studio Developers, and more stuff.

In the what’s new page, there are a couple of beautiful controls like the Calendar, the Rating or the Schedule. And, as always, a video is better than 1000 words

 

Greetings @ Madrid

-El Bruno

References


Filed under: EnglishPost, Xamarin, Xamarin Forms Tagged: English Post, Xamarin, Xamarin Forms
Página 1 de 41234