00:00 Создание расширяемого элемента управления Обсуждение необходимости поддержки расширяемого элемента управления. Проблема с текущим всплывающим окном: установка размера один раз и отсутствие его изменения. Создание расширителя и добавление содержимого. 00:57 Настройка расширителя Проверка состояния расширителя и присвоение свойства expanded значения true. Проблема фиксации высоты при расширении. 01:24 Тестирование расширителя в сетке Вставка расширителя в рамку и наблюдение за его расширением в сетке. Ожидание поведения аналогичного обычному всплывающему элементу управления. 02:28 Анимация элемента управления Объяснение процесса анимации элемента управления до и обратно. Установка ширины и высоты для активации анимации. 04:00 Проблемы с контрольными точками Трудности с получением контрольных точек при отладке. Решение проблемы путём установки ширины и высоты в NaN. 06:10 Обновление желаемого размера Определение момента для обновления желаемого размера при закрытии панели управления. Использование систем защиты от сбоев для предотвращения дублирования кода. 10:04 Финальная настройка анимации Обновление желаемого размера на основе текущего размера элемента управления. Проверка завершения анимации перед обновлением размера. 12:14 Тестирование и завершение Тестирование анимации и подтверждение её гладкости. Подтверждение надёжной поддержки расширяемого всплывающего окна. 12:58 Добавление свойства непрозрачности анимации Создание логического свойства непрозрачности анимации с значением true по умолчанию. 13:23 Анимация непрозрачности Копируем и вставляем код для анимации непрозрачности наложения. Устанавливаем анимацию непрозрачности на основе свойства. Сохраняем исходную непрозрачность для элемента управления. 13:57 Проверка анимации Проверяем что при полном открытии непрозрачность сбрасывается до исходного значения. Учитываем что при короткой анимации непрозрачность может быть ниже 100. 14:20 Создание расширителя анимации Создаём модель представления с списком списков для четырёх расширителей. Каждый элемент списка будет иметь заголовок и подконтент. Привязываем модель представления к пользовательскому интерфейсу. В пользовательском интерфейсе появится список с расширителями привязанными к другому списку. 14:20 Итоги Поддерживаем расширение и сворачивание с помощью контроля. Добавляем приятную затухающую непрозрачность.
Источник: rutube.ru