Translation API: Integrar traducciones en tu UI con TranslationSession

Misael Cuevas

01 enero, 20256min de lectura

La Translation API te ofrece la clase TranslationSession, diseñada para traducir contenido de un idioma a otro. Esto permite integrar traducciones directamente en tu interfaz de usuario, en lugar de mostrarlas en un sheet o popover gestionado por el sistema. Este enfoque es ideal en escenarios donde necesitas mayor control sobre la experiencia del usuario.

Cómo usar TranslationSession

Para utilizar TranslationSession, debes emplear el modificador translationTask. Este modificador acepta un closure llamado action, que recibe una instancia de TranslationSession. Dentro del closure puedes realizar la traducción necesaria. Cabe destacar que translationTask se ejecuta antes de que la vista aparezca. Un ejemplo básico de su uso es:

.translationTask { session in

}

Dentro del closure, utiliza la función asíncrona translate de TranslationSession para realizar una traducción. Solo necesitas proporcionar el texto a traducir. Por ejemplo:

let text = "Hello World"
let response = try await session.translate(text)
let translatedText = response.targetText

La función devuelve una estructura TranslationSession.Response con los siguientes campos:

• sourceLanguage: El idioma del texto original.
• sourceText: El texto original.
• targetLanguage: El idioma del texto traducido.
• targetText: El texto traducido.
• clientIdentifier: Cadena única para identificar la respuesta, útil en traducciones múltiples.

Ejemplo de uso en SwiftUI

Con unas pocas líneas de código, puedes integrar traducciones en una vista de SwiftUI:

import SwiftUI
// 1
import Translation

struct ContentView: View {
  @State var translatedText: String = "You want my treasure, you can have it. I left everything I gathered together in one place. Now, you just have to find it."

  var body: some View {
    Text(translatedText)
      .padding()
      // 2
      .translationTask { session in
        await translate(session: session)
      }
  }

  // 3
  func translate(session: TranslationSession) async {
    do {
      // 4
      let response = try await session.translate(translatedText)
      // 5
      translatedText = response.targetText
    } catch {
      // 6
    }
  }
}

Esta vista presenta un texto traducido a través de la variable de estado translatedText, donde:

1. Importa el framework Translation.
2. Usa el modificador translationTask para ejecutar la traducción.
3. Implementa la función translate para gestionar la lógica de traducción.
4. Traduce el texto almacenado en la variable de estado translatedText.
5. Actualiza la variable de estado con el texto traducido.
6. Maneja posibles errores, como por ejemplo cuando el usuario no descarga el idioma requerido.

En caso de que el dispositivo no tenga los idiomas necesarios, el framework mostrará un sheet guiando al usuario para descargarlos.

Si ejecutas este código en el simulador, se mostrará el siguiente mensaje en la consola de Xcode:

Además, el simulador mostrará un sheet indicando que la Translation API no es compatible con simuladores.

Cómo especificar idiomas

Por defecto, Translation API detecta automáticamente el idioma de origen y el idioma objetivo. Sin embargo, puedes especificar ambos idiomas utilizando los parámetros source y target en el modificador translationTask. Estos parámetros aceptan valores opcionales de tipo Locale.Language:

.translationTask(
  source: Locale.Language(identifier: "en_US"), 
  target: Locale.Language(identifier: "fr_FR")
) { session in
  ...
}

En este ejemplo se define que el idioma de origen es inglés y el idioma objetivo es francés.

Si no conoces el idioma de origen, lo recomendable es asignar nil al parámetro source para que el framework lo determine por ti. En caso de usar un idioma no soportado o repetir el mismo idioma en ambos parámetros, el framework generará un error.

Cambio dinámico de idiomas

Puedes utilizar variables de estado para cambiar dinámicamente los idiomas. Por ejemplo, añade las siguientes variables de estado después de la declaración de la variable translatedText:

@State var sourceLanguage = Locale.Language(identifier: "en_US")
@State var targetLanguage = Locale.Language(identifier: "fr_FR")

sourceLanguage definirá que el idioma de origine es inglés y que la variable targetLanguage será el francés como idioma a traducir.

Reemplaza todos los modificadores después del modificador .padding() por:

.translationTask(source: sourceLanguage, target: targetLanguage) { session in
  await translate(session: session)
}
.onTapGesture {
  sourceLanguage = Locale.Language(identifier: "fr_FR")
  targetLanguage = Locale.Language(identifier: "es_ES")
}

Este código permite traducir entre diferentes idiomas al tocar la vista.

Como puedes observar cada vez que cambias los idiomas se vuelve a realizar una traducción.

Código completo

import SwiftUI
import Translation

struct ContentView: View {
  @State var translatedText: String = "You want my treasure, you can have it. I left everything I gathered together in one place. Now, you just have to find it."
  @State var sourceLanguage = Locale.Language(identifier: "en_US")
  @State var targetLanguage = Locale.Language(identifier: "fr_FR")

  var body: some View {
    Text(translatedText)
      .padding()
      .onTapGesture {
        sourceLanguage = Locale.Language(identifier: "fr_FR")
        targetLanguage = Locale.Language(identifier: "es_ES")
      }
      .translationTask(source: sourceLanguage, target: targetLanguage) { session in
        await translate(session: session)
      }
  }

  func translate(session: TranslationSession) async {
    do {
      let response = try await session.translate(translatedText)
      translatedText = response.targetText
    } catch {
      // Handle errors
    }
  }
}

Consideraciones al usar TranslationSession

La clase TranslationSession no posee un inicializador, y no es recomendable almacenarla fuera del ciclo de vida de una vista SwiftUI. Cada instancia está vinculada a la vista que usa el modificador translationTask. Si intentas usarla después de que la vista desaparezca, se producirá un fatalError.

Recuerda que el framework puede interactuar con el usuario, por ejemplo, para descargar idiomas.

Conclusión

Translation API y su clase TranslationSession son herramientas potentes para integrar traducciones dinámicas, ofreciendo una experiencia de usuario más personalizada y fluida. Al aprovechar translationTask, puedes gestionar fácilmente la lógica de traducción directamente en tus vistas de SwiftUI. Sin embargo, es importante considerar las limitaciones, como la falta de soporte en simuladores y la necesidad de descargar idiomas.