El nuevo Checkbox en Xamarin.Forms 4.1 y revisando el control de InputKit

Con el lanzamiento de Xamarin.Forms 4.1 llega un nuevo control de casilla de verificación (Checkbox). Voy a usar ambos terminos Checkbox y Casilla de verificación intercambiablemente a lo largo del artículo. Así se ve el nuevo control:

Imagen tomada directamente de la documentación https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/checkbox

Para instanciar el control en XAML o C#:

El CheckBox tiene una propiedad bindeable para el estado de cotejado (IsChecked) y también puede manejar el evento de cotejo modificado (CheckedChanged).

Una observación

El control tiene una forma redondeada en iOS. Si deseas que tenga una forma cuadrada, puedes usar la API Visual.

Por ahora, el control CheckBox no incluye una propiedad de texto y no muestra una etiqueta al lado, para lograrlo, debes incluir explícitamente un Label y asegurarte de alinearlo al lado, por ejemplo:

El resultado se ve así:

En el lado izquierdo está la versión de iOS en el lado derecho, la de Android.

Otras opciones

Si estás trabajando en un proyecto legacy o por el motivo que sea, no puedes actualizar a la versión 4.1 de Xamarin.Forms pero aún así estás buscando incluir un CheckBox, aquí hay un par de opciones para tí:

1. Utiliza el control de interruptor (Switch). De una manera práctica / funcional, es lo mismo que un CheckBox en que con él puedes manejar los estados de encendido / apagado (verdadero / falso). La interfaz de usuario ciertamente no es la de un CheckBox, pero si todo lo que necesitas es la funcionalidad, te debe bastar.
2. Usa el paquete Xamarin.Forms.InputKit. Este paquete lleva un buen tiempo de publicado, por lo que el equipo ha tenido el tiempo de incluir algunas características interesantes, como poder configurar la etiqueta para el control, usar botones de radio y establecer un ícono de verificación personalizado para nombrar unos pocos.

Usando la librería Xamarin.Forms.InputKit

Al igual que la mayoría de las bibliotecas de terceros en el ecosistema de Xamarin, es muy fácil de configurar y te brinda acceso a una variedad de controles pero nos centraremos en la funcionalidad de la casilla de verificación por ahora.

Para configurar la biblioteca sigue estos pasos:

• Incluye el paquete de Nuget Xamarin.Forms.InputKit en todos tus proyectos.
• Inicialízalo en los proyectos de destino llamando a Plugin.InputKit.Platforms.iOS.Config.Init(); o Plugin.InputKit.Platforms.Droid.Config.Init (this, savedInstanceState);
• Haz referencia al namespace de InputKit en tu XAML agregando esta línea en la declaración de la página xmlns: input = “clr-namespace: Plugin.InputKit.Shared.Controls; assembly = Plugin.InputKit”.
• Prepon el namespace input a los controles que desees utilizar

Para crear una casilla de verificación (CheckBox) puedes escribir algo como esto:

A la izquierda el Checkbox cotejado y a la derecha sin cotejo

Al igual que el nuevo control Checkbox de Xamarin.Forms, el de InputKit incluye una propiedad vinculable (bindable) para el checked llamada IsChecked y puedes escuchar el estado de cambio del cotejo con el controlador de eventos (EventHandler) para CheckChanged o con el comando CheckChangedCommand.

Como se mencionó anteriormente, este paquete ha estado disponible por algún tiempo e incluye algunas cosas más que la nueva casilla de verificación nativa de Xamarin.Forms, como la capacidad de incluir el texto de la etiqueta de la casilla de verificación y el tipo de casilla de verificación que desea procesar. Estos son los diferentes tipos de Checkbox:

Imagen tomada directamente desde el repositorio. https://github.com/enisn/Xamarin.Forms.InputKit

Escribí un proyecto de muestra aquí si deseas verlo https://github.com/eatskolnikov/CheckBoxSample

Y eso es todo amigos, como siempre, espero que esta información te haya sido de utilidad y si te gustó te animo a que lo compartas en las redes sociales y a que veas los demás artículos en Xamarin Latino o en mi sitio web.