Форматирование графика и разметка

Для форматирования графиков в приложении используется язык XAML (Extensible Application Markup Language). Выражения XAML содержат теги и атрибуты, тег TextBlock является наиболее важным.

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

Приведем простой пример: чтобы вывести текст По рудной зоне в качестве подзаголовка с применением курсива, вы могли бы ввести эту надпись во окно Вторичного заголовка:

<TextBlock><Italic>По рудной зоне</Italic></TextBlock>

Вот что означает отдельное выражение:

  • <TextBlock> - это тег, который подразумевает, что вы форматируете блок текста. Теги всегда содержат открывающие и закрывающие теги. Этот тег открывается с помощью <TextBlock> и закрывается с помощью </TextBlock>. Закрывающие теги всегда имеют такое же имя, как и открывающий тег, но при этом содержат впередистоящий символ “/”.
  • <Italic> - это тег, который применяет к шрифту стиль "курсив". Он открывается с помощью <Italic> и закрывается с помощью </Italic>.
  • Обратите внимание на то, как тег <Italic> размещается в пределах тега <TextBlock>. Внутренние открывающие и закрывающие теги должны находится в пределах внешних тегов, иначе форматирование будет некорректным.
  • По рудной зоне - это текст, который вы намерены вывести в просмотр. Выводятся все символы, находящиеся между самыми близкорасположенными внутренними тегами.

Теги <Bold> и <Underline> используются точно также, как и <Italic>:

<TextBlock><Bold>По</Bold> <Italic>рудной зоне</Italic> </TextBlock>

Более сложное форматирование

Вы применяете более сложное форматирование, устанавливая атрибуты <TextBlock>, вместо использования отдельных тегов. Ниже приведен первый пример, в котором вместо тегов используются атрибуты:

<TextBlock Text="По рудной зоне" FontStyle="Italic"/>

Сейчас здесь только один тег с несколькими атрибутами:

  • <TextBlock - это тот же тег, который вы видели ранее. На этот раз он открывается с помощью <TextBlock и закрывается с помощью />, эти символы являются сокращением к самозакрывающемуся тегу. Внутри него расположены два атрибута. Это самый простой способ открыть и закрыть тег при сложном форматировании.
  • Текст="По рудной зоне" - это текстовый атрибут, содержащий текст, который вы хотите видеть. В просмотр выводится все, что расположено между кавычек.
  • Стиль шрифта="Italic" - это атрибут, который применяет к шрифту курсив. Слова должны быть расположены между кавычками.

Другие полезные атрибуты перечислены ниже. Значения должны быть заключены в "двойные кавычки".

  • FontSize="18": Изменяет размер шрифта. Используйте любое целое значение. Несмотря на то, что размер шрифта представляет собой число, оно должно располагаться между кавычек.
  • FontFamily="Verdana": Изменяет шрифт. Используйте такие названия, как "Verdana" или "Calibri".
  • FontWeight="Bold": Делает шрифт жирным.
  • TextDecorations="Underline": Подчеркивает текст. Используйте "Underline" или "Strikethrough".
  • Foreground="Red": Изменяет цвет текста. Используйте простые названия, такие как "Red" или "Blue", либо шестнадцатиричные коды цветов, например "#FAC896".
  • Background="Blue": Изменяет фон текста. Здесь используются те же правила, что и для Foreground.
  • LineBreak: Разбивает текст в отдельные строки. Самозакрывающийся тег, таким образом: <LineBreak/>.
  • TextAlignment="Center": Выравнивает текст. Используйте "Center", "Left" или "Right". Применяется только к многострочному тексту (см. LineBreak).

Выполните поиск “html known color” (цвет, известный html) для списка именованных цветов.

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

Расширенное форматирование

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

Вы создаете интервал точно также, как и текстовый блок, с открывающим тегом <Span> и закрывающим тегом </Span>. После этого размещаете текст и атрибуты форматирования между этими тегами.

Например, для вывода в просмотр исходного подзаголовка с применением 18-точечного текста "рудной", выделенного жирным и окрашенного в красный цвет, вам необходимо изменить вводные данные на (читайте, как одну строку):

<TextBlock FontSize="18" FontStyle="Italic">По <Span Foreground="Red"

FontWeight="Bold">рудной</Span> зоне </TextBlock>

Блок текста имеет атрибуты FontSize="18" и FontStyle="Italic". В дополнение к этим атрибутам, пробел (span) добавляет Foreground="Red" и FontWeight="Bold", применяя к слову "рудной" жирный стиль отображения и окрашивая его в красный цвет. В связи с тем, что пробел задается в пределах блока текста, он наследует стиль этого текстового блока.

Вот как это будет выглядеть на графике:

По рудной зоне

Вам необходимо использовать полный вариант TextBlock, чтобы применить расширенное форматирование с интервалами. Для проверки ниже показана полная форма TextBlock (атрибуты удалены для наглядности):

<TextBlock>По рудной зоне</TextBlock>

Давайте вспомним, как TextBlock открывается с помощью <TextBlock> и закрывается с помощью </TextBlock>, отображаемый текст расположен между <> и </>. Эквивалентное (самозакрывающееся) сокращение будет следующим:

<TextBlock Text="По рудной зоне" />

Использование полной формы TextBlock делает возможным добавить Span, например (вновь без атрибутов):

<TextBlock>По <Span>рудной</Span> зоне</TextBlock>

Обратите внимание на то, как Span открывается и закрывается - точно также, как TextBlock.

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

<TextBlock>Классифицируется по <Span>рудной зоне</TextBlock></Span>

Практические аспекты

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

Чтобы заменить имеющуюся метку, нажмите на клавиши Ctrl+A и выберите текст в поле метки, после чего нажмите на Ctrl+V, чтобы вставить новую версию (предварительно скопировав данные из текстового редактора), таким образом вы перезапишете существующий текст.

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

Кнопка Применить будет доступна только после того, как вы выведете график в просмотр и откроете диалоговое окно (форму) из панели Просмотр слоев Визекса. По мере изменения каких-либо значений в форме, кнопка Применить будет активироваться/отключаться.

Диаграмма