Руководство пользователя Отмена

Создание прокручиваемых монтажных областей

Узнайте, как создавать прокручиваемые монтажные области.

Когда вы создаете дизайн XD, монтажная область может оказаться недостаточно длинной, чтобы вместить все содержимое. Удлиняя монтажную область и выбирая параметры в зависимости от нужд вашего проекта, вы можете вертикально прокручивать монтажную область, чтобы подстраиваться под размеры разных устройств.

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

Прокручиваемая монтажная область

Создание вертикальной прокрутки

  1. На предустановленных монтажных областях: перетащите нижнюю точку монтажной области вниз, чтобы увеличить ее длину по сравнению с экраном устройства. Пунктирная линия обозначает начало прокручиваемого содержимого. 

    Пунктирная линия и прокручиваемое содержимое
    Пунктирная линия и прокручиваемое содержимое

  2. В режиме Дизайн выберите следующие параметры в инспекторе свойств.

    • Прокрутка: выберите Вертикальная или Нет
    • Фиксировать положение при прокрутке: выберите, чтобы закрепить элементы в фиксированном положении во избежание прокрутки вместе с содержимым. 
    • Высота окна просмотра: укажите высоту области просмотра, через которую видно монтажную область. 

    Вы можете применить эффект вертикальной прокрутки для перемещения содержимого монтажной области вверх и вниз.

    Вертикальная прокрутка на монтажной области нестандартного размера
    Вертикальная прокрутка на монтажной области

  3. Соедините монтажные области в режиме прототипа.

  4. В режиме Прототип выберите следующие параметры в инспекторе свойств.

    • Сохранить позицию прокрутки: при переходе к следующей монтажной области сохраняется позиция из предыдущей монтажной области. Дополнительные сведения см. в этом посте в Twitter
    • Фиксировать положение при прокрутке: закрепляет элементы дизайна в фиксированном положении во избежание прокрутки вместе с содержимым. 
    Сохранить позицию прокрутки
    Сохранить позицию прокрутки

    Фиксация положения при прокрутке
    Фиксация положения при прокрутке

  5. Для предварительного просмотра монтажной области выберите «Предпросмотр на настольном ПК»  . Перетащите окно предварительного просмотра для просмотра вертикальной прокрутки.

Примеры и образцы файлов

Больше таких руководств и образцов файлов можно найти в сообществе XD.

Советы и рекомендации

Чтобы создать эффекты горизонтальной прокрутки в проектах, используйте группы прокрутки. Группы прокрутки позволяют создавать прототип окна для контента, который можно прокручивать по горизонтали, вертикали или в обоих направлениях.


Связанные ресурсы

Есть вопрос или идея?

Спросите сообщество

Если вы хотите задать вопрос или поделиться интересной идеей, вступайте в сообщество Adobe XD. Мы будем рады услышать ваши идеи и увидеть ваши работы.

Получайте помощь быстрее и проще

Новый пользователь?