[Xamarin.Forms] Efecto para personalizar la StatusBar

Javier Suárez | Blog

Introducción

La StatusBar es un área importante de cara al usuario final. Disponible para mostrar información importante relacionada con el estado del sistema (hora, batería, red, etc.) además de notificaciones de otras aplicaciones.

StatusBar

Al desarrollar aplicaciones móviles, entre los objetivos, debemos conseguir un estilo único y uniforme. Para conseguirlo, en ocasiones será necesario modificar el aspecto de la StatusBar o incluso cambiarlo de forma uniforme para adaptarla a diferentes páginas de nuestra aplicación.

¿Cómo personalizamos la StatusBar?. En este artículo vamos a crear un efecto de Xamarin.Forms para personalizar la StatusBar en Android, iOS y en UWP.

Efectos

Un efecto permite el acceso al control nativo de cada plataforma con el objetivo de personalizarlo, principalmente aplicando pequeños cambios estéticos o de comportamiento. Permiten simplificar la personalización del control y sobretodo se convierten en “piezas” reutilizables de código incluso aceptando parametrización.

Crear un efecto

El proceso de creación de…

View original post 544 more words

Advertisements

[SVQXDG] Analizando interfaces de usuario avanzadas con Xamarin.Forms

Javier Suárez | Blog

El evento

En los últimos tiempos, la mejora de Xamarin.Forms tanto en posibilidades a nivel de UI (VisualStateManager, FlexLayout, etc.) como a nivel de renderers y rendimiento (a destacar en Android) ha sido importante.

Realmente, en el estado actual de Xamarin.Forms se pueden conseguir aplicaciones nativas de gran escala, con interfaces cuidadas y con alta integración con la plataforma. Hay que tener en cuenta el conjunto de Custom Renderers (código específico en cada plataforma) necesario para lograrlo.

NOTA: La elección entre Xamarin Classic o Xamarin.Forms es importante. Es necesario evaluar la aplicación a desarrollar, el conjunto de características específicas de cada plataforma (que pueden requerir un Custom Renderer), etc. 

Es cada vez mayor el recopilatorio de ejemplos Open Source con Xamarin.Forms buscando interfaces complejas:

En este evento, vamos a analizar entre todos, abriendo debate e intercambiando ideas algunos de los ejemplos revisando opciones disponibles para conseguir ciertos resultados. Hablaremos de…

View original post 67 more words

[Xamarin.Forms] Utilizando Toolbox

Javier Suárez | Blog

Introducción

Xamarin.Forms añade una capa de abstracción en la capa de UI que nos permite definir la misma una única vez para todas las plataformas. Con la llegada de Visual Studio 2017 15.8 y Visual Studio macOS 7.6 llega la Toolbox o caja de herramientas de controles Xamarin.Forms. Esto permite arrastrar y soltar elementos desde la caja de herramientas a la zona de edición de XAML.

Xamarin.Forms Control Toolbox

Xamarin.Forms Control Toolbox

La Toolbox se puede encontrar en Windows dentro del menu View o pulsando Ctrl + Alt + X. En macOS se puede encontrar en el menu View bajo Pads.

Arrastrar y soltar!

El Toolbox muestra todo el conjunto de controls, layouts y celdas disponibles en Xamarin.Forms permitiendo arrastrar y soltar cualquier elemento desde la propia caja de herramientas a la zona de edición de XAML.

Tenemos agrupados todo el conjunto de controles y Layouts con soporte a Xamarin.Forms…

View original post 106 more words

[Xamarin.Forms] Ejemplos de Backend WPF

Javier Suárez | Blog

Introducción

Xamarin.Forms añade una capa de abstracción en la capa de UI que nos permite definir la misma una única vez para todas las plataformas. Podemos definir esta interfaz con código C# o XAML. El soporte de WPF ahora está  disponible en Xamarin.Forms.

Xamarin.Forms

Para conocer y revisar las diferentes opciones disponibles, ¿algo mejor que contar con ejemplos?

Ejemplos Xamarin.Forms.Platform.WPF

El repositorio de ejemplos oficial de Xamarin.Forms es una fuente inmejorable de ejemplos cubriendo desde ejemplos básicos a uso de SkiaSharp, SQlite, gestos, efectos, etc. A continuación, puedes encontrar un repositorio donde encontrar la mayoría de ejemplos (y creciendo!) con versión WPF.

Puedes encontrar el repositorio en GitHub:

Ver GitHub

Más información

View original post

[Xamarin.Forms] Ejemplos de Backend Linux

Javier Suárez | Blog

Introducción

Xamarin.Forms añade una capa de abstracción en la capa de UI que nos permite definir la misma una única vez para todas las plataformas. Podemos definir esta interfaz con código C# o XAML. El soporte de Linux (GTK) ahora está  disponible en Xamarin.Forms.

Xamarin.Forms

Para conocer y revisar las diferentes opciones disponibles, ¿algo mejor que contar con ejemplos?

Ejemplos Xamarin.Forms.Platform.GTK

El repositorio de ejemplos oficial de Xamarin.Forms es una fuente inmejorable de ejemplos cubriendo desde ejemplos básicos a uso de SkiaSharp, SQlite, gestos, efectos, etc. A continuación, puedes encontrar un repositorio donde encontrar la mayoría de ejemplos (y creciendo!) con versión GTK.

Puedes encontrar el repositorio en GitHub:

Ver GitHub

Más información

View original post

[Xamarin.Forms] Novedades de la versión 3.2 pre1 (Preview)

Javier Suárez | Blog

Introducción

Recientemente se ha liberado la primera Preview de la versión 3.2 de Xamarin.Forms. Una nueva versión repleta de novedades que vamos a revisar en este artículo.

Las mejoras principales

A continuación, vamos a revisar las novedades principales (no son todas).

Control de la posición del caret

Comenzamos revisando una novedad sencilla pero muy interesante, controlar la posición del Caret. Ahora contamos con una nueva propiedad de tipo entero llamada CursorPosition.

<Entry 
     CursorPosition="4"
     Text="CursorPosition"/>

También tenemos un Platform Specific en el caso de iOS para poder controlar el color del cursor Entry<iOS>.CursorColor.

Commandable Span regions

Ya contábamos con la propiedad FormattedText para poder crear texto con formato utilizando Spans. Ahora nos llega la posibilidad de añadir Gesture Recognizers a cada elemento.

<Label>
     <Label.FormattedText>
          <FormattedString>
               <Span Text="{Binding Span1}" />
               <Span 
                    Text="{Binding Span2}" 
                    TextColor="Blue">
                    <Span.GestureRecognizers>
                         <TapGestureRecognizer Command="{Binding TapCommand}" />
                    </Span.GestureRecognizers>
               </Span>
               <Span Text="{Binding Span3}"/>
          </FormattedString>
     </Label.FormattedText>
</Label>

El…

View original post 311 more words

[Xamarin.Forms] Principales novedades de la versión 3.1

Javier Suárez | Blog

Introducción

Contamos con nueva versión de Xamarin.Forms, la 3.1. Una versión que tiene una variedad de novedades centradas en reducir la cantidad de controles personalizados y código específico en nuestras aplicaciones. En este artículo, vamos a hacer un rápido repaso sobre las novedades principales.

Novedades

Entre el conjunto de novedades principales encontramos:

Pestañas en la parte inferior

Google añadió BottomNavigationView en Android Support Library 25, y gracias a ello, ha sido posible añadirlo en Xamarin.Forms de forma sencilla utilizando Platform Specific.

<TabbedPage
     xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
     BarBackgroundColor="LightBlue"
     android:TabbedPage.ToolbarPlacement="Bottom"
     android:TabbedPage.BarItemColor="Gray"
     android:TabbedPage.BarSelectedItemColor="Black"
     Title="Bottom Tabs">
     <TabbedPage.Children>
          <ContentPage 
               Title="First"
               Icon="first">
               <Grid />
          </ContentPage>
          <ContentPage
               Title="Second"
               Icon="second">
               <Grid />
          </ContentPage>
          <ContentPage
               Title="Third"
               Icon="third">
               <Grid />
          </ContentPage>
     </TabbedPage.Children>
</TabbedPage>

Se puede establecer la posición de las pestañas con la propiedad ToolbarPlacement. También se cuentan con propiedades destinadas a personalizar el estilo de las pestañas:

  • BarItemColor: Color del icono y texto de cada pestaña.
  • BarSelectedItemColor: Color…

View original post 369 more words

#Personal – “Cindy Healy, always check the cables” or the best way to encourage you to study an engineering career #GoalCast #GoalCast

Hi! There are many programs to promote diversity in work environments. Many of these programs also focus on encouraging women to study engineering careers. In my particular case, I think that the next 4 minutes are the best way to explain what you can do by being an engineer. https://www.facebook.com/goalcast/videos/1389061181238922 Important: If you've read the … Continue reading #Personal – “Cindy Healy, always check the cables” or the best way to encourage you to study an engineering career #GoalCast #GoalCast

#Personal – “Cindy Healy, siempre comprueba los cables”, o la mejor forma de animarte a estudiar una carrera de ingeniería #GoalCast

Buenas! Hay muchos programas para promover la diversidad en los ambientes de trabajo. Muchas de estos programas también se centran en animar a que las mujeres estudien carreras de ingeniería. En mi caso particular, creo que los siguientes 4 minutos son la mejor forma de explicar lo que puedes hacer siendo un ingeniero o ingeniera. … Continue reading #Personal – “Cindy Healy, siempre comprueba los cables”, o la mejor forma de animarte a estudiar una carrera de ingeniería #GoalCast

[Xamarin.Forms] Addins y extensiones para Visual Studio macOS y Windows

Javier Suárez | Blog

Introducción

Visual Studio para macOS y Windows cuentan con modelos de extensión diferentes, modelos para crear interfaces de usuario diferentes y habitualmente trasladar un addin de macOS a una extension en Windows o viceversa, es costoso. ¿Podemos simplificar el proceso?, ¿podemos lograr compartir más elementos?.

En este artículo, vamos a ver como crear addins para Visual Studio macOS así como extensiones para Visual Studio Windows utilizando Xamarin.Forms para lograr compartir la UI.

Utilizaremos Measurer4000, herramienta diseñada para obtener métricas de código compartido en proyectos Xamarin. Nuestro objetivo será añadir la herramienta dentro de Visual Studio.

Add-ins para Visual Studio macOS

La arquitectura de Visual Studio para macOS es extensible. La forma de extender se basa en rutas de extensión que permiten que terceros extiendan el comportamiento. Por ejemplo: para extender la zona de edición de código, se expone /MonoDevelop/SourceEditor2/ContextMenu/Editor permitiendo añadir nuevos comandos en el menu contextual al…

View original post 1,136 more words