#09. Набор инструментов UI Vuetify

00:00 Введение и обзор проекта -Приветствие от Чили и возвращение в Nanocef. -Обзор предыдущего видео о создании нового продукта с View.js. -Упоминание о замене старого проекта на «коробку для Ослиного пердежа». 00:25 Механизм обработки и цель -Объяснение работы механизма обработки, который динамически генерирует окно «Ослиный пердеж». -Цель — создать нестандартный опыт, а не просто украсить проект. 01:26 Установка Viewtify -Установка плагина Viewtify для Vite. -Преимущества плагина: «встряхивание дерева» и автоматический импорт компонентов. 02:48 Настройка Viewtify -Создание приложения с использованием Viewtify и настройка темы Material Design. -Импорт стилей Viewtify для корректного отображения компонентов. 03:56 Использование компонентов Viewtify -Обертывание разметки в компонент vApp. -Размещение контента в VMain и использование V-контейнера для сетки. 04:45 Тестирование и настройка стилей -Тестирование интерфейса с карточками контента. -Настройка отступов и полей для элементов. 07:16 Тёмный режим и реактивные данные -Создание реактивного объекта для тёмного режима. -Привязка данных к пользовательскому интерфейсу для динамического изменения темы. -Реализация переключателя для выбора тёмного режима. 09:26 Исправление полосы прокрутки -Проблема с полосой прокрутки и её решение путём включения автоматического -переполнения для HTML и body. -Переопределение стилей Viewtify для устранения полосы прокрутки. 10:26 Ограничение ширины контейнера -Настройка ширины контейнера для более ограниченного контента. -Пример настройки ширины контейнера на 800 пикселей. 10:46 Введение в Viewtify -Ширина интерфейса застряла на отметке 800, но это нормально. -Автор не может создать пустой интерфейс для демонстрации Viewtify. -У автора уже есть готовый интерфейс, созданный в Unify. 11:33 Особенности интерфейса -Интерфейс включает карточки и режим «затемнение». -Есть кнопки для переключения групп элементов. -Внизу находится строка статуса, не скопированная из VS Code. -Боковая панель доступна в режиме просмотра приложений верхнего уровня. 12:00 Настройка виджетов -Можно размещать виджеты на оверлее для мониторинга производительности графики. -Виджеты можно перетаскивать по экрану. -Планируется демонстрация реактивности просмотра на более сложном примере. 12:53 Заключение -После демонстрации реактивности планируется привязка интерфейса к серверной части C. -Благодарность за просмотр и призыв поставить лайк. -Обещание новых видео.

Иконка канала C++ для всех
3 подписчика
12+
4 просмотра
3 дня назад
12+
4 просмотра
3 дня назад

00:00 Введение и обзор проекта -Приветствие от Чили и возвращение в Nanocef. -Обзор предыдущего видео о создании нового продукта с View.js. -Упоминание о замене старого проекта на «коробку для Ослиного пердежа». 00:25 Механизм обработки и цель -Объяснение работы механизма обработки, который динамически генерирует окно «Ослиный пердеж». -Цель — создать нестандартный опыт, а не просто украсить проект. 01:26 Установка Viewtify -Установка плагина Viewtify для Vite. -Преимущества плагина: «встряхивание дерева» и автоматический импорт компонентов. 02:48 Настройка Viewtify -Создание приложения с использованием Viewtify и настройка темы Material Design. -Импорт стилей Viewtify для корректного отображения компонентов. 03:56 Использование компонентов Viewtify -Обертывание разметки в компонент vApp. -Размещение контента в VMain и использование V-контейнера для сетки. 04:45 Тестирование и настройка стилей -Тестирование интерфейса с карточками контента. -Настройка отступов и полей для элементов. 07:16 Тёмный режим и реактивные данные -Создание реактивного объекта для тёмного режима. -Привязка данных к пользовательскому интерфейсу для динамического изменения темы. -Реализация переключателя для выбора тёмного режима. 09:26 Исправление полосы прокрутки -Проблема с полосой прокрутки и её решение путём включения автоматического -переполнения для HTML и body. -Переопределение стилей Viewtify для устранения полосы прокрутки. 10:26 Ограничение ширины контейнера -Настройка ширины контейнера для более ограниченного контента. -Пример настройки ширины контейнера на 800 пикселей. 10:46 Введение в Viewtify -Ширина интерфейса застряла на отметке 800, но это нормально. -Автор не может создать пустой интерфейс для демонстрации Viewtify. -У автора уже есть готовый интерфейс, созданный в Unify. 11:33 Особенности интерфейса -Интерфейс включает карточки и режим «затемнение». -Есть кнопки для переключения групп элементов. -Внизу находится строка статуса, не скопированная из VS Code. -Боковая панель доступна в режиме просмотра приложений верхнего уровня. 12:00 Настройка виджетов -Можно размещать виджеты на оверлее для мониторинга производительности графики. -Виджеты можно перетаскивать по экрану. -Планируется демонстрация реактивности просмотра на более сложном примере. 12:53 Заключение -После демонстрации реактивности планируется привязка интерфейса к серверной части C. -Благодарность за просмотр и призыв поставить лайк. -Обещание новых видео.

, чтобы оставлять комментарии