Direita para Esquerda e Direção do Layout

Árabe, hebraico, persa e urdu são escritos da direita para a esquerda (RTL). Para essas pessoas, toda a interface deve ser espelhada: os botões de voltar da navegação apontam para a direita, as listas se alinham à borda direita e o progresso flui da direita para a esquerda. Oferecer suporte a RTL é uma parte essencial da internacionalização.

A regra de ouro é: projete usando inicial e final, em vez de esquerda e direita. O início da leitura é o lado inicial — à esquerda em inglês e à direita em árabe. Ao usar inicial e final, o sistema espelha seu layout automaticamente em RTL.

O SwiftUI expõe a direção atual por meio do valor de ambiente layoutDirection, que pode ser .leftToRight ou .rightToLeft. Leia esse valor quando precisar de uma lógica dependente da direção, como ao escolher um recurso chevron.

Muitos símbolos SF são espelhados automaticamente. Para imagens personalizadas direcionais, marque-as para que sejam invertidas conforme a direção do layout; assim, uma seta que aponta para a frente continuará apontando para a frente em RTL. O modificador flipsForRightToLeftLayoutDirection controla esse comportamento.

Às vezes, uma subvisualização precisa manter uma direção fixa — por exemplo, um número de telefone ou um trecho de código da esquerda para a direita dentro de um layout RTL. Substitua a direção usando o modificador environment(\.layoutDirection, _) apenas nessa subárvore.

Use .leading e .trailing também para o alinhamento do texto. Um parágrafo alinhado com .leading encosta automaticamente na borda direita em árabe. Evite .left/.right, pois eles nunca são invertidos.

Parágrafos RTL frequentemente incorporam trechos LTR, como URLs, números e nomes de marcas em inglês. O Algoritmo Bidirecional do Unicode trata a ordenação, mas você pode envolver trechos ambíguos com caracteres de isolamento direcional para evitar que sejam embaralhados visualmente.

Alguns controles — botões de reprodução de mídia e linhas do tempo — NÃO devem ser espelhados, pois seu significado é físico, não baseado na leitura. O semanticContentAttribute do UIKit — .playback, .spatial e .forceLeftToRight — informa ao sistema quando deve manter uma direção fixa.

Você não precisa de uma tradução para o árabe para testar o espelhamento. Execute o aplicativo com o pseudoidioma da direita para a esquerda na configuração de idioma do aplicativo no esquema. A interface será espelhada usando os textos existentes, permitindo identificar instantaneamente erros causados por .left/.right codificados diretamente.

Fique atento a estes problemas:

• Alinhamento ou preenchimento .left/.right codificado diretamente.
• Visualizações posicionadas manualmente usando deslocamentos x fixos.
• Imagens direcionais personalizadas que não são invertidas.
• Chevrons de voltar ou controles deslizantes apontando para o lado errado.
• Textos bidirecionais concatenados que ficam embaralhados.

Uma linha bem construída usa inicial e final em toda parte, permite que os símbolos sejam invertidos e força a direção apenas quando a semântica exige isso. Essa visualização não precisa de nenhuma alteração para ter a aparência correta em inglês e árabe.

Você aprendeu a oferecer suporte a idiomas escritos da direita para a esquerda:

• Projete usando inicial/final, nunca esquerda/direita.
• Leia o ambiente layoutDirection para obter a lógica dependente da direção.
• Inverta imagens direcionais; substitua a direção em subárvores fixas, como trechos de código ou números de telefone.
• Use semanticContentAttribute para controles de reprodução/espaciais que não devem ser espelhados.
• Teste com o pseudoidioma RTL antes de publicar.