Tipi di carattere in Xamarin.Forms

Per impostazione predefinita, Xamarin.Forms usa un tipo di carattere di sistema definito da ogni piattaforma. Tuttavia, i controlli che visualizzano testo definiscono le proprietà che è possibile usare per modificare questo tipo di carattere:

• FontAttributes, di tipo FontAttributes, che è un'enumerazione con tre membri: None, Bolde Italic. Il valore predefinito di questa proprietà è None.
• FontSize, di tipo double.
• FontFamily, di tipo string.

Queste proprietà sono supportate da BindableProperty oggetti, il che significa che possono essere destinazioni di data binding e stili.

Impostare gli attributi del tipo di carattere

I controlli che visualizzano testo possono impostare la FontAttributes proprietà per specificare gli attributi del tipo di carattere:

<Label Text="Italics"
       FontAttributes="Italic" />
<Label Text="Bold and italics"
       FontAttributes="Bold, Italic" />

Il codice C# equivalente è il seguente:

Label label1 = new Label
{
    Text = "Italics",
    FontAttributes = FontAttributes.Italic
};

Label label2 = new Label
{
    Text = "Bold and italics",
    FontAttributes = FontAttributes.Bold | FontAttributes.Italic
};    

Impostare le dimensioni del carattere

I controlli che visualizzano testo possono impostare la FontSize proprietà per specificare le dimensioni del carattere. La FontSize proprietà può essere impostata direttamente su un double valore o da un NamedSize valore di enumerazione:

<Label Text="Font size 24"
       FontSize="24" />
<Label Text="Large font size"
       FontSize="Large" />

Il codice C# equivalente è il seguente:

Label label1 = new Label
{
    Text = "Font size 24",
    FontSize = 24
};

Label label2 = new Label
{
    Text = "Large font size",
    FontSize = Device.GetNamedSize(NamedSize.Large, typeof(Label))
};

In alternativa, il Device.GetNamedSize metodo ha un override che specifica il secondo argomento come Element:

Label myLabel = new Label
{
    Text = "Large font size",
};
myLabel.FontSize = Device.GetNamedSize(NamedSize.Large, myLabel);

Per altre informazioni sulle dimensioni dei caratteri denominate, vedere Informazioni sulle dimensioni dei caratteri denominate.

Impostare la famiglia di caratteri

I controlli che visualizzano testo possono impostare la FontFamily proprietà su un nome di famiglia di caratteri, ad esempio "Times Roman". Tuttavia, questo funzionerà solo se la famiglia di caratteri è supportata nella piattaforma specifica.

Esistono diverse tecniche che possono essere usate per tentare di derivare i tipi di carattere disponibili in una piattaforma. Tuttavia, la presenza di un file di carattere TTF (True Type Format) non implica necessariamente una famiglia di caratteri e le funzioni TTFS sono spesso incluse che non sono destinate all'uso nelle applicazioni. Inoltre, i tipi di carattere installati in una piattaforma possono cambiare con la versione della piattaforma. Pertanto, l'approccio più affidabile per specificare una famiglia di caratteri consiste nell'usare un tipo di carattere personalizzato.

I tipi di carattere personalizzati possono essere aggiunti al Xamarin.Forms progetto condiviso e utilizzati dai progetti di piattaforma senza alcun lavoro aggiuntivo. A tale scopo, seguire questa procedura:

1. Aggiungere il tipo di carattere al Xamarin.Forms progetto condiviso come risorsa incorporata (Azione di compilazione: EmbeddedResource).
2. Registrare il file del tipo di carattere con l'assembly, in un file come AssemblyInfo.cs, usando l'attributo ExportFont . È anche possibile specificare un alias facoltativo.

L'esempio seguente mostra il tipo di carattere Lobster-Regular registrato con l'assembly, insieme a un alias:

using Xamarin.Forms;

[assembly: ExportFont("Lobster-Regular.ttf", Alias = "Lobster")]

Il tipo di carattere può quindi essere utilizzato in ogni piattaforma facendo riferimento al nome, senza l'estensione di file:

<!-- Use font name -->
<Label Text="Hello Xamarin.Forms"
       FontFamily="Lobster-Regular" />

In alternativa, può essere usato in ogni piattaforma facendo riferimento al relativo alias:

<!-- Use font alias -->
<Label Text="Hello Xamarin.Forms"
       FontFamily="Lobster" />

Il codice C# equivalente è il seguente:

// Use font name
Label label1 = new Label
{
    Text = "Hello Xamarin.Forms!",
    FontFamily = "Lobster-Regular"
};

// Use font alias
Label label2 = new Label
{
    Text = "Hello Xamarin.Forms!",
    FontFamily = "Lobster"
};

Gli screenshot seguenti mostrano il tipo di carattere personalizzato:

Impostare le proprietà del tipo di carattere per ogni piattaforma

Le OnPlatform classi e On possono essere usate in XAML per impostare le proprietà del tipo di carattere per ogni piattaforma. L'esempio seguente imposta diverse famiglie di caratteri e dimensioni in ogni piattaforma:

<Label Text="Different font properties on different platforms"
       FontSize="{OnPlatform iOS=20, Android=Medium, UWP=24}">
    <Label.FontFamily>
        <OnPlatform x:TypeArguments="x:String">
            <On Platform="iOS" Value="MarkerFelt-Thin" />
            <On Platform="Android" Value="Lobster-Regular" />
            <On Platform="UWP" Value="ArimaMadurai-Black" />
        </OnPlatform>
    </Label.FontFamily>
</Label>

La Device.RuntimePlatform proprietà può essere utilizzata nel codice per impostare le proprietà del tipo di carattere per ogni piattaforma

Label label = new Label
{
    Text = "Different font properties on different platforms"
};

label.FontSize = Device.RuntimePlatform == Device.iOS ? 20 :
    Device.RuntimePlatform == Device.Android ? Device.GetNamedSize(NamedSize.Medium, label) : 24;
label.FontFamily = Device.RuntimePlatform == Device.iOS ? "MarkerFelt-Thin" :
   Device.RuntimePlatform == Device.Android ? "Lobster-Regular" : "ArimaMadurai-Black";

Per altre informazioni sulla fornitura di valori specifici della piattaforma, vedere Fornire valori specifici della piattaforma. Per informazioni sull'estensione OnPlatform di markup, vedere Estensione di markup OnPlatform.

Informazioni sulle dimensioni dei caratteri denominate

Xamarin.Forms definisce i campi nell'enumerazione NamedSize che rappresentano dimensioni specifiche del carattere. La tabella seguente mostra i NamedSize membri e le relative dimensioni predefinite in iOS, Android e la piattaforma UWP (Universal Windows Platform) (UWP):

I valori delle dimensioni vengono misurati in unità indipendenti dal dispositivo. Per altre informazioni, vedere Unità di misura.

Visualizzare le icone dei tipi di carattere

Le icone dei tipi di carattere possono essere visualizzate dalle Xamarin.Forms applicazioni specificando i dati dell'icona del carattere in un FontImageSource oggetto . Questa classe, che deriva dalla ImageSource classe , ha le proprietà seguenti:

• Glyph: valore carattere Unicode dell'icona del carattere, specificato come .string
• Size : valore double che indica le dimensioni, in unità indipendenti dal dispositivo, dell'icona del tipo di carattere di cui è stato eseguito il rendering. Il valore predefinito è 30. Inoltre, questa proprietà può essere impostata su una dimensione del carattere denominata.
• FontFamily : oggetto string che rappresenta la famiglia di caratteri a cui appartiene l'icona del carattere.
• Color : valore facoltativo Color da utilizzare durante la visualizzazione dell'icona del carattere.

I dati del tipo di carattere possono essere visualizzati da qualsiasi visualizzazione in grado di visualizzare un oggetto ImageSource. Questo approccio consente la visualizzazione di icone dei tipi di carattere, ad esempio emoji, da più visualizzazioni, anziché limitare la visualizzazione dell'icona del carattere a una singola visualizzazione di presentazione del testo, ad esempio .Label

L'esempio XAML seguente include un'icona a forma di carattere singola visualizzata da una Image visualizzazione:

<Image BackgroundColor="#D1D1D1">
    <Image.Source>
        <FontImageSource Glyph="&#xf30c;"
                         FontFamily="{OnPlatform iOS=Ionicons, Android=ionicons.ttf#}"
                         Size="44" />
    </Image.Source>
</Image>

Questo codice visualizza un'icona XBox, dalla famiglia di tipi dicaratterei, in una Image visualizzazione. Si noti che mentre il carattere Unicode per questa icona è \uf30c, deve essere preceduto da un carattere di escape in XAML e quindi diventa . Il codice C# equivalente è il seguente:

Image image = new Image { BackgroundColor = Color.FromHex("#D1D1D1") };
image.Source = new FontImageSource
{
    Glyph = "\uf30c",
    FontFamily = Device.RuntimePlatform == Device.iOS ? "Ionicons" : "ionicons.ttf#",
    Size = 44
};

Gli screenshot seguenti mostrano diverse icone dei tipi di carattere visualizzate da un layout associabile:

Collegamenti correlati

• Specificare valori specifici della piattaforma
• Estensione di markup OnPlatform
• Layout associabili