Android Design Extensions 2.5 para Xojo 2024r1 +

A continuación encontrarás traducido al Castellano el artículo escrito por Martin T. y publicado originalmente en el Blog Oficial de Xojo.

Ya está disponible la primera versión de Xojo de 2024, y es el momento para actualizar de nuevo las Android Design Extension, las cuales están disponibles ahora en su versión 2.5. Esta versión funciona sobre todas las versiones de Xojo a partir de 2024r1 y ofrece más de 70 nuevos declares.

El foco de esta nueva revisión se encuentra en la integración de imágenes en los controles, como por ejemplo MobileButton, MobileDateTimePicker, MobileTextField, MobileSlider, etc.

Veamos algunas de las nuevas posibilidades mediante ejemplos.

Crear un MobileButton con una Imagen

Se trata de una característica solicitada en el Tracker Issues de Xojo pero aun no se ha implementado en el framework Android de Xojo; de modo que hagámoslo nosotros mismos con la ayuda de Android Design Extensions.

Crea un nuevo proyecto Android. Copia ahora la carpeta Android Design Extensions en el proyecto o arrástralo y suéltalo en el Navegador. Selecciona a continuación Screen1 en el Navegador y añade un MobileButton – Button1 – e incorpora el evento Opening. Añade el siguiente código al evento Opening:

Me.SetIconXC(SaveSystemImage("camera"))
Me.SetIconGravityXC(IconGravity.TextStart)

SaveSystemImage es un método de extensión que devuelve un FolderItem y guarda una Picture.SystemImage en la carpeta Documents con el nombre indicado (en este caso “camera”). ¿Por qué? los Declare de Xojo no soportan Picture como un tipo de dato y por tanto tenemos que guardar las imágenes para cargarlas en los controles mediante la ruta del archivo.

Por supuesto puedes usar cualquier otra imagen y no está restringido a Picture.SystemImage. Todos los métodos de extensión de Android Design Extensions relacionados con mostrar imágenes están listos para ello, y esperan un FolderItem como parámetro, el cual debe ser por supuesto una imagen (PNG, JPEG, etc.).

SetIconGravityXC se asegura de que el Picture se muestre por delante del texto del botón. Y eso es todo. Ejecuta el proyecto y ahora tendrás un botón con una imagen.

Consejo: Si creas una subclase de MobileButton, puedes cachear el FolderItem mediante Static para crear el archivo de imagen sólo una vez. Por supuesto, esto sólo se aplica al hecho de que todas las instancias de botón de esta subclase siempre mostrará la misma imagen.

Echa un vistazo a la app de ejemplo de Android Design Extensions para ver cómo añadir una imagen a una MobileScreen, MobileSlider o MobileSwitch.

Extension TabPanel Badge

Las pestañas de MobileTabPanel también soportan las insignias de texto. ¿Cómo hacerlo?

Añade un MobileTabPanel – TabPanel1 – a tu proyecto e incorpora el evento Opening sobre dicha instancia, utilizando el siguiente código:

Me.SetBadgeTextAtXC(0, "Exclusive")

Y eso es todo lo necesario. Este será el resultado:

Existen otros métodos de extensión de MobileTabPanel con los cuales puedes personalizar las insignias (color, posición, etc.) ¡Pruébalas!

TextField llevados a un nuevo nivel

También se pueden mejorar los TextField con la nueva versión de Android Design Extensions.

La llamada a SetBoxCornerFamilyXC ofrece ahora la opción de elegir si quieres esquinas planas o redondeadas. También puedes usar SetCursorColorXC para definir el color del cursor para cada TextField.

Los TextField también pueden tener ahora un icono a la derecha o izquierda del texto. Los métodos para ello son SetStartIconXC y SetEndIconXC, los cuales esperan recibir como parámetro un FolderItem (imagen).

También encontrarás muchos otros declares nuevos. Échales un vistazo.

Siéntete libre de echar un vistazo al repositorio de desarrollo, crear solicitudes de características y enviar comentarios para ampliar la librería de extensiones.

También agradeceré cualquier soporte financiero voluntario por todo el trabajo que he venido realizando hasta ahora, el cual puedes realizar desde aquí. Puedes descargar el proyecto con los diversos ejemplos desde este enlace.

¡Feliz programación!