• Статья
  • Чтение занимает 4 мин

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

Руководство по макетам

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

В связи с этими отличиями в размерах переведенного текста мы рекомендуем не использовать абсолютное позиционирование, фиксированную ширину и фиксированную высоту в пользовательском интерфейсе (UI). Вместо этого используйте преимущества механизмов динамической компоновки макета, которые встроены в элементы пользовательского интерфейса Windows. Например, элементы управления содержимым (такие как кнопки), элементы управления компонентами (например, представления сетки и представления списка) и панели содержимого (например, сетки и элементы StackPanel) по умолчанию автоматически изменяют размер и адаптируются в соответствии с содержимым. Псевдолокализация приложения помогает выявить все проблемные случаи, когда элементы пользовательского интерфейса не совпадают по размерам с содержимым.

Динамический макет является рекомендуемым способом, и вы сможете использовать его в большинстве случаев. Менее предпочтительным, но все же более приемлемым, чем жесткое указание размеров в разметке пользовательского интерфейса, является способ с установкой значений макета в виде функции языка. Вот пример того, как предоставить свойство Width в вашем приложении в качестве ресурса, который локализаторы могут задать соответствующим образом для каждого языка. Сначала в файл ресурсов (.resw) вашего приложения добавьте идентификатор свойства с именем TitleText.Width (вместо TitleText можно использовать любое имя). Затем используйте x:Uid, чтобы связать один или несколько элементов UI с идентификатором этого свойства.

<TextBlock x:Uid="TitleText">

Дополнительные сведения об использовании файлов ресурсов (.resw), идентификаторов свойств и x:Uid см. в разделе Локализация строк в манифесте пакета приложения и интерфейсе пользователя.

Fonts

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

Зеркальное отображение изображений

Если приложение содержит изображения, которые должны быть отражены (то есть, можно просто отразить то же самое изображение) для написания справа налево, можно использовать свойство FlowDirection.

<!-- en-USlocalized.xaml -->
<Image ... FlowDirection="LeftToRight" />

<!-- ar-SAlocalized.xaml -->
<Image ... FlowDirection="RightToLeft" />

Если вашему приложению требуется другое изображение для правильного отражения, можно использовать систему управления ресурсами с квалификатором LayoutDirection (см. раздел LayoutDirection в статье LayoutDirection). Система выбирает изображение с именем file.layoutdir-rtl.png, когда в качестве языка среды выполнения приложения (см. раздел file.layoutdir-rtl.png) выбран язык с написанием справа налево. Этот подход может применяться, если одна часть изображения зеркально отражается, а другая — нет.

Обработка языков с написанием справа налево (RTL)

Если ваше приложение локализуется для языков с написанием справа налево (RTL), используйте свойство FrameworkElement.FlowDirection и задавайте симметричные поля и заполнение. Панели макета, такие как Grid, автоматически масштабируются и зеркально отражаются путем задания свойства FlowDirection.

Задайте FlowDirection для корневой панели макета (или кадра) на странице или для самой страницы. В результате все элементы управления внутри этого элемента унаследуют это свойство.

Важно!

Тем не менее, FlowDirectionне задается автоматически на основании выбранного языка интерфейса пользователя в параметрах Windows, а также не изменяется динамически при изменении языка отображения пользователем. Например, если пользователь переключает параметры Windows с английского языка на арабский, то свойство FlowDirectionне выполняет автоматического переключения с написания слева направо на написание справа налево. Как разработчику приложения вам необходимо соответствующим образом задать FlowDirection для языка, который сейчас отображается.

Программный способ состоит в использовании свойства LayoutDirection выбранного языка интерфейса, чтобы задать свойство LayoutDirection (см. пример кода ниже). Большинство элементов управления в Windows уже используют FlowDirection. Если вы реализуете собственный элемент управления, он должен использовать свойство FlowDirection для соответствующего изменения макета для языков с написанием справа налево и слева направо.

this.languageTag = Windows.Globalization.ApplicationLanguages.Languages[0];

// For bidirectional languages, determine flow direction for the root layout panel, and all contained UI.

var flowDirectionSetting = Windows.ApplicationModel.Resources.Core.ResourceContext.GetForCurrentView().QualifierValues["LayoutDirection"];
if (flowDirectionSetting == "LTR")
{
    this.layoutRoot.FlowDirection = Windows.UI.Xaml.FlowDirection.LeftToRight;
}
else
{
    this.layoutRoot.FlowDirection = Windows.UI.Xaml.FlowDirection.RightToLeft;
}
#include <winrt/Windows.ApplicationModel.Resources.Core.h>
#include <winrt/Windows.Globalization.h>
...

m_languageTag = Windows::Globalization::ApplicationLanguages::Languages().GetAt(0);

// For bidirectional languages, determine flow direction for the root layout panel, and all contained UI.

auto flowDirectionSetting = Windows::ApplicationModel::Resources::Core::ResourceContext::GetForCurrentView().QualifierValues().Lookup(L"LayoutDirection");
if (flowDirectionSetting == L"LTR")
{
    layoutRoot().FlowDirection(Windows::UI::Xaml::FlowDirection::LeftToRight);
}
else
{
    layoutRoot().FlowDirection(Windows::UI::Xaml::FlowDirection::RightToLeft);
}
this->languageTag = Windows::Globalization::ApplicationLanguages::Languages->GetAt(0);

// For bidirectional languages, determine flow direction for the root layout panel, and all contained UI.

auto flowDirectionSetting = Windows::ApplicationModel::Resources::Core::ResourceContext::GetForCurrentView()->QualifierValues->Lookup("LayoutDirection");
if (flowDirectionSetting == "LTR")
{
    this->layoutRoot->FlowDirection = Windows::UI::Xaml::FlowDirection::LeftToRight;
}
else
{
    this->layoutRoot->FlowDirection = Windows::UI::Xaml::FlowDirection::RightToLeft;
}

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

Сначала в файл ресурсов (.resw) вашего приложения добавьте идентификатор свойства с именем «MainPage.FlowDirection» (вместо «MainPage» можно использовать любое имя). Затем используйте x:Uid, чтобы связать главный элемент Page (или его корневую панель макета, или кадр) с идентификатором этого свойства.

<Page x:Uid="MainPage">

Вместо одной строки кода для всех языков этот вариант зависит от переводчика, который должен надлежащим образом «перевести» этот ресурс свойства для каждого языка, поэтому имейте в виду, что при использовании этой методики возникают дополнительные возможности для человеческой ошибки.

Важные API

  • FrameworkElement. FlowDirection
  • LanguageFont
  • Локализация строк в манифесте пакета приложения и интерфейсе пользователя
  • Адаптация ресурсов с учетом языка, масштаба и других квалификаторов
  • Обзор языков профиля пользователя и языков манифеста приложения