Холст, масштаб и сетка

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

Масштаб

Текущий процент находится в правой части шапки. Он меняет только вид холста.

• Zoom to Fit помещает рабочие фреймы в доступную область.
• Zoom to 100% возвращает масштаб 100 %.
• ⌘= / Ctrl+= и ⌘− / Ctrl+− приближают и отдаляют.
• Shift+1 выполняет Zoom to Fit.

Эти действия также доступны в контекстном меню пустого места на холсте.

Сравнение Zoom to Fit и 100 % показывает, что масштаб меняет только рабочее представление, а не геометрию материала.

Сетка фрейма

Команда Show Frame Grid показывает сетку внутри фреймов. Snap to Grid включает привязку при перемещении и изменении размера виджетов. Включать их можно независимо: иногда полезно видеть колонки, но двигать объект свободно.

Для показа сетки нажмите W. Для привязки используйте ⇧⌘' на macOS или Ctrl+Shift+' на Windows и Linux.

Одинаковое перемещение с выключенной и включённой привязкой наглядно разделяет показ сетки и Snap to Grid.

Выделение и перемещение

Выберите виджет на холсте или в Layers. У выделения появятся границы и ручки изменения размера. Несколько виджетов можно выровнять или распределить кнопками над секцией Layout.

При drag виджет и ручка размера должны непрерывно следовать за курсором до отпускания.

Чтобы вынести виджет из фрейма на холст, перетащите курсор за верхнюю, левую или правую границу фрейма. У фрейма с ролью Breakpoint перетаскивание вниз сохраняет виджет внутри и увеличивает высоту фрейма по содержимому. Из обычного фрейма с ролью Frame виджет можно вынести и через нижнюю границу.

Чтобы продолжить перемещение или изменение размера за пределами видимой области, удерживайте курсор у нужного края холста. После короткой паузы холст начнёт плавно прокручиваться. Чем ближе курсор к краю, тем быстрее движение; в углу холст движется по диагонали. Прокрутка продолжается и за пределами окна, пока вы удерживаете кнопку мыши и окно остаётся активным.

Во время прокрутки точка, за которую вы взяли виджет, или перетаскиваемая ручка размера остаётся под курсором — даже если вы продолжаете двигать мышь.

Верните курсор внутрь холста или отпустите кнопку мыши, чтобы остановить прокрутку. При переключении в другое окно перемещение или изменение размера завершается. Привязки и модификаторы работают как обычно, а всё перемещение или изменение размера отменяется одним Undo.

Правый клик по выделению открывает команды группировки, копирования, вставки и создания сниппета. Правый клик по пустому месту — команды холста и вставку готового сниппета.

Подробнее: Layout, Слои и группы, Горячие клавиши.