017. Avalonia UI - Control Themes Styling

00:00 Исправление ошибок меню Меню не работает нужно исправить ошибку. Уменьшить размер заголовков и разместить меню так чтобы оно выглядело как другое меню. Выяснить причину сбоя при переплете. 01:00 Настройка открытия меню Сделать меню открытым по умолчанию. Установить значение список открыт равным true для постоянного отображения меню в модели просмотра. 02:10 Работа с диспетчером Добавить диспетчер для безопасного изменения пользовательского интерфейса. Переместить сетку и базовый элемент управления в поток диспетчера. Убедиться что анимационная галочка остаётся в потоке пользовательского интерфейса. 04:11 Стилизация интерфейса Стилизовать интерфейс для соответствия измерителю громкости Julian. Изменить заголовок сделав его тонким и красивым. Изучить шаблон управления для расширителя. 08:20 Работа с темами управления Использовать темы управления как ресурсы для стилизации. Создать новый шаблон управления для маленького расширителя. Применить тему управления к настоящему расширителю. 11:30 Настройка кнопки переключения Сделать фон кнопки переключения прозрачным. Скопировать шаблон исходной кнопки переключения и добавить его к своей кнопке. Переместить стрелку на правую сторону кнопки. 12:59 Завершение настройки Убрать отступы над стрелкой. Сделать стрелку на всю высоту. Добавить содержимое обратно в заголовок убедившись что он свернут как можно тоньше. 13:41 Удаление синей рамки и замена презентатора контента Удаление синей рамки связано с классом Expander CS который читает название и применяет шаблон. Замена презентатора контента на элемент управления контентом чтобы лишить Expander возможности управлять шаблоном. 14:27 Перемещение содержимого Перемещение содержимого вверх по порядку для правильного отображения. 14:35 Создание стрелки с помощью потоковой геометрии Объяснение синтаксиса пути и команд для создания стрелки: м открывает путь l создаёт линейную команду v вертикальную линию c кривую. Пример создания стрелки с перемещением на ноль затем на одну и другую линию и выполнением команды Закрыть. 16:03 Настройка обводки и завершение фигуры Изменение обводки фильтра для отображения контура стрелки. Удаление команды z для незавершённой фигуры. 16:54 Перерисовка стрелки Перерисовка стрелки с нуля начиная с перемещения курсора на 12 градусов вправо. Корректировка углов для устранения лишнего пространства. 18:55 Добавление линии границы Вставка панели стека и добавление прямоугольника для заливки в нижней части расширителей. Настройка высоты прямоугольника и отступов для соответствия оригиналу. 20:22 Стилизация кнопок и заголовков Стилизация кнопок и заголовков добавление эффектов наведения курсора. 20:55 Вращение стрелки Использование рендеринг-трансформации для вращения стрелки при расширении и сжатии. Привязка к свойству toggle buttons is checked и создание конвертера значений для преобразования логического значения в рендеринг-трансформацию. 22:09 Реализация конвертера значений Создание класса checked to rotation converter для преобразования логического значения в угол в градусах. Обработка недопустимых значений и возврат уведомления о привязке. 24:10 Завершение работы Добавление ресурса преобразователя значений в пользовательский элемент управления. Проверка работы стрелки которая вращается в зависимости от состояния элемента управления. Подведение итогов и завершение занятия.

Источник: rutube.ru