Acceso a Imágenes de Galería con Fotos UI en iOS 16

Clase 16 de 31Curso de Integración Nativa iOS

Resumen

¿Cómo acceder a las imágenes desde la galería en iOS 16?

Desde la llegada de iOS 16, Apple introdujo el framework Photos UI, el cual representa una herramienta moderna y flexible para interactuar con los elementos de la galería de un dispositivo. Este enfoque es notablemente más poderoso y fácil de usar que el antiguo UIImagePickerController. Así es como puedes aprovechar este recurso para obtener y manipular imágenes desde la galería del dispositivo.

¿Qué preparación inicial se requiere?

Para comenzar a trabajar con Photos UI, es esencial realizar algunas configuraciones iniciales en tu proyecto. A continuación te indicamos los pasos para preparar el entorno de tu aplicación:

  1. Importar el framework: Asegúrate de incluir Photos UI al inicio de tu estructura de archivos en el proyecto.
  2. Definir Variables:
    • Crea una variable privada de estado selectedPhotos, que será un vector de elementos del tipo PhotosPickerItem, para almacenar los elementos seleccionados de la galería.
    • Genera otra variable para mantener la lista de imágenes cargadas de la galería como objetos de tipo UIImage.
    • Establece una variable para mensajes de error globales, que será de tipo String.

¿Cómo implementar la interfaz de usuario con el botón de selección de imágenes?

Una vez configurado el entorno, es momento de actualizar el diseño de la interfaz para interactuar con la galería de imágenes:

  1. Configurar el diseño UI: Utiliza un VStack para organizar elementos en la pantalla.
  2. Crear el botón de selección:
    • Diseña un botón de texto que simbolice una acción de clic para abrir la galería.
    • Usa la variable photoPickerSection para integrar la vista del botón.
  3. Modificar el botón:
    • Implementa PhotosPicker y define los parámetros, entre ellos, dónde se almacenará el resultado (en selectedPhotos) y el número máximo de imágenes que se pueden seleccionar. Por ejemplo, establece un límite de tres imágenes a través del parámetro maxSelectionCount.

¿Cómo cargar y mostrar las imágenes seleccionadas?

Para completar el proceso, implementa funciones que manejarán la carga y visualización de las imágenes seleccionadas:

  1. Función de cambio (onChange):

    • Añade la lógica para actualizar la vista cuando haya cambios en la selección de imágenes. Utiliza onChange para reaccionar a cualquier ajuste en la selección.
  2. Cargar las imágenes seleccionadas:

    • Implementa loadSelectedPhotos para gestionar la carga de imágenes:
      private func loadSelectedPhotos() {
          // Limpia las colecciones antes de cargarlas nuevamente
          selectedPhotos.removeAll()
          images.removeAll()
      
          // Reinicia el mensaje de error
          errorMessage = ""
      
          // Cargar las fotos seleccionadas de manera asíncrona
          Task {
               await withTaskGroup(of: UIImage?.self) { taskGroup in
                   for photoItem in selectedPhotos {
                       taskGroup.addTask {
                           return await self.loadPhoto(photoItem)
                       }
                   }
      
                   for await result in taskGroup {
                       if let uiImage = result {
                           self.images.append(uiImage)
                       } else {
                           self.errorMessage = "Falló en obtener una o más imágenes."
                           break
                       }
                   }
               }
          }
      }
      
  3. Verificar la selección:

    • Muestra las imágenes usando un ForEach para iterar la colección de imágenes en la interfaz, asegurándote de que reaccione dinámicamente a los errores o cambios.

Photos UI no solo simplifica la interacción con la galería, sino que garantiza una experiencia de usuario más fluida. Tal como se muestra, el número de imágenes seleccionables se puede ajustar, permitiéndote personalizar fácilmente cómo se integran las imágenes en tus aplicaciones. La adaptación de esta herramienta es especialmente útil para implementar funciones como cambiar fotos de perfil o cargar imágenes para reportes. ¡Anímate a explorar nuevas funcionalidades y a seguir ampliando tus conocimientos!