Tradurre un'applicazione web in arabo o in ebraico è la parte facile. La parte difficile è che l'intera pagina deve leggersi da destra a sinistra: la barra laterale passa dall'altra parte, gli stepper contano da destra, i fumetti della chat si scambiano di posto, un albero rientra nell'altra direzione. Farlo a mano significa un attributo dir, una build diversa di Bootstrap e una seconda versione di ogni regola CSS personalizzata che hai mai scritto.
sgcHTML in sgcWebSockets 2026.10 fa tutto questo per te. Scegli la lingua e il layout la segue.
Una riga
uses
sgcHTML_Locale;
sgcHTMLSetLanguage(htmlLangArabic);
Questo porta i testi integrati dei componenti in arabo, come prima, e ora anche la direzione di ogni pagina che generi in seguito. Se torni a qualsiasi altra lingua, le pagine sono di nuovo da sinistra a destra.
Oppure solo il codice lingua
Non ti serve una traduzione integrata per ottenere il layout. Se la lingua della pagina è una lingua da destra a sinistra, basta questo:
Site.Lang := 'he'; { Hebrew: right-to-left, no other change }
sgcHTML riconosce arabo, ebraico, persiano, urdu, pashto, yiddish, dhivehi, uiguro, curdo centrale e sindhi, con o senza regione, quindi funzionano anche ar-EG e he-IL.
Cosa cambia nella pagina
- Il tag
<html>ricevedir="rtl". - La pagina carica il foglio di stile da destra a sinistra di Bootstrap al posto di quello normale. È incorporato nella libreria e servito su
/bootstrap.rtl.min.css, e l'opzione CDN passa alla copia sulla CDN. Un percorso di foglio di stile tuo viene lasciato intatto. - I componenti sgcHTML si specchiano: la barra laterale del sito e la barra di icone, gli stepper, la timeline, la chat, la presenza, la vista ad albero, lo slider, lo splitter, il ridimensionamento delle colonne della grid e le colonne bloccate, le notifiche, gli avatar e la bacheca kanban.
- Grafici, indicatori, strumenti e l'asse temporale del Gantt mantengono volutamente la loro geometria. Una scala di valori o una linea del tempo sono dati, non un ordine di lettura.
Le pagine da sinistra a destra non cambiano
Lo specchiamento è realizzato con regole aggiuntive che si applicano solo all'interno di una pagina da destra a sinistra. Nessuna regola esistente è stata riscritta, quindi una pagina in inglese genera esattamente lo stesso markup di prima e continua a funzionare nei vecchi browser incorporati che non capiscono le più recenti proprietà logiche del CSS.
Forzare una direzione
La scelta automatica può sempre essere sovrascritta. Dir sul componente site, e HtmlDir sul page builder, sulla pagina di login e sul template Bootstrap, accettano 'rtl' o 'ltr'. Lasciali vuoti per la scelta automatica.
Site.Lang := 'ar';
Site.Dir := 'ltr'; { Arabic text, left-to-right layout }
C++Builder e .NET
C++Builder usa le stesse unit. La versione .NET ha la stessa funzionalità, con lo stesso output:
sgcHTMLLocaleFactory.sgcHTMLSetLanguage(TsgcHTMLLanguage.htmlLangArabic);
site.Lang = "ar";
site.Dir = ""; // empty means automatic
Provalo
La nuova demo 22.RTL mostra una pagina in inglese, arabo ed ebraico, con un link che forza il layout da sinistra a destra per poterli confrontare. È disponibile in due versioni per Delphi, costruita nel codice in Demos\60.HTML\01.RunTime\22.RTL e costruita da form in Demos\60.HTML\02.DesignTime\22.RTL, e in C# in demos\60.HTML\22.RTL. Puoi anche aprirla online.
Consulta la pagina del prodotto sgcHTML per l'elenco completo dei componenti.
Leggi anche
Guardalo
Su questo c'è un breve video sul canale eSeGeCe.
Domande, feedback o aiuto con la migrazione? Mettiti in contatto. Riceverai una risposta da chi ha scritto il codice.