Cenni preliminari sulle funzionalità bidirezionali di WPF

Articolo
09/12/2008

Aggiornamento: novembre 2007

A differenza di altre piattaforme di sviluppo, in WPF sono disponibili molte funzionalità che supportano lo sviluppo rapido di un contenuto bidirezionale, ad esempio, la presenza contemporanea di dati da sinistra a destra e da destra a sinistra nello stesso documento. Allo stesso tempo, in WPF viene offerta un'esperienza eccellente per gli utenti che richiedono funzionalità bidirezionali, ad esempio gli utenti che utilizzano l'arabo e l'ebraico.

Nelle sezioni seguenti vengono illustrate molte funzionalità bidirezionali con i relativi esempi in cui viene descritto come ottenere la migliore visualizzazione di un contenuto bidirezionale. Nella maggior parte degli esempi viene utilizzato XAML, tuttavia si possono facilmente applicare i concetti al codiceC# o Microsoft Visual Basic.

Nel presente argomento sono contenute le seguenti sezioni.

FlowDirection
FlowDocument
Elementi Span
FlowDirection con elementi non di testo
Sostituzione numerica

FlowDirection

La proprietà di base che definisce la direzione di flusso del contenuto in un'applicazione WPF è FlowDirection. Questa proprietà può essere impostata su uno dei due valori di enumerazione, LeftToRight o RightToLeft. La proprietà è disponibile in tutti gli elementi WPF che ereditano da FrameworkElement.

Nota

In tutte le immagini presentate in questo argomento viene mostrato il codice e il relativo rendering nello strumento XAMLPad. Inoltre, nella maggior parte dei casi, viene fornito un esempio scaricabile.

Negli esempi seguenti viene impostata la direzione di flusso di un elemento TextBox.

Direzione di flusso da sinistra a destra.

<TextBlock Background="DarkBlue" Foreground="LightBlue" 
   FontSize="20" FlowDirection="LeftToRight">
        This is a left-to-right TextBlock
</TextBlock>

Direzione di flusso da destra a sinistra.

<TextBlock Background="LightBlue" Foreground="DarkBlue"
   FontSize="20" FlowDirection="RightToLeft">
        This is a right-to-left TextBlock
</TextBlock>

Per un esempio completo, vedere Esempio di direzione RightToLeft e RightToLeft.

Nell'immagine seguente viene mostrato il rendering del codice precedente.

Immagine che illustra la direzione di flusso

Allineamento TextBlock

Un elemento all'interno di una struttura ad albero dell'interfaccia utente erediterà FlowDirection dal relativo contenitore. Nell'esempio seguente, TextBlock si trova all'interno di Grid, che risiede in Window. L'impostazione di FlowDirection per Window implica la sua impostazione anche per Grid e TextBlock.

Nell'esempio seguente viene illustrata l'impostazione di FlowDirection.

<Window
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="FlowDirectionApp.Window1"
    Title="BidiFeatures" Height="200" Width="700" 
    FlowDirection="RightToLeft">

    <Grid>
      <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
      </Grid.ColumnDefinitions>
      <TextBlock Grid.Column="0" >
          This is a right-to-left TextBlock
      </TextBlock>

      <TextBlock Grid.Column="1" FlowDirection="LeftToRight">
          This is a left-to-right TextBlock
      </TextBlock>
    </Grid>
</Window>

L'oggetto Window di primo livello dispone di RightToLeft FlowDirection, pertanto anche tutti gli elementi contenuti in esso ereditano lo stesso oggetto FlowDirection. Affinché un elemento esegua l'override di un oggetto FlowDirection specificato, deve aggiungere una modifica di direzione esplicita, ad esempio il cambiamento del secondo oggetto TextBlock dell'esempio precedente in LeftToRight. Se non viene definito nessun oggetto FlowDirection, viene applicato l'oggetto LeftToRight predefinito.

Per un esempio completo, vedere Esempio FlowDirection.

Nell'immagine seguente viene mostrato l'output dell'esempio precedente.

Immagine che illustra la direzione di flusso assegnata in modo esplicito

Illustrazione della direzione del flusso

FlowDocument

Molte piattaforme di sviluppo, ad esempio HTML, Win32 e Java™ forniscono un supporto particolare per lo sviluppo di contenuto bidirezionale. I linguaggi di markup, ad esempio HTML offrono agli autori dei contenuti il markup necessario per visualizzare il testo in qualsiasi direzione richiesta, ad esempio con il tag HTML 4.0, "dir" accetta "rtl" o "ltr" come valori. Questo tag è simile alla proprietà FlowDirection, ma la proprietà FlowDirection funziona in un modo più avanzato per eseguire il layout del contenuto testuale e può essere utilizzata per un contenuto diverso dal testo.

In WPF, FlowDocument è un elemento dell'interfaccia utente versatile che consente l'hosting di una combinazione di testo, tabelle, immagini e altri elementi. Nell'esempio presentato nelle sezioni seguenti viene utilizzato questo elemento.

L'aggiunta di testo a FlowDocument può essere eseguita in molti modi. Uno di quelli più semplici è rappresentato da Paragraph, vale a dire un elemento a livello di blocco utilizzato per raggruppare il contenuto, ad esempio un testo. Per aggiungere un testo agli elementi di livello inline riportati negli esempi, utilizzare Span e Run. Span è un elemento del contenuto del flusso di livello inline utilizzato per raggruppare altri elementi inline, mentre Run è un elemento del contenuto del flusso di livello inline destinato a contenere un'esecuzione di testo non formattato. Span può generare più elementi Run.

Nel primo esempio di documento è contenuto un documento che dispone di un numero di nomi per la condivisione di rete. Ad esempio \\server1\folder\file.ext. Indipendentemente dal fatto che questo collegamento di rete si trovi in un documento in arabo o in inglese, si desidera che venga sempre visualizzato nello stesso modo. Nell'immagine seguente viene mostrato il collegamento nel documento RightToLeft arabo.

Immagine che illustra l'utilizzo dell'elemento Span

Documento con flusso da destra a sinistra

Dal momento che il testo è RightToLeft, tutti i caratteri speciali, ad esempio "\", separano il testo in un ordine da destra a sinistra. Di conseguenza il collegamento non viene visualizzato nell'ordine corretto, pertanto per risolvere il problema, il testo deve essere incorporato al fine di conservare un oggetto Run separato che scorre LeftToRight. Invece di disporre di un oggetto Run separato per ciascuna lingua, un modo migliore per risolvere il problema consiste nell'incorporare il testo inglese utilizzato meno frequentemente in un oggetto Span arabo più grande.

Questa condizione è illustrata nell'immagine seguente.

Immagine che illustra l'utilizzo dell'elemento Run in un elemento Span

Schermata di XamlPad

Nell'esempio seguente viene illustrato l'utilizzo degli elementi Run e Span nei documenti.

<Page
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    FlowDirection="RightToLeft">

  <FlowDocument>
    <Paragraph>
      <Span FlowDirection="RightToLeft" >
        ستجد الملف هنا:
        <Run FlowDirection="LeftToRight">
           \\server1\filename\filename1.txt</Run>
        ثم باقى النص!
      </Span>
    </Paragraph>
  </FlowDocument>
</Page>

Per un esempio completo, vedere Esempio RunSpan.

Elementi Span

L'elemento Span funziona come un separatore di limiti tra i testi con diverse direzioni di flusso. Persino gli elementi Span con la stessa direzione di flusso dispongono di diversi ambiti bidirezionali, vale a dire che gli elementi Span vengono ordinati in base all'oggetto FlowDirection del contenitore e solo il contenuto dell'elemento Span segue FlowDirection di Span.

Nell'immagine seguente viene mostrata la direzione di flusso di diversi elementi TextBlock.

Immagine che illustra la direzione di flusso in diversi elementi TextBlock

Blocchi di testo con direzioni di flusso diverse

Nell'esempio seguente viene illustrato come utilizzare elementi Span e Run per ottenere i risultati mostrati nell'immagine precedente.

<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation">
  <StackPanel >

    <TextBlock FontSize="20" FlowDirection="RightToLeft">
      <Run FlowDirection="LeftToRight">العالم</Run>
      <Run FlowDirection="LeftToRight" Foreground="Red" >فى سلام</Run>
    </TextBlock>

    <TextBlock FontSize="20" FlowDirection="LeftToRight">
      <Run FlowDirection="RightToLeft">العالم</Run>
      <Run FlowDirection="RightToLeft" Foreground="Red" >فى سلام</Run>
    </TextBlock>

    <TextBlock FontSize="20" Foreground="Blue">العالم فى سلام</TextBlock>

    <Separator/>

    <TextBlock FontSize="20" FlowDirection="RightToLeft">
      <Span Foreground="Red" FlowDirection="LeftToRight">Hello</Span>
      <Span FlowDirection="LeftToRight">World</Span>
    </TextBlock>

    <TextBlock FontSize="20" FlowDirection="LeftToRight">
      <Span Foreground="Red" FlowDirection="RightToLeft">Hello</Span>
      <Span FlowDirection="RightToLeft">World</Span>
    </TextBlock>

    <TextBlock FontSize="20" Foreground="Blue">Hello World</TextBlock>

  </StackPanel>

</Page>

Per un esempio di codice completo, vedere Esempio Span.

Negli elementi TextBlock dell'esempio, gli elementi Span vengono disposti in base a FlowDirection degli elementi padre, tuttavia il testo di ciascun elemento Span scorre in base a FlowDirection. Questa condizione può essere applicata all'alfabeto latino e arabo oppure a qualsiasi altra lingua.

Aggiunta di xml:lang

Nell'immagine seguente viene mostrato un altro esempio in cui vengono utilizzati numeri ed espressioni aritmetiche, ad esempio "200,0 + 21,4 = 221,4". Notare che è stato impostato solo l'oggetto FlowDirection.

Immagine che visualizza i numeri che utilizzano solo la direzione di flusso

Numeri con flusso da destra a sinistra

Gli utenti di questa applicazione rimarranno delusi dall'output, poiché anche se l'oggetto FlowDirection è corretto, la forma dei numeri non corrisponde a quella dei numeri arabi.

Gli elementi XAML ereditano una proprietà XML denominata Gestione di xml:lang in XAML (Language come alias) che definisce la lingua di ciascun elemento. Nell'esempio precedente, dal momento che non era stata definita nessuna lingua per l'elemento Run o per qualsiasi altro elemento di primo livello, è stata utilizzato l'oggetto Language predefinito, vale a dire en-US. L'algoritmo interno per la definizione dei numeri di Windows Presentation Foundation (WPF) seleziona i numeri nell'oggetto Language corrispondente, in questo caso l'inglese. Per eseguire correttamente il rendering dei numeri arabi, è necessario impostare Gestione di xml:lang in XAML (Language).

Nell'immagine seguente viene illustrato l'esempio con la proprietà Language aggiunta.

Immagine che illustra l'utilizzo dell'attributo xml:lang

Numeri arabi con flusso da destra a sinistra

Nell'esempio seguente viene aggiunto l'oggetto Gestione di xml:lang in XAML (Language) all'applicazione.

<Page
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    FlowDirection="RightToLeft">
      <FlowDocument>
         <Paragraph>
            <Span FlowDirection="RightToLeft" Language="ar-SA">
              العملية الحسابية: "200.0+21.4=221.4"
            </Span>
         </Paragraph>
      </FlowDocument>
</Page>

Per un esempio completo, vedere Esempio LanguageAttribute.

Prestare attenzione ai diversi valori Language delle lingue che dipendono dalla regione di destinazione, ad esempio "ar-SA" e "ar-EG" che rappresentano due varianti dell'arabo. Negli esempi precedenti viene illustrata la necessità di definire sia la proprietà Language (xml:lang), sia la proprietà FlowDirection.

FlowDirection con elementi non di testo

FlowDirection non definisce solo la modalità di scorrimento del testo in un elemento testuale, ma anche la direzione di flusso di quasi tutti gli elementi dell'interfaccia utente. Nell'immagine seguente viene mostrato un oggetto ToolBar che utilizza un oggetto LinearGradientBrush orizzontale per disegnare lo sfondo.

Immagine che illustra una barra degli strumenti con una sfumatura da sinistra a destra

Schermata della sfumatura

Dopo aver impostato l'oggetto FlowDirection su RightToLeft, i pulsanti ToolBar vengono disposti da destra a sinistra e LinearGradientBrush riallinea gli offset in modo che scorrano da destra a sinistra.

Nell'immagine seguente viene mostrato il riallineamento di LinearGradientBrush.

Immagine che illustra una barra degli strumenti con una sfumatura da destra a sinistra

Sfumatura con flusso da destra a sinistra

Nell'esempio seguente viene disegnato un oggetto RightToLeft ToolBar. (per disegnarlo da sinistra a destra, rimuovere l'attributo FlowDirection da ToolBar.

<Page
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml">

  <ToolBar FlowDirection="RightToLeft" Height="50" DockPanel.Dock="Top">
    <ToolBar.Background>
      <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,1">
        <LinearGradientBrush.GradientStops>
          <GradientStop Color="DarkRed" Offset="0" />
          <GradientStop Color="DarkBlue" Offset="0.3" />
          <GradientStop Color="LightBlue" Offset="0.6" />
          <GradientStop Color="White" Offset="1" />
        </LinearGradientBrush.GradientStops>
      </LinearGradientBrush>
    </ToolBar.Background>

    <Button FontSize="12" Foreground="White">Button1</Button>
    <Rectangle Width="20"/>
    <Button FontSize="12" Foreground="White">Button2</Button>
    <Rectangle Width="20"/>
    <Button FontSize="12" Foreground="White">Button3</Button>
    <Rectangle Width="20"/>
    <Button FontSize="12" Foreground="White">Button4</Button>
    <Rectangle Width="20"/>
  </ToolBar>
</Page>

Per un esempio completo, vedere Esempio di oggetto sfumato.

Eccezioni di FlowDirection

Esistono alcuni casi in cui FlowDirection non si comporta nel modo previsto. In questa sezione vengono illustrate due di queste eccezioni.

Image

Image rappresenta un controllo che visualizza un'immagine. In XAML, questo oggetto può essere utilizzato con una proprietàSource che definisce l'Uniform Resource Identifier (URI) di Image da visualizzare.

A differenza di altri elementi dell'interfaccia utente, Image non eredita FlowDirection dal contenitore. Tuttavia, se l'oggetto FlowDirection è impostato in modo esplicito su RightToLeft, un oggetto Image viene visualizzato capovolto in senso orizzontale. Questa condizione viene implementata come una funzionalità utile per gli sviluppatori di contenuti bidirezionali, poiché, in alcuni casi, il capovolgimento in senso orizzontale dell'immagine genera l'effetto desiderato.

Nell'immagine seguente viene mostrato un oggetto Image capovolto.

Immagine che illustra un'immagine capovolta

Schermata di XamlPad

Nell'esempio seguente viene dimostrato che Image non riesce a ereditare l'oggetto FlowDirection da StackPanel che lo contiene. Nota È necessario disporre di un file denominato ms_logo.jpg nell'unità C:\ per eseguire questo esempio.

<StackPanel 
  xmlns='https://schemas.microsoft.com/winfx/2006/xaml/presentation' 
  FlowDirection="RightToLeft">

  <Image Source="file://c:/ms_logo.jpg" 
         Width="147" Height="50"/>
  <Separator Height="10"/>
  <Image Source="file://c:/ms_logo.jpg" 
         Width="147" Height="50" FlowDirection="LeftToRight" />
  <Separator Height="10"/>
  <Image Source="file://c:/ms_logo.jpg" 
         Width="147" Height="50" FlowDirection="RightToLeft"/>
</StackPanel>

Per un esempio completo, vedere Esempio Image. Nota Nei file scaricati è incluso un file ms_logo.jpg. Nel codice si presuppone che il file con estensione jpg non si trovi all'interno del progetto, ma in un'altra posizione dell'unità C:\. È necessario copiare il file con estensione jpg dai file di progetto nell'unità C:\ oppure modificare il codice affinché la ricerca venga eseguita all'interno del progetto. A tale scopo, modificare Source="file://c:/ms_logo.jpg" in Source="ms_logo.jpg".

Percorsi

Oltre a Image, un altro elemento interessante è Path. Path è un oggetto che consente di disegnare una serie di righe e curve collegate. Si comporta in modo simile a Image per quanto riguarda FlowDirection; ad esempio RightToLeft FlowDirection è un'immagine speculare orizzontale di LeftToRight. Tuttavia, a differenza di Image, Path eredita FlowDirection dal contenitore che non deve essere specificato in modo esplicito.

Nell'esempio seguente viene disegnata una semplice freccia con 3 righe. La prima freccia eredita la direzione di flusso di RightToLeft da StackPanel in modo che i punti iniziali e finali vengano misurati da una radice posizionata sul lato destro. La seconda freccia dispone di un oggetto RightToLeft FlowDirection esplicito e inizia dal lato destro. Tuttavia, la radice iniziale della terza freccia è collocata sul lato sinistro. Per ulteriori informazioni sul disegno, vedere LineGeometry e GeometryGroup.

<StackPanel 
  xmlns='https://schemas.microsoft.com/winfx/2006/xaml/presentation' 
  FlowDirection="RightToLeft">

  <Path Stroke="Blue" StrokeThickness="4">
    <Path.Data>
      <GeometryGroup >
        <LineGeometry StartPoint="300,10" EndPoint="350,30" />
        <LineGeometry StartPoint="10,30" EndPoint="352,30" />
        <LineGeometry StartPoint="300,50" EndPoint="350,30" />
      </GeometryGroup>
    </Path.Data>
  </Path>

  <Path Stroke="Red" StrokeThickness="4" FlowDirection="RightToLeft">
    <Path.Data>
      <GeometryGroup >
        <LineGeometry StartPoint="300,10" EndPoint="350,30" />
        <LineGeometry StartPoint="10,30" EndPoint="352,30" />
        <LineGeometry StartPoint="300,50" EndPoint="350,30" />
      </GeometryGroup>
    </Path.Data>
  </Path>

  <Path Stroke="Green" StrokeThickness="4" FlowDirection="LeftToRight">
    <Path.Data>
      <GeometryGroup >
        <LineGeometry StartPoint="300,10" EndPoint="350,30" />
        <LineGeometry StartPoint="10,30" EndPoint="352,30" />
        <LineGeometry StartPoint="300,50" EndPoint="350,30" />
      </GeometryGroup>
    </Path.Data>
  </Path>
</StackPanel>

Per un esempio completo, vedere Esempio di oggetto Path.

Nell'immagine seguente viene mostrato l'output dell'esempio precedente.

Immagine che illustra le frecce disegnate utilizzando l'elemento Path

Percorsi

Image e Path sono due esempi del modo in cui Windows Presentation Foundation (WPF) utilizza FlowDirection. Oltre a disporre gli elementi dell'interfaccia utente in una direzione specifica all'interno di un contenitore, l'oggetto FlowDirection può essere utilizzato con elementi quali InkPresenter che esegue il rendering dell'input penna sulla superficie, su LinearGradientBrush e su RadialGradientBrush. Se è necessario che il comportamento da destra a sinistra del contenuto simuli un comportamento da sinistra a destra o viceversa, in Windows Presentation Foundation (WPF) è disponibile tale funzionalità.

Sostituzione numerica

Storicamente, in Windows è sempre stata supportata la sostituzione numerica, consentendo la rappresentazione di diverse forme di tipo linguistico per le stesse cifre e mantenendo unificata, per le diverse impostazioni internazionali, la memoria interna di queste cifre, ad esempio i numeri vengono memorizzati con i noti valori esadecimali, 0 x 40, 0 x 41, ma visualizzati in base alla lingua selezionata.

In questo modo, le applicazioni hanno potuto elaborare i valori numerici senza dover convertirli da una lingua a un'altra, ad esempio un utente può aprire un foglio di calcolo di Microsoft Excel in un Windows localizzato in arabo e visualizzare i numeri in arabo, ma anche aprirlo nella versione europea di Windows visualizzando la rappresentazione europea degli stessi numeri. Questa condizione è necessaria anche per altri simboli, quali i separatori virgola e il simbolo della percentuale, poiché sono spesso associati a numeri nello stesso documento.

In Windows Presentation Foundation (WPF) è stata mantenuta la stessa tradizione e aggiunto un ulteriore supporto a questa funzionalità che consente un maggiore controllo dell'utente sul momento e sulla modalità di utilizzo della sostituzione. Sebbene questa funzionalità sia stata progettata per tutte le lingue, è particolarmente utile per i contenuti bidirezionali in cui la definizione delle cifre per una lingua specifica rappresenta solitamente una sfida per gli sviluppatori di applicazioni, a causa delle diverse impostazioni cultura con cui un'applicazione può essere eseguita.

La proprietà principale che controlla il funzionamento della sostituzione numerica in Windows Presentation Foundation (WPF) è la proprietà di dipendenza Substitution. La classe NumberSubstitution specifica la modalità di visualizzazione dei numeri nel testo. Dispone di tre proprietà pubbliche che ne definiscono il comportamento. Di seguito è riportato un riepilogo di tutte le proprietà.

CultureSource:

Questa proprietà specifica come vengono determinate le impostazioni cultura per i numeri. Accetta uno dei tre valori di enumerazione di NumberCultureSource.

Override: le impostazioni cultura del numero sono quelle della proprietà CultureOverride.
Text: le impostazioni cultura del numero sono quelle della sequenza di testo. Nel markup, si tratterebbe di Gestione di xml:lang in XAML o del relativo alias Language. Inoltre, si tratta del valore predefinito per le classi che derivano da FrameworkContentElement. Tali classi includono System.Windows.Documents.Paragraph, System.Windows.Documents.Table, System.Windows.Documents.TableCell e così via.
User: le impostazioni cultura del numero sono quelle del thread corrente. Questa proprietà è quella predefinita per tutte le sottoclassi di FrameworkElement, ad esempio Page, Window e TextBlock.

CultureOverride:

La proprietà CultureOverride viene utilizzata solo se la proprietà CultureSource è impostata su Override, in caso contrario viene ignorata. Specifica le impostazioni cultura del numero. Un valore pari a null, vale a dire il valore predefinito, viene interpretato come en-US.

Substitution:

Questa proprietà specifica il tipo di sostituzione numerica da eseguire. Accetta uno dei seguenti valori di enumerazione di NumberSubstitutionMethod:

AsCulture: il metodo di sostituzione viene determinato in base alla proprietà NumberFormatInfo.DigitSubstitution delle impostazioni cultura del numero. Questa è l'impostazione predefinita.
Context: se le impostazioni cultura del numero sono in arabo o in farsi, specifica che le cifre dipendono dal contesto.
European: il rendering dei numeri viene sempre eseguito come cifre europee.
NativeNational: il rendering dei numeri viene eseguito utilizzando le cifre nazionali per le impostazioni cultura del numero, come specificato dalla proprietà NumberFormatInfo delle impostazioni cultura.
Traditional: il rendering dei numeri viene eseguito utilizzando le cifre tradizionali per le impostazioni cultura del numero. Per la maggior parte delle impostazioni cultura, questo valore è uguale a NativeNational. Tuttavia, i valori NativeNational sono rappresentati da cifre latine per alcune impostazioni cultura arabe, mentre questo valore viene rappresentato in cifre arabe per tutte le impostazioni cultura arabe.

Significato dei valori per uno sviluppatore di contenuti bidirezionali Nella maggior parte dei casi, lo sviluppatore deve solo definire FlowDirection e la lingua di ciascun elemento testuale dell'interfaccia utente, ad esempio Language="ar-SA" e logica NumberSubstitution gestisce la visualizzazione dei numeri in base all'interfaccia utente corretta. Nell'esempio seguente viene illustrato l'utilizzo dei numeri arabi e inglesi in un'applicazione Windows Presentation Foundation (WPF) che esegue una versione araba di Windows.

<Page 
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml" >
  <StackPanel>
   <TextBlock Background="LightGreen" FontSize="32" 
      Language="ar-SA" FlowDirection="RightToLeft">1+2=3</TextBlock>
   <TextBox Background="LightGreen" FontSize="32" 
      Language="ar-SA" FlowDirection="RightToLeft">1+2=3</TextBox>
   <TextBlock Background="LightBlue" FontSize="32">1+2=3</TextBlock>
   <TextBox Background="LightBlue" FontSize="32">1+2=3</TextBox>
 </StackPanel>
</Page>

Nell'immagine seguente viene mostrato l'output dell'esempio precedente se viene eseguita una versione araba di Windows.

Immagine che illustra i numeri arabi e inglesi visualizzati

Schermata di XamlPad con numeri

Per un esempio completo, vedere Esempio relativo ai numeri.

FlowDirection era importante in questo caso, poiché l'impostazione di FlowDirection su LeftToRight avrebbe prodotto cifre europee. Nelle sezioni seguenti viene descritto come ottenere una visualizzazione unificata delle cifre in tutto il documento. Se questo esempio non è in esecuzione su una versione araba di Windows, tutte le cifre vengono visualizzate come cifre europee.

Definizione delle regole di sostituzione

In un'applicazione reale, è necessario impostare l'oggetto Language a livello di codice. Ad esempio, si può impostare l'attributo Language (xml:lang) in modo che sia uguale a quello utilizzato dall'interfaccia utente del sistema oppure modificare l'oggetto Language in base allo stato applicazione.

Se si desidera apportare modifiche in base allo stato applicazione, utilizzare altre funzionalità fornite da Windows Presentation Foundation (WPF).

Innanzitutto, scegliere l'impostazione NumberSubstitution.CultureSource=“Text” del componente dell'applicazione. L'utilizzo di questa impostazione garantisce che le impostazioni non provengano dall'interfaccia utente per gli elementi di testo che dispongono di "User" come valore predefinito, ad esempio TextBlock.

Ad esempio:

<TextBlock

Name="text1" NumberSubstitution.CultureSource="Text">

1234+5679=6913

</TextBlock>

Nel codice C# corrispondente, impostare, ad esempio, la proprietà Language su "ar-SA".

text1.Language =

System.Windows.Markup.XmlLanguage.GetLanguage("ar-SA");

Se è necessario impostare la proprietà Language sulla lingua dell'interfaccia utente dell'utente corrente, utilizzare il codice seguente.

text1.Language =

System.Windows.Markup.XmlLanguage.GetLanguage(

System.Globalization.CultureInfo.CurrentUICulture.IetfLanguageTag);

CurrentCulture rappresenta le impostazioni cultura attuali utilizzate dal thread corrente in fase di esecuzione.

L'esempio XAML finale deve essere simile all'esempio seguente.

<Page x:Class="WindowsApplication.Window1"
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    Title="Code Sample" Height="300" Width="300"
>
    <StackPanel>
      <TextBlock Language="ar-SA" 
         FlowDirection="RightToLeft">عربى: 1+2=3
      </TextBlock>
      <TextBlock Language="ar-SA" 
         FlowDirection="RightToLeft" 
         NumberSubstitution.Substitution="European">عربى: 1+2=3 
      </TextBlock>
    </StackPanel>
</Page>

Per un esempio completo, vedere Esempio relativo ai numeri2.

L'esempio C# finale deve essere simile all'esempio seguente.

namespace BidiTest
{
    public partial class Window1 : Window
    {

        public Window1()
        {
            InitializeComponent();

            string currentLanguage = 
                System.Globalization.CultureInfo.CurrentCulture.IetfLanguageTag;

            text1.Language = System.Windows.Markup.XmlLanguage.GetLanguage(currentLanguage);

            if (currentLanguage.ToLower().StartsWith("ar"))
            {
                text1.FlowDirection = FlowDirection.RightToLeft;
            }
            else
            {
                text1.FlowDirection = FlowDirection.LeftToRight;
            }
        }
    }
}

Per l'esempio completo, vedere Esempio NumbersCSharp.

Nell'immagine seguente viene illustrato l'aspetto della finestra per entrambi i linguaggi di programmazione.

Immagine che visualizza i numeri arabi

Numeri arabi

Utilizzo della proprietà Substitution

Il funzionamento della sostituzione numerica in Windows Presentation Foundation (WPF) dipende dall'oggetto Language dell'elemento di testo e da FlowDirection. Se l'oggetto FlowDirection viene mantenuto a destra, viene eseguito il rendering delle cifre europee. Tuttavia, se è preceduto da un testo arabo o se l'oggetto Language è impostato su "ar" e FlowDirection è RightToLeft, viene eseguito il rendering delle cifre arabe.

In alcuni casi, tuttavia, è possibile creare un'applicazione unificata utilizzando, ad esempio, le cifre europee per tutti gli utenti oppure cifre arabe nelle celle Table con un oggetto Style specifico. Tale operazione può essere eseguita facilmente utilizzando la proprietà Substitution.

Nell'esempio seguente, per il primo oggetto TextBlock non è stata impostata la proprietà Substitution, pertanto nell'algoritmo vengono visualizzate le cifre arabe, come previsto. Tuttavia, nel secondo oggetto TextBlock, la sostituzione viene impostata su European, eseguendo l'override della sostituzione predefinita per i numeri arabi, e vengono visualizzate le cifre europee.

<Page x:Class="WindowsApplication.Window1"
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    Title="Code Sample" Height="300" Width="300"
>
    <StackPanel>
      <TextBlock Language="ar-SA" 
         FlowDirection="RightToLeft">عربى: 1+2=3
      </TextBlock>
      <TextBlock Language="ar-SA" 
         FlowDirection="RightToLeft" 
         NumberSubstitution.Substitution="European">عربى: 1+2=3 
      </TextBlock>
    </StackPanel>
</Page>

Per un esempio completo, vedere Esempio relativo ai numeri3.