Cómo localizar la IU con Translations Editor

La herramienta Translations Editor ofrece una vista unificada y editable de todos los recursos de strings predeterminados y traducidos.

Para obtener una introducción a la traducción de tu app en diferentes idiomas, lee Cómo brindar compatibilidad con diferentes idiomas y culturas.

Figura 1: Se muestra el texto de la app antes de la traducción en Translations Editor.

Recursos de strings

Los recursos de strings para un proyecto se ubican en archivos strings.xml. Tu proyecto tiene un archivo strings.xml predeterminado que contiene recursos de strings en el idioma predeterminado de tu app, que es el idioma que esperas que hable la mayoría de los usuarios de esta. También puedes tener archivos strings.xml traducidos que contengan recursos de strings para otros idiomas que quieras que tu app admita.

Una vez que completes el archivo strings.xml predeterminado, podrás agregar las traducciones tú mismo o contratar un servicio profesional para que lo haga. De cualquier manera, deberías aprovechar las funciones de Android Studio que te permiten administrar y probar texto localizable. Para obtener información sobre servicios de traducción profesional, consulta Cómo solicitar servicios de traducción.

Cómo abrir Translations Editor

Puedes acceder a Translations Editor desde los siguientes lugares en Android Studio.

Cómo acceder desde la vista Android

  1. En el panel Project > Android del lado izquierdo, selecciona ModuleName > res > values.
  2. Haz clic con el botón derecho en el archivo strings.xml y selecciona Open Translations Editor.

    En Translations Editor, se muestran los pares clave-valor del archivo strings.xml.

    Nota: Cuando tienes archivos strings.xml traducidos, tu proyecto tiene varias carpetas values correspondientes con sufijos que indican el idioma, por ejemplo, values-es para español. El archivo strings.xml predeterminado siempre se ubica en la carpeta values (sin sufijo).

En la figura 1, se muestra el texto predeterminado de una app simple (en este caso, en inglés) en Translations Editor antes de la traducción. El contenido de los archivos strings.xml traducidos aparecerá a la derecha de la columna Untranslatable con una columna por idioma, como se muestra en la figura 2.

Cómo acceder desde strings.xml

Puedes acceder a Translations Editor desde cualquiera de tus archivos strings.xml.

  1. En el panel Project > Android del lado izquierdo, selecciona ModuleName > res > values.
  2. Haz doble clic en strings.xml para abrirlo y editarlo.
  3. En strings.xml, haz clic en el vínculo Open editor en la esquina superior derecha.

Nota: Si haces clic en el vínculo Hide notification, desaparecerá el vínculo Open editor. Para recuperarlo, cierra el proyecto y vuelve a abrirlo.

Cómo acceder desde Design Editor

Puedes abrir Translations Editor desde el Design Editor de Layout Editor a fin de editar el texto predeterminado y el traducido para que se ajuste mejor a tu diseño. Si quieres obtener información sobre cómo cambiar de idioma en Design Editor, consulta Cómo mostrar el texto traducido en Design Editor.

  1. En el panel Project > Android del lado izquierdo, selecciona ModuleName > res > layout.
  2. Haz doble clic en content_main.xml para abrirlo y editarlo.
  3. Haz clic en la pestaña Design en la esquina inferior izquierda para mostrar Design Editor.
  4. En Design Editor, selecciona la lista desplegable Language .
  5. Selecciona Edit Translations .

Cómo configurar filas no traducibles

En Translations Editor, puedes seleccionar la opción Untranslatable para indicar que no quieres que se traduzca el texto de esta fila. Es posible que el texto que no quieras traducir sea específico del producto, como nombres y marcas comerciales, o bien terminología técnica que no tiene traducción.

Cuando marcas la opción Untranslatable, se agrega translatable="false" en la línea correspondiente del archivo strings.xml predeterminado. En el siguiente ejemplo, EasyApp en la línea superior no se traduce porque es el nombre del producto.

    <resources>
        <string name="app_name" translatable="false">EasyApp</string>
        <string name="action_settings">Settings</string>
        <string name="easy_app">I am a Simple App!</string>
        <string name="next_page">Next Page</string>
        <string name="second_page_message">I am the Second Page!</string>
        <string name="title_activity_second">SecondActivity</string>
    </resources>
    

Cómo agregar y borrar idiomas

Translations Editor admite el código de idioma BCP 47 y combina los códigos de región (país) y configuración regional en una única selección para las localizaciones de destino. Una configuración regional no solo define el idioma, sino también los formatos que deben usarse en cada país para información como la fecha y hora, la moneda y los decimales.

Para agregar un idioma, haz lo siguiente:

  1. En Translations Editor, haz clic en el ícono del globo terráqueo .
  2. En la lista desplegable, selecciona el idioma que quieras agregar.

    Se mostrará el nuevo idioma en Translations Editor y se agregará al proyecto una carpeta values-* con un archivo strings.xml. Por ejemplo, values-es para español.

Para borrar un idioma, haz lo siguiente:

Para borrar un idioma en Translations Editor, borra todos los valores de la columna (consulta Cómo editar, agregar o borrar texto), o bien borra la carpeta del proyecto de ese idioma de la siguiente manera:

  1. En el panel Project > Android del lado izquierdo, selecciona ModuleName > res.
  2. Haz clic con el botón derecho en la carpeta values-* del idioma que quieras borrar. Por ejemplo, values-hi para hindi.
  3. En la lista desplegable, selecciona Delete para borrar la carpeta y su archivo strings.xml.

Cómo editar, agregar y borrar texto

Puedes operar en las opciones de texto directamente en el archivo strings.xml o mediante Translations Editor. En esta sección, se describe el enfoque de Translations Editor. En Translations Editor, puedes editar, agregar o borrar texto por medio de la vista de lista o del campo Translation en la parte inferior de Translations Editor.

Figura 2: Vista de lista en la parte superior y campo de Translation en la parte inferior

Vista de lista

Para editar o agregar texto, haz lo siguiente:

  1. Haz doble clic en la celda en la que quieras editar o agregar texto.
  2. Puedes usar el teclado para copiar y pegar el texto, o bien, si tienes un teclado que admite signos diacríticos, escribir directamente en la vista de lista.
  3. Presiona Tab o coloca el cursor fuera del campo.

Para borrar texto, haz lo siguiente:

  1. Haz doble clic en la celda que quieras borrar.
  2. En la vista de lista, selecciona el texto y presiona Delete.
  3. Presiona Tab o coloca el cursor fuera del campo.

Campo Translation

Para editar o agregar texto, haz lo siguiente:

  1. En la vista de lista, haz clic en la celda en la que deseas editar o agregar texto.
  2. En el campo Translation, usa el teclado para copiar y pegar el texto o, si tienes un teclado que admite signos diacríticos, escribe directamente en el campo Translation.
  3. Presiona Tab o coloca el cursor fuera del campo.

Para borrar texto, haz lo siguiente:

  1. Haz clic en la celda que quieras borrar.
  2. En el campo Translation, selecciona el texto y presiona Delete.

Cómo agregar y borrar claves

En la columna Key de Translations Editor, se enumeran los identificadores únicos para cada elemento de datos en tus archivos strings.xml. Puedes agregar y borrar claves por medio de Translations Editor. Al borrar una clave, Translations Editor también borra todas sus traducciones asociadas. Para ello, usa la opción "Safe Delete refactoring", que te informa si el texto de la clave se usa en otra parte y te da la opción de realizar las modificaciones necesarias antes de borrarla. La función "Safe Delete refactoring" garantiza que tu código igualmente se compile luego de que borres la clave.

Para agregar una clave, haz lo siguiente:

  1. En Translations Editor, haz clic en Add Key .
  2. En el diálogo, ingresa un nombre de clave, un valor predeterminado y la ubicación del archivo strings.xml predeterminado.

    Figura 3: Agrega una clave.

Para borrar una clave, haz lo siguiente:

  1. En Translations Editor, selecciona la clave que quieras borrar.
  2. Haz clic en Remove Keys .
  3. En el diálogo Delete, elige si quieres borrarla de manera segura y si deseas buscarla en los comentarios y las strings. Luego, haz clic en OK.

    Figura 4: Diálogo "Delete"

    Si no hay referencias (usos) a la clave borrada o si todas las referencias pueden contraerse de forma segura, entonces se borrará la clave. De lo contrario, Translations Editor mostrará el diálogo Usages Detected con información sobre los problemas detectados.

    Figura 5: Diálogo "Delete"

  4. Selecciona View Usages para revisar el contenido que se borrará. En el diálogo Find Safe Delete Conflicts, se muestran todos los usos que no deberían borrarse porque no es seguro, a fin de que puedas editar el código correspondiente.

    Figura 6: Usos que no deberían borrarse porque no es seguro

  5. Haz clic con el botón derecho en un uso para ver el menú contextual y selecciona Jump to Source a fin de realizar los cambios necesarios.
  6. En el panel Find Safe Delete Conflicts, selecciona Rerun Safe Delete para asegurarte de que no haya otros usos que debas revisar.
  7. Una vez que borres los usos, haz clic en Do Refactor para borrar la clave.

Cómo corregir errores

En la figura 7, se muestra el contenido de los archivos strings.xml en inglés, español y francés en Translations Editor. Las líneas que contienen errores se muestran en color rojo.

Figura 7: El texto en color rojo indica una condición de error que debes corregir.

Para corregir un error, haz lo siguiente:

  1. Pasa el cursor sobre el texto rojo para ver una explicación del problema y su solución.
  2. Si quieres corregir un error, pasa el cursor sobre el texto rojo para ver una explicación del problema y su solución.

Cuando realices modificaciones en Translations Editor, los archivos strings.xml subyacentes se actualizarán con estos cambios. Cuando lo hagas en un archivo strings.xml, la columna correspondiente en Translations Editor se actualizará con los cambios.

Ejemplo de correcciones en Translations Editor:

  • En la figura 7, la fila app_name se marcó como Untranslatable, pero se proporcionó una traducción al español. Para corregir el error, deberás borrar la traducción.
  • En la figura 7, falta la traducción al francés en la fila next_page. Usa tu teclado para copiar Page Suivante en la celda a fin de corregir el error. La operación de copiar y pegar con el teclado copia el texto con los signos diacríticos en la celda.

Cómo mostrar texto traducido en Design Editor

Para ver cómo se muestra el texto traducido en el diseño de tu app, alterna el texto entre la versión predeterminada y la traducida en Design Editor de la siguiente manera:

  1. En el panel Project > Android del lado izquierdo, selecciona ModuleName > res > layout.
  2. Haz doble clic en content_main.xml para abrirlo y editarlo.
  3. Haz clic en la pestaña Design en la esquina inferior izquierda para mostrar Design Editor.
  4. En Design Editor, selecciona la lista desplegable Language .
  5. Selecciona Edit Translations .
  6. Selecciona el idioma que quieres usar para ver tu app.

    Figura 8: La lista desplegable de idiomas con la opción "español" seleccionada

En Design Editor, se muestra el diseño de tu app en el idioma seleccionado, que en este caso es español.

Figura 9: Se muestra el texto traducido al español en Design Editor.

Cómo configurar Design Editor en el idioma predeterminado

Para volver a la configuración de idioma predeterminado, selecciona es > Language .

Figura 10: Configurado en el idioma predeterminado

Cómo administrar y probar el texto localizable

Android Studio y la plataforma Android ofrecen varias funciones para ayudarte a administrar y probar el texto localizable de tu app. Estas funciones tienen opciones que te ayudan a resolver problemas con secuencias de comandos de derecha a izquierda (RTL), como en árabe o hebreo. Probar el texto localizable te permite realizar los ajustes necesarios en el texto de la IU y su diseño antes de confirmar tus mensajes en el repositorio de origen que luego se enviarán para su traducción.

Cómo refactorizar tu proyecto para que admita RTL

Android Studio tiene un comando de refactorización que habilita la compatibilidad con el texto bidireccional en elementos TextView, ConstraintLayout y LinearLayout de manera que tus apps puedan mostrar el texto en secuencias de comando de izquierda a derecha (LTR) y de derecha a izquierda (RTL), y permitir que los usuarios lo editen. Este también ofrece la duplicación automática de diseños de IU de apps y todos los widgets de vista. Para ver el cambio de dirección de texto y la duplicación de diseño, deberás configurar las propiedades de dirección del diseño y del texto en Layout Editor.

En el siguiente procedimiento, se muestra cómo refactorizar tu proyecto para que admita RTL:

  1. Selecciona Refactor > Add RTL support where possible para abrir el diálogo que se muestra en la figura 11.

    Figura 11: Agrega compatibilidad con RTL.

    • Si el elemento <application> en tu archivo AndroidManifest.xml no contiene el atributo android:supportsRTL="true", entonces deberás marcar la casilla de verificación Update AndroidManifest.xml.
    • Si la targetSdkVersion de tu app es 17 o superior, selecciona Replace Left/Right Properties with Start/End Properties. En este caso, tus propiedades deberían incluir "start" y "end" en lugar de "left" y "right". Por ejemplo, android:paddingLeft cambia por android:paddingStart.
    • Si la targetSdkVersion de tu app es 16 o inferior, selecciona Generate -v17 Versions. En este caso, tu XML debe usar ambos conjuntos de propiedades. Por ejemplo, tu XML debería usar android:paddingLeft y android:paddingStart.
  2. Para mostrar la ventana Find Refactoring Preview, haz clic en Run.

    Figura 12: Revisa la vista previa.

  3. Haz clic en Do Refactor.

Puedes obtener más información sobre cómo refactorizar tu proyecto para que admita RTL en Compatibilidad con RTL nativa en Android 4.2.

Propiedades de dirección del diseño y del texto

En la ventana "Properties" del lado derecho, se encuentran las propiedades textDirection, que puedes usar con los widgets de texto, y las propiedades layoutDirection, que puedes usar con los widgets de diseño, para cambiar la dirección del texto y los componentes de diseño. Las propiedades de dirección se enumeran en la ventana Properties del lado derecho y funcionan con API nivel 17 o superior.

Si quieres ver el cambio de dirección de texto y la duplicación del diseño, también deberás refactorizar el proyecto para que admita RTL. En inglés, el cambio de dirección de texto solo mueve los signos de puntuación del lado derecho al lado izquierdo del texto, por ejemplo "Hello World!" cambia por "Hello World". Para ver el cambio de texto LTR a RTL, deberás usar un idioma RTL en tu app. Si deseas usar inglés y ver el cambio de texto a RTL a modo de prueba, usa las pseudo configuraciones regionales, ya que son independientes del comando de refactorización y de las propiedades de dirección.

Para acceder a las propiedades de dirección y usarlas, haz lo siguiente:

  1. En Layout Editor, selecciona un widget de texto.
  2. Abre la ventana Properties y busca la propiedad RTL que quieras usar.

    Para configurar el valor de la propiedad, selecciona una de las siguientes opciones:

    • firstStrong: Corresponde al valor predeterminado de la vista raíz. El primer carácter direccional fuerte determina la dirección del párrafo. Si no hay ningún carácter direccional fuerte, la dirección del párrafo es la dirección de diseño determinada de la vista.
    • anyRtl: Si contiene un carácter RTL fuerte, la dirección del párrafo es RTL; por el contrario, si contiene un carácter LTR fuerte, es LTR. Si no hay ninguno, la dirección del párrafo será la dirección del diseño determinada de la vista.
    • ltr: La dirección del párrafo es LTR.
    • rtl: La dirección del párrafo es RTL.
    • locale: La dirección del párrafo proviene de la configuración regional del sistema.
    • inherit: Es el valor predeterminado. Usa la dirección configurada en el elemento superior.
  3. Para revisar el texto y el diseño revertidos, ejecuta la app.

Pseudo configuraciones regionales

Una pseudo configuración regional es una configuración regional ficticia diseñada para adoptar las características de los idiomas que generan problemas con la IU, el diseño, la dirección RTL y otros problemas que surgen al traducir una app. Estas proporcionan traducciones instantáneas y automáticas para todos los mensajes localizables que pueden leerse en inglés. De esta manera, es posible captar mensajes que no se pueden traducir en el código fuente.

Para obtener más información sobre cómo usar pseudo configuraciones regionales, consulta Cómo probar tu app con pseudo configuraciones regionales.