30. Avalonia UI Real World (Numberic Up Down)
00:00 Введение и цель страницы • Страница действий с печатью почти готова, осталось изменить настройки принтера. • Необходимо добавить диалог для выбора профиля принтера и настроек на основе формата бумаги из файла САПР. 00:32 Текущий пользовательский интерфейс • Выпадающий список сканирует все принтеры на компьютере и показывает их. • После выбора принтера можно настроить форматы бумаги, ширину и высоту, ориентацию и цвет. • Исходный лоток зависит от принтера. 01:29 Добавление кнопки для новых настроек • Вставляется кнопка для создания новых настроек принтера. • Изменяется сетка для соответствия кнопке. 01:59 Настройка стиля кнопки • Редактируется определение кнопки, добавляются «авто» и «десять». • Убираются поля и нижнее поле в тексте. 02:39 Привязка кнопки к команде • Кнопка привязывается к команде «новые настройки печати». • Добавляется в viewmodel действий печати. 03:19 Создание диалогового окна • Открывается диалоговое окно с пользовательским интерфейсом. • Наследуется модель просмотра диалога подтверждения. 04:09 Переопределение модели просмотра • Переопределяется модель просмотра диалога подтверждения для настроек принтера. • Встраиваются необходимые элементы: заголовок, текст, подтверждение, отмена. 05:27 Проверка работы диалогового окна • Переименовывается модель просмотра настроек принтера. • Проверяется работа диалогового окна. 07:27 Добавление элементов в viewmodel • Добавляются новые элементы в viewmodel: название, описание, копии. • Создаётся конструктор для изменения заголовка и описания. 08:42 Настройка сетки и текста • Настраивается сетка для двух кнопок. • Добавляются интервалы и автоматическое заполнение. 10:16 Выравнивание текста • Текст выравнивается по вертикали и горизонтали. • Устанавливается максимальная ширина изображения. 11:47 Завершение настройки сетки • Уточняются ряды сетки для описания. • Исправляются отступы и выравнивание текста. 12:15 Создание коллекции предметов • Добавление названия и описания. • Создание большой коллекции предметов. • Размещение копий рядом с кнопками. • Настройка сетки и столбцов для удобства. 12:39 Работа с ViewModel • Привязка ViewModel к списку. • Добавление дополнительных свойств для модели представления принтера. • Инициализация свойств name и description. 13:18 Привязка полей • Привязка текстового поля к свойству name. • Привязка другого поля к свойству description. 13:51 Добавление копии • Создание целого числа копий и установка его равным единице. 14:04 Настройка кнопок • Размещение кнопок «Подтвердить» и «Отменить» на панели «стек». • Замена панели стека на сетку для отображения копий. 14:42 Определение столбцов • Настройка ориентации и интервалов столбцов. • Автоматическое включение записи «копии» в область заполнения. 15:21 Стилизация сетки • Установка значения «показывать линии сетки» в true. • Перемещение кнопок для видимости копий. 16:39 Использование спиннера • Вставка спиннера button spinner. • Привязка числового значения к копиям. 18:23 Ограничение диапазона • Установка минимума и максимума для числа копий. • Исправление визуальных ошибок. 20:06 Стилизация текстового поля • Переопределение шаблона для текстового поля. • Удаление пользовательских элементов стиля. 21:48 Стилизация кнопок • Копирование исходного шаблона для button spinner. • Настройка стиля кнопок. 24:32 Закруглённые углы • Добавление закруглённых углов для кнопок. • Настройка радиуса угла для кнопок уменьшения и увеличения. 25:09 Удаление темы • Удаление тематического набора с кнопок. • Настройка радиуса угла для точного соответствия стилю кнопок. 26:22 Настройка стрелок и фона • Обсуждение выбора цвета стрелок: белые или чёрные. • Упоминание о чёрном фоне и его влиянии на отображение элементов. 27:08 Проблемы с отображением фона • Обнаружение проблемы с отображением фона при уменьшении масштаба. • Попытка исправить проблему путём изменения цвета фона на красный. 27:33 Анализ пограничной кисточки • Определение пограничной кисточки как причины проблемы. • Решение удалить пограничную кисточку для исправления отображения. 28:55 Добавление отступов для кнопок • Объяснение работы счётчика кнопок и панели «стопка». • Добавление отступов для улучшения внешнего вида кнопок. 30:02 Проверка работы кнопок слева • Проверка работы кнопок слева и корректировка их отображения. • Настройка свойства margin для правильного отображения кнопок. 31:36 Финальные настройки интерфейса • Перемещение кнопки повтора для изменения порядка элементов. • Обсуждение возможных изменений радиусов углов между элементами. 31:52 Завершение работы над интерфейсом • Подготовка к управлению основными элементами интерфейса. • Добавление кнопок «да» и «нет» для отмены и сохранения действий. • Завершение работы над пользовательским интерфейсом внутри диалогового окна.
00:00 Введение и цель страницы • Страница действий с печатью почти готова, осталось изменить настройки принтера. • Необходимо добавить диалог для выбора профиля принтера и настроек на основе формата бумаги из файла САПР. 00:32 Текущий пользовательский интерфейс • Выпадающий список сканирует все принтеры на компьютере и показывает их. • После выбора принтера можно настроить форматы бумаги, ширину и высоту, ориентацию и цвет. • Исходный лоток зависит от принтера. 01:29 Добавление кнопки для новых настроек • Вставляется кнопка для создания новых настроек принтера. • Изменяется сетка для соответствия кнопке. 01:59 Настройка стиля кнопки • Редактируется определение кнопки, добавляются «авто» и «десять». • Убираются поля и нижнее поле в тексте. 02:39 Привязка кнопки к команде • Кнопка привязывается к команде «новые настройки печати». • Добавляется в viewmodel действий печати. 03:19 Создание диалогового окна • Открывается диалоговое окно с пользовательским интерфейсом. • Наследуется модель просмотра диалога подтверждения. 04:09 Переопределение модели просмотра • Переопределяется модель просмотра диалога подтверждения для настроек принтера. • Встраиваются необходимые элементы: заголовок, текст, подтверждение, отмена. 05:27 Проверка работы диалогового окна • Переименовывается модель просмотра настроек принтера. • Проверяется работа диалогового окна. 07:27 Добавление элементов в viewmodel • Добавляются новые элементы в viewmodel: название, описание, копии. • Создаётся конструктор для изменения заголовка и описания. 08:42 Настройка сетки и текста • Настраивается сетка для двух кнопок. • Добавляются интервалы и автоматическое заполнение. 10:16 Выравнивание текста • Текст выравнивается по вертикали и горизонтали. • Устанавливается максимальная ширина изображения. 11:47 Завершение настройки сетки • Уточняются ряды сетки для описания. • Исправляются отступы и выравнивание текста. 12:15 Создание коллекции предметов • Добавление названия и описания. • Создание большой коллекции предметов. • Размещение копий рядом с кнопками. • Настройка сетки и столбцов для удобства. 12:39 Работа с ViewModel • Привязка ViewModel к списку. • Добавление дополнительных свойств для модели представления принтера. • Инициализация свойств name и description. 13:18 Привязка полей • Привязка текстового поля к свойству name. • Привязка другого поля к свойству description. 13:51 Добавление копии • Создание целого числа копий и установка его равным единице. 14:04 Настройка кнопок • Размещение кнопок «Подтвердить» и «Отменить» на панели «стек». • Замена панели стека на сетку для отображения копий. 14:42 Определение столбцов • Настройка ориентации и интервалов столбцов. • Автоматическое включение записи «копии» в область заполнения. 15:21 Стилизация сетки • Установка значения «показывать линии сетки» в true. • Перемещение кнопок для видимости копий. 16:39 Использование спиннера • Вставка спиннера button spinner. • Привязка числового значения к копиям. 18:23 Ограничение диапазона • Установка минимума и максимума для числа копий. • Исправление визуальных ошибок. 20:06 Стилизация текстового поля • Переопределение шаблона для текстового поля. • Удаление пользовательских элементов стиля. 21:48 Стилизация кнопок • Копирование исходного шаблона для button spinner. • Настройка стиля кнопок. 24:32 Закруглённые углы • Добавление закруглённых углов для кнопок. • Настройка радиуса угла для кнопок уменьшения и увеличения. 25:09 Удаление темы • Удаление тематического набора с кнопок. • Настройка радиуса угла для точного соответствия стилю кнопок. 26:22 Настройка стрелок и фона • Обсуждение выбора цвета стрелок: белые или чёрные. • Упоминание о чёрном фоне и его влиянии на отображение элементов. 27:08 Проблемы с отображением фона • Обнаружение проблемы с отображением фона при уменьшении масштаба. • Попытка исправить проблему путём изменения цвета фона на красный. 27:33 Анализ пограничной кисточки • Определение пограничной кисточки как причины проблемы. • Решение удалить пограничную кисточку для исправления отображения. 28:55 Добавление отступов для кнопок • Объяснение работы счётчика кнопок и панели «стопка». • Добавление отступов для улучшения внешнего вида кнопок. 30:02 Проверка работы кнопок слева • Проверка работы кнопок слева и корректировка их отображения. • Настройка свойства margin для правильного отображения кнопок. 31:36 Финальные настройки интерфейса • Перемещение кнопки повтора для изменения порядка элементов. • Обсуждение возможных изменений радиусов углов между элементами. 31:52 Завершение работы над интерфейсом • Подготовка к управлению основными элементами интерфейса. • Добавление кнопок «да» и «нет» для отмены и сохранения действий. • Завершение работы над пользовательским интерфейсом внутри диалогового окна.