Windows приложения с использованием xaml могут быть написаны на языке

Обновлено: 01.07.2024

1428 дн. с момента
ДО КОНЦА СЕМЕСТРА

2. XAML

Введение в язык XAML

Возможность отделить графический интерфейс от логики приложения, благодаря чему над разными частями приложения могут относительно автономно работать разные специалисты: над интерфейсом - дизайнеры, над кодом логики - программисты.

Компактность, понятность, код на XAML относительно легко поддерживать.

При компиляции приложения в Visual Studio код в xaml-файлах также компилируется в бинарное представление кода xaml, которое называется BAML (Binary Application Markup Language). И затем код baml встраивается в финальную сборку приложения - exe или dll-файл.

Структура и пространства имен XAML

При создании нового проекта WPF он уже содержит файлы с кодом xaml. Так, создаваемый по умолчанию в проекте файл MainWindow.xamlбудет иметь следующую разметку:

Если вы совершенно не знакомы с xaml и с xml, то даже этот небольшой минимальный код окна может вызывать затруднения.

Подобно структуре веб-страничке на html, здесь есть некоторая иерархия элементов. Элементов верхнего уровня является Window , который представляет собой окно приложения. При создании других окон в приложении нам придется всегда начинать объявление интерфейса с элемента Window, поскольку это элемент самого верхнего уровня.

Кроме Window существует еще два элемента верхнего уровня:

Элемент Window имеет вложенный пустой элемент Grid , а также подобно html-элементам ряд атрибутов (Title, Width, Height) - они задают заголовок, ширину и высоту окна соответственно.

Пространства имен XAML

Чтобы задействовать элементы в XAML, мы также подключаем пространства имен. Вторая и третья строчки как раз и представляют собой пространства имен, подключаемые в проект по умолчанию. А атрибут xmlns представляет специальный атрибут для определения пространства имен в XML.

http://schemas.microsoft.com/winfx/2006/xaml - это пространство имен, которое определяет некоторые свойства XAML, например свойство Name или Key. Используемый префикс x в определении xmlns:x означает, что те свойства элементов, которые заключены в этом пространстве имен, будут использоваться с префиксом x - x:Name или x:Key . Это же пространство имен используется уже в первой строчке x:Class="XamlApp.MainWindow" - здесь создается новый класс MainWindow и соответствующий ему файл кода, куда будет прописываться логика для данного окна приложения.

Это два основных пространства имен. Рассмотрим остальные:

xmlns:d="http://schemas.microsoft.com/expression/blend/2008" : предоставляет поддержку атрибутов в режиме дизайнера. Это пространство имен преимущественно предназначено для другого инструмента по созданию дизайна на XAML - Microsoft Expression Blend

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" : обеспечивает режим совместимости разметок XAML. В определении объекта Window двумя строчками ниже можно найти его применение:

Это выражение позволяет игнорировать парсерам XAML во время выполнения приложения дизайнерские атрибуты из пространства имен с префиксом d , то есть из "http://schemas.microsoft.com/expression/blend/2008"

xmlns:local="clr-namespace:XamlApp" : пространство имен текущего проекта. Так как в моем случае проект называется XamlApp, то простраство имен называется аналогично. И через префикс local я смогу получить в XAML различные объекты, которые я определил в проекте.

Компактность, понятность, код на XAML относительно легко поддерживать.

Структура и пространства имен XAML

При создании нового проекта WPF он уже содержит файлы с кодом xaml. Так, создаваемый по умолчанию в проекте файл MainWindow.xaml будет иметь следующую разметку:

Кроме Window существует еще два элемента верхнего уровня:

Пространства имен XAML

Это два основных пространства имен. Рассмотрим остальные:

Рынок приложений очень широк. К примеру, Магазин Windows работает в 230 странах и доступен на 106 языках, но лишь около 7 % приложений локализованы более чем на один язык. Рассмотрим следующий момент.

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

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

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

Я разделил эту статью на две части.

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

Цель этих статей — обобщить информацию, необходимую для создания многоязыковых приложений на XAML. Большая часть рекомендаций и сведений о функциях применимы как к Windows 8, так и к 8.1, если в тексте не указано, что функциональность применима исключительно к Windows 8.1.

Выбор языка и региона

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

Многоязычные пользователи могут задать несколько языков в Панели управления или в новом приложении «Параметры ПК». Например:

Приложение «Параметры ПК», отображающее выбор языка

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

Редактор манифеста Visual Studio, демонстрирующий язык по умолчанию

Отправка запроса к упорядоченному списку языков возможна во время работы приложения с помощью:

Соответствующий язык, использующийся чаще всего (в зависимости от полноты локализации приложения для этого языка) — ApplicationLanguages.Languages[0]. Этот язык применяется также для ресурсов, предоставляемых Windows через API для локализации, например модулей форматирования даты и времени.

Несмотря на то что приложение «разговаривает» на одном языке, пользователь может вводить содержимое на другом языке, а также менять клавиатуры/IME с помощью сочетания клавиш Win + пробел. Например, он может использовать англоязычную версию Windows, но общаться с членами семьи в социальном приложении на японском языке. Запросить текущий язык и регион ввода можно следующим образом:

string currentInputLanguage = Windows.Globalization.Language.CurrentInputMethodLanguageTag;

Кроме языка, очень важно учитывать региональный формат даты, времени, чисел и валют. Например, в США дата в сокращенном виде обычно записывается как месяц/день/год, а в Великобритании — день/месяц/год. Так что даже если вы не локализовали приложение для британского английского, возможно, стоит учесть регион при форматировании даты, времени, чисел и валют.

Выбор шрифта и резервные шрифты

Выбор шрифта по умолчанию

При отображении текста с использованием любых элементов управления XAML, например TextBlock, RichTextBlock, TextBox или RichTextBox, шрифт для него можно задать с помощью свойства «семейство шрифтов». Значение свойства по умолчанию, если шрифт не задан в элементе управления или через стиль, — Segoe UI. Файл generic.xaml отвечает за стили по умолчанию для элементов управления и шаблонов. Раньше он входил в состав Windows SDK в виде отдельного файла; но в предварительной версии Windows 8.1 встроен прямо в инфраструктуру XAML. Файл generic.xaml содержит ресурс FontFamily, называющийся ContentControlThemeFontFamily. Его значение — Segoe UI, и он используется в качестве шрифта для названных стилей TextBlock, а также как шрифт по умолчанию для элементов управления пользовательского интерфейса.

Резервные шрифты

Шрифты, поставляемые с Windows, совместно охватывают большую часть символов, определенных в Unicode. Однако по отдельности каждый шрифт не поддерживает все символы, которые могут встретиться в содержимом приложения. Если фрагмент текста содержит символы, не определенные в выбранном шрифте, текстовая система XAML находит подходящий шрифт с поддержкой этих символов и использует его. Эта система по большей части работает автоматически, однако некоторые восточноазиатские языки имеют общие коды Unicode для символов, но немного различаются по отображению. Чтобы система резервных шрифтов понимала, каким шрифтом отображать символ, ей необходимо знать, какой язык используется.

В XAML язык интерфейса — это свойство, наследуемое по дереву пользовательского интерфейса. После того как это свойство установлено для элемента, оно применяется ко всем дочерним элементам, если они не задают значения языка отдельно. В разметке язык может быть задан с помощью атрибута xml:lang; например, в MainPage.xaml это выглядит так:

В программном коде язык можно задать с помощью свойства Language. Ниже приведен код, который задает язык в качестве языка приложения из механизма сопоставления, описанного выше. Пример из app.xaml.cs:

Рекомендации. Задайте язык или через API, как указано выше, или в разметке через локализацию с помощью механизма x:Uid. В части 2 мы будем обсуждать x:Uid.

API шрифта для языка

Windows содержит API, позволяющие определить подходящие шрифты для различных целей отображения в различных языках. Объект LanguageFontGroup имеет набор свойств, предоставляющих подходящие шрифты для различных сценариев. Например, в таблице ниже показаны семейства шрифтов и толщина букв для нескольких языков.

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

LanguageFontGroup API можно использовать для запроса подходящих шрифтов в XAML. Следующий код, например, обновляет ресурс ContentControlThemeFontFamily значением из свойства UIText языка приложения. Это делается в app.xaml и поэтому выполняется до создания интерфейса. Обратите внимание — я делаю это в OnWindowCreated, поскольку при наличии нескольких окон каждое окно находится в собственном потоке, а ресурсы у каждого потока — свои.

Справа налево и двунаправленные

Не все языки используют систему написания слева направо, как английский и другие европейские языки. Арабский и иврит используют направление справа налево, и для этого в макете необходимо отзеркаливать интерфейс. К примеру, приложение «Карты» выглядит так:

Слева направо
Справа налево

XAML позволяет задавать направление элементов интерфейса, наследуемых от FrameworkElement, с помощью свойства FlowDirection. Данное свойство наследуется по визуальному дереву и применяется к большинству элементов. Исключения — Image и иконка AppBarButton.

XAML не задает FlowDirection автоматически в зависимости от языка. Приложение должно самостоятельно сделать это в программном коде или через локализацию. Чтобы динамически назначать FlowDirection в зависимости от языка программы, используйте следующий код на MainPage.xaml или других страницах:

Чтобы воспользоваться локализацией, примените x:Uid на элементе Page и задайте направление через файл ресурсов resw. Подробнее о x:Uid будет рассказано в части 2.

Двунаправленность и текст

Направление справа налево влияет на макет и презентацию текста. В языках с таким написанием текст читается справа налево. Внутри одного абзаца могут содержаться куски текста с написанием слева направо и справа налево. Алгоритм Unicode устанавливает правила отображения подобного текста.

Согласно спецификациям Unicode, каждому символу назначается направленность и сила. К примеру, латинские символы (A–Z) имеют сильное левое направление, арабские символы — сильное правое направление, европейские числа слабые, а знаки пунктуации и пробелы нейтральные.

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

Если двунаправленный текст содержит куски смешанного текста с направлением справа налево и слева направо, направление текста управляет относительным макетом каждого отрывка текста. В случае с направлением справа налево блоки текста располагаются справа налево. Возьмем, к примеру, следующий текст: «Ahmad and Hiba are hiking». Когда эти имена переводятся на язык урду:

В памяти и на диске строка остается в таком виде:

Обзор памяти в Visual Studio, демонстрирующий строку. Обратите внимание, что символы языка урду расположены в обратном порядке

Для текстовых элементов управления XAML содержимое отдельных блоков текста располагается в зависимости от их направления, а FlowDirection используется для управления порядком блоков. Пример кода и разметки:

Будет отображен в виде:

Диаграмма, демонстрирующая отображение текста в режимах слева направо и справа налево

Элементы управления для отображения текста

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

Для решения этой проблемы у элементов управления TextBlock и RichTextBlock есть новое свойство TextReadingOrder, в качестве значения которого можно присвоить DetectFromContent. Когда свойство задано, оно выполняет итерацию по всему содержимому в поисках первого сильного символа, а затем использует его для общего направления, переопределяя направление потока. Данное свойство не влияет на горизонтальное выравнивание, которое определяется свойствами FlowDirection и HorizontalAlignment.

Код выше отображает результаты в следующем виде:

Так получается потому, что первый символ с сильным направлением использует написание справа налево.

Элементы управления вводом текста

Если список языков, добавленных пользователем в Настройки ПК/Контрольную панель, включает двунаправленный язык, то после выхода/входа в систему Windows пользователь может управлять направлением текста:

На клавиатуре: нажав сочетание клавиш Левый Ctrl + Shift для режима ввода слева направо и Правый Ctrl + Shift для режима справа налево.
На экранной клавиатуре: нажав кнопку Ctrl, а затем кнопку направления:

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

Элемент управления RichEditBox сохраняет направление каждого абзаца в соответствии с разметкой RTF. Вы можете запросить направление определенного диапазона с помощью:

SideBar: поэкспериментируйте с различными опциями двунаправленного текста, включив визуализацию управляющих символов Unicode через контекстное меню в Блокноте и вставив их в нужном месте.

Изображения

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

Вы можете повернуть изображение, задав FlowDirection=RightToLeft прямо в теге image, через программный код или локализацию. Воспользуйтесь загрузчиком ресурсов для выбора другого изображения, если текст направлен справа налево. Делается это с помощью квалификатора направления макета; к примеру, в нем содержатся два изображения: mylogo.jpg и mylogo.layoutdir-RTL.jpg, последнее используется для направления справа налево.

Текстовые глифы в кнопках

Если вы создаете кнопки так, чтобы они соответствовали стилю Windows, с иконкой внутри круга, могут возникнуть следующие проблемы:

Кнопки наследуют стиль направления справа налево, что может вызвать конфликт с интервалами символов для получения корректного пересечения. Если вы используете AppBarButton, она не будет применять направление справа налево для области глифов; таким образом, эта проблема решается.
Глифы-иконки не отражаются автоматически, поэтому если вы используете стрелки направления, то должны переназначить привязку глифов для выбора другого направления, поскольку списки имеют направление справа налево для этого направления макета.

Подведем итоги

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

Получить первоначальное представление о назначении и области применения языка XAML , составить представление о структуре XAML -документа, изучить основные синтаксические конструкции.

Основные сведения о языке XAML

XAML базируется на языке расширенной разметки XML (Extensible Markup Language) и его синтакс определяется следующими правилами [ 3 ] :

Язык XAML характеризуется самоописанием. Каждый элемент в XAML -документе представляет имя типа (такие как Button, Window или Page ) в рамках заданного пространства имен. Атрибуты элементов используются для задания свойств ( Name, Height, Width и т.п.) и событий ( Click, Load и т.д.) соответствующих объектов.

При создании WPF-приложения MyFirstWpfProject VisualStudio генерирует следующий XAML -документ.

XAML -документ WPF-приложения MyFirstWpfProject начинается с дескриптора < Window...>. Все дескрипторы XAML -документа начинаются символами <, а завершаются символами >. Любой XAML -документ состоит из XAML -элементов. Каждый XAML -документ ( XAML -элемент) начинается открывающимся дескриптором (например < Window >), за которым следует содержимое документа (например, текстовая строка или другие XAML -элементы). В открывающем дескрипторе могут присутствовать описания атрибутов (например, Class, xmlns, Title, Height, Width и др.). XAML -документ ( XAML -элемент) должен завершаться закрывающимся дескриптором (например, /> или < /Window >). Текст XAML -документа должен содержать один корневой элемент – элемент верхнего уровня вложенности. В XAML -документе WPF-приложения MyFirstWpfProject таким элементом является < Window >. В корневой элемент могут быть добавлены другие XAML -элементы. В рассматриваемом XAML -документе это элемент < Grid >.

В процессе компиляции XAML -документа WPF-приложения синтаксический анализатор переводит XAML файлы в файлы языка двоичной разметки приложений BAML ( Binary Application Markup Language ), которые затем встраиваются в виде ресурсов в сборку проекта. Для построения классов WPF-приложения синтаксический анализатор использует пространство имен, которое определено в корневом дескрипторе XAML -документа.

Пространство имен в XAML -документе задается с помощью атрибута xmlns. В приведенном выше документе объявлено два базовых пространства имен:

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" – это базовое пространство имен WPF, которое охватывает все классы WPF, включая элементы управления, которые применяются при построении пользовательского интерфейса. Так как данное пространство имен объявлено без префикса, то оно распространяется на весь XAML -документ;
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" – пространство имен XAML . Оно включает различные свойства утилит XAML , которые позволяют влиять на то, как XAML -документ следует интерпретировать. Данное пространство имен отображается на префикс x. Этот префикс можно помещать перед именем элемента ( x:ИмяЭлемента ).

Второе пространство имен используется для включения специфичных для XAML лексем – "ключевых слов" [ [ 9 ] ]. В табл.1.1 приведены наиболее часто используемые ключевые слова XAML .

В WPF-приложениях кроме базовых применяют специальные, необязательные пространства имен:

В атрибуты объекта Window могут быть добавлены следующие XAML -описания.

Данное XAML -описание объявляет необязательные пространства имен с префиксами mc и d. Свойства DesignHeight и DesignWidth находятся в пространстве имен, помеченном префиксом d. Данные свойства определяют, что во время разработки проекта приложения в дизайнере Visual Studio окно должно иметь размеры 300x600. Свойство Ignorable находится в пространстве имен, помеченном префиксом mc, и информирует синтаксический анализатор о том, что он должен игнорировать часть XAML -документа, помеченные префиксом d.

Префикс ( command ) используется для ссылки на пространство имен в XAML -документе. Лексеме clr-namespace присваивается название пространства имен . NET в сборке.

Для описания класса в XAML -документе используется атрибут Class . Строка XAML -документа

предписывает создать класс MyFirstWpfProject.MainWindow на базе класса Window. Префикс x атрибута Class определяет то, что данный атрибут помещается в пространство имен XAML . Класс MainWindow генерируется автоматически во время компиляции . Для части класса автоматически генерируется код (частичный (partial) класс ):

Когда выполняется компиляция приложения, XAML - файл , который определяет пользовательский интерфейс ( MainWindow.xaml ), транслируется в объявление типа CLR , которое объединяется с логикой приложения из файла класса отдельного кода ( MainWindow.xaml.cs ).

Метод InitializeComponent() генерируется во время компиляции приложения и в исходном коде не присутствует.

Для программного управления элементами управления, описанными в XAML -документе необходимо для элемента управления задать XAML атрибут Name. Так для задания имени элементу Grid необходимо записать следующую разметку:

Простые свойства задаются в XAML -документе в соответствии со следующим синтаксисом:

Например, Name = "grid1"

При необходимости задать свойство, которое является полноценным объектом, используются сложные свойства в соответствии с синтаксисом "свойство-элемент":

Например, для контейнера StackPanel нам необходимо задать градиентную кисть для заливки панели, что определяется атрибутом Background. Это реализуется с помощью дескрипторов <StackPanel.Background> . . . </StackPanel.Background> .

Для задания значения свойства из выделенного класса используется расширение разметки, которое обеспечивает расширение грамматики XAML новой функциональностью. Расширения разметки могут использоваться во вложенных дескрипторах или в XAML -атрибутах. Когда это используется в атрибутах, то необходимо применять фигурные скобки <. >.

Расширения разметки используют следующий синтаксис :

Расширения разметки реализуются классами, дочерними от класса System.Windows.Markup.MarkupExtention. Базовый класс MarkupExtention имеет метод ProvideValue(), который предоставляет нужное значение для атрибута. Например, для задания атрибуту Foreground объекта Button статического свойства, определенного в другом классе, необходимо создать следующее XAML -описание.

При компиляции синтаксический анализатор создаст экземпляр класса Static Extention, затем вызовет метод ProvideValue(), который извлечет нужное значение и установит его для свойства Foreground.

Расширения разметки могут использоваться как вложенные свойства.

Присоединенные свойства описывают свойства, которые могут применяться к нескольким элементам управления, но которые определены в другом классе. В WPF-приложениях присоединенные свойства часто используются для управления компоновкой элементов интерфейса. Синтаксис присоединенных свойств следующий.

Например, если необходимо расположить кнопку в нулевой строке сетки, то необходимо сделать следующее XAML -описание.

Здесь присоединенным свойством является Grid.Row, то есть свойство Row элемента Grid, которое не является свойством объекта Button. Свойство Row присоединяется к свойствам объекта Button, поскольку данный объект располагается в контейнере Grid.

Атрибуты объектов могут использоваться для присоединения обработчиков событий, используя следующий синтаксис .

Например, для кнопки событию её нажатия Click можно установить обработчик события Exit_Click.

Определяя в XAML -описании обработчик Exit_Click, необходимо в коде класса иметь метод с корректной сигнатурой. Ниже приведен код, который генерируется автоматически при создании описания обработчика события в XAML -описании.

Ключевые термины

Язык расширенной разметки приложений XAML , язык двоичной разметки приложений BAML, XAML -документ, XAML -элемент, корневой элемент XAML -документа, дескриптор , язык двоичной разметки приложений, синтаксический анализатор, базовое пространство имен XAML -документа, ключевые слова XAML , лексема clr-namespace, префикс в XAML -документе, простое свойство в XAML -документе, сложное свойство в XAML -документе, расширение разметки в XAML -документе, присоединенные свойства в XAML -документе, присоединение обработчиков событий в XAML -документе.

Краткие итоги

В данной теме были рассмотрены основные синтаксические конструкции языка XAML и приведены простые примеры их реализации. Проектирование WPF-приложений требует от разработчика понимания структуры и содержания XAML -документа, описывающего интерфейс создаваемой системы. В последующих темах курса будут рассматриваться различные аспекты построения WPF- и Silverlight -приложений и необходимым условием эффективной работы создателя таких систем является знание основ языка XAML .

Читайте также: