Шрифты в Xamarin.Forms

По умолчанию используется системный шрифт Xamarin.Forms, определенный каждой платформой. Однако элементы управления, отображающие текст, определяют свойства, которые можно использовать для изменения этого шрифта:

  • FontAttributes типа FontAttributes, который является перечислением с тремя элементами: None, Bold и Italic. Значение по умолчанию этого свойства равно None.
  • Xamarin FontSize типа double.
  • FontFamily Xamarin типа string.

Эти свойства поддерживаются объектами BindableProperty, то есть эти свойства можно указывать в качестве целевых для привязки и стилизации данных.

Настройка атрибутов шрифта

Элементы управления, отображающие текст, могут задать FontAttributes свойство для указания атрибутов шрифта Xamarin:

<label text="Italics" fontattributes="Italic"></label>
<label text="Bold and italics" fontattributes="Bold, Italic"></label>

Эквивалентный код на C# выглядит так:

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


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

Установка размера шрифта

Элементы управления, отображающие текст, могут задать FontSize свойство для указания размера шрифта. Для FontSize свойства можно задать значение напрямую double или значение NamedSize перечисления:

<label text="Font size 24" fontsize="24"></label>
<label text="Large font size" fontsize="Large"></label>

Эквивалентный код на C# выглядит так:

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))
};

Кроме того, метод Device.GetNamedSize имеет переопределение, указывающее второй аргумент как: Element

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

Значение, указанное FontSize как a double, измеряется в единицах, независимых от устройства.

Настройка семейства шрифтов (Font Family Xamarin)

Элементы управления, отображающие текст, могут присвоить FontFamily свойству имя семейства шрифтов, например «Times Roman». Однако это будет работать только в том случае, если семейство шрифтов поддерживается на конкретной платформе.

Существует ряд методов, которые можно использовать для получения шрифтов, доступных на платформе. Однако наличие файла шрифта TTF (true Type Format) не обязательно подразумевает семейство шрифтов, и TTF часто включаются, которые не предназначены для использования в приложениях. Кроме того, шрифты, установленные на платформе, могут изменяться с помощью версии платформы. Поэтому наиболее надежным подходом к указанию семейства шрифтов является использование настраиваемого шрифта.

Пользовательские шрифты можно добавить в Xamarin.Forms общий проект и использовать в проектах платформы без каких-либо дополнительных работ. Чтобы этого добиться, выполните следующие действия.

  1. Добавьте шрифт в Xamarin.Forms общий проект в качестве внедренного ресурса (действие сборки: EmbeddedResource).
  2. Зарегистрируйте файл шрифта в сборке в файле, например AssemblyInfo.cs, с помощью атрибута ExportFont. Также можно указать необязательный псевдоним.

В следующем примере показан Lobster-Regular шрифт, зарегистрированный в сборке, а также псевдоним:

using Xamarin.Forms;


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

Шрифт может находиться в любой папке в общем проекте, не указывая имя папки при регистрации шрифта в сборке.

В Windows имя файла шрифта и имя шрифта могут отличаться. Чтобы найти имя шрифта в Windows, щелкните правой кнопкой мыши TTF-файл и выберите "Предварительный просмотр". Затем имя шрифта можно определить из окна предварительного просмотра.

Затем шрифт можно использовать на каждой платформе, ссылаясь на его имя без расширения файла:

<!-- Use font name -->
<label text="Hello Xamarin.Forms" fontfamily="Lobster-Regular"></label>

Кроме того, его можно использовать на каждой платформе, ссылаясь на его псевдоним:

<!-- Use font alias -->
<label text="Hello Xamarin.Forms" fontfamily="Lobster"></label>

Эквивалентный код на C# выглядит так:

// 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"
};

На следующих снимках экрана показан пользовательский шрифт:

Для сборки выпуска на Windows убедитесь, что сборка, содержащая пользовательский шрифт, передается в качестве аргумента в вызове Forms.Init метода.

Задание свойств шрифта для каждой платформы

Классы OnPlatform и On классы можно использовать в XAML для задания свойств шрифта для каждой платформы. В приведенном ниже примере задаются разные семейства шрифтов и размеры на каждой платформе:

<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>
            <on platform="Android" value="Lobster-Regular"></on>
            <on platform="UWP" value="ArimaMadurai-Black"></on>
        </onplatform>
    </label.fontfamily>
</label>

Свойство Device.RuntimePlatform можно использовать в коде для задания свойств шрифта для каждой платформы.

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";

Отображение значков шрифтов

Значки шрифта могут отображаться приложениями Xamarin.Forms , указывая данные значка шрифта в объекте FontImageSource . Этот класс, производный от ImageSource класса, имеет следующие свойства:

  • Glyph — значение символа юникода значка шрифта, указанное в виде символа string.
  • Sizedouble— значение, указывающее размер значка отрисованного шрифта в независимых от устройства единицах. Значение по умолчанию — 30. Кроме того, для этого свойства можно задать именованный размер шрифта.
  • FontFamily — представляет string семейство шрифтов, к которому принадлежит значок шрифта.
  • Color — необязательное Color значение, которое будет использоваться при отображении значка шрифта.

Эти данные используются для создания PNG, который может отображаться любым представлением, которое может отображаться ImageSource. Этот подход позволяет отображать значки шрифтов, такие как эмодзи, в нескольких представлениях, в отличие от ограничения отображения значка шрифта одним представлением текста, например Label.

Значки шрифтов в настоящее время можно указать только в представлении символов Юникода.

В следующем примере XAML отображается один значок шрифта в представлении Image:

<image backgroundcolor="#D1D1D1">
   <image.source>
     <fontimagesource glyph="&#xf30c;" fontfamily="{OnPlatform iOS=Ionicons, Android=ionicons.ttf#}" size="44"></fontimagesource>
   </image.source>
</image>

Этот код отображает значок XBox из семейства шрифтов Ionicons в представлении Image. Обратите внимание, что хотя символ юникода для этого значка является \uf30c, его необходимо экранировать в XAML и поэтому становится &#xf30c;. Эквивалентный код на C# выглядит так:

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

На следующих снимках экрана из примера "Привязываемые макеты" показаны несколько значков шрифтов, отображаемых привязываемым макетом:

Материалы по теме