Работа с виджетами

• Редактирование виджетов
• Группы
• Размеры виджетов
• Расстояние между виджетами
• Перемещение виджетов
• Привязка
• Копирование виджетов
  
  

Проекты, созданные на Readymag, состоят из виджетов. Эта статья расскажет об операциях, которые можно совершать с отдельными виджетами или группами — это поможет упростить и ускорить работу в инструменте.

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

Редактирование виджетов

Чтобы изменить свойства виджета, кликните на него: меню появится в правой части страницы.

При наведении курсора на виджет вы увидите его рамку. Потянув за нее, вы можете изменить размер виджета. 

Если виджеты сгруппированы, их рамки можно включить, кликнув на группу и нажав кнопку Cmd (Ctrl).

Рамка будет автоматически скрыта, если вы начнете двигать виджеты при помощи стрелок на клавиатуре или изменять их размер шорткатом Cmd (Ctrl) + стрелки на клавиатуре.

Группы

Чтобы создать группу, откройте список виджетов, выберите несколько и нажмите на Group («Сгруппировать») в их настройках. Вы можете редактировать сгруппированные виджеты в один клик: анимировать, выравнивать, фиксировать, активировать «замок» (Lock) и Тени (Shadows).

Если вы зажмете кнопку Cmd (Ctrl) в  момент наведения курсора на группу, то увидите общую рамку всех виджетов. Чтобы переключаться между виджетами внутри группы, кликните на них, зажав клавишу Cmd (Ctrl). Вы также можете выбрать виджет, дважды кликнув на него.

Размеры виджетов

Чтобы увидеть размеры всех виджетов на странице одновременно, нажмите клавишу Х на клавиатуре. Есть три способа изменить их размер:

• Введите желаемое значение вручную после активации Х;
• Потяните за границу рамки виджета;
• Используйте шорткат Cmd (Ctrl) + стрелки на клавиатуре.

Shift + Drag изменит размер виджета c сохранением его изначальных пропорций.

Расстояние между виджетами

Откройте настройку Grid & Guides («Сетка и направляющие») и включите функцию привязки (Snap) и кнопку Sizes («Размеры») или используйте шорткаты S (для Snap) и X (для Sizes). В результате, перемещая виджет, вы будете видеть расстояние от него до другого виджета, расположенного с ним на одной прямой.

Эта опция крайне полезна, если вам нужно расположить несколько виджетов на одинаковом расстоянии друг от друга. Вот как это работает на примере виджета Shape:

1. Откройте Grid&Guides, включите функции Snap и Sizes.

2. Создайте виджет Shape, кликните на него, а затем перетащите его c зажатой кнопкой Option (Alt). Оригинальный виджет останется на своем месте, при этом будет создана его копия. Расстояние между копией и оригиналом вы увидите благодаря активной функции Sizes. 

3. Кликните по копии и снова перетащите виджет с зажатой кнопкой Option (Alt). Появится еще одна копия, которая автоматически встанет на место в тот момент, когда расстояние между ней и предыдущим виджетом достигнет расстояния из пункта 2.

Перемещение виджетов

Чтобы изменить положение виджета на странице, просто перетащите его. Вот несколько полезных шорткатов:

• Cтрелка на клавиатуре + Option (Alt): позволяет мгновенно создавать копию виджета. 
• Shift + перетаскивание: перемещает виджеты только по вертикальной/горизонтальной оси.
  
  

Переместить не только один виджет, но и все виджеты под ним, можно при помощи функции Bundle Drag. Для этого нажмите на виджет, а затем зажав F или V, переместите его вниз или.

Существует два режима для Bundle Drag:

• F + перетаскивание: от верхней границы виджета;
• V + перетаскивание: от нижней границы виджета.

Привязка (Snap)

Активируйте функцию привязки (Snap) в Grid & Guides («Сетка и направляющие») или же используйте шорткат S: при перемещении виджет будет привязан к сетке, а также к расположенным рядом виджетам.

Копирование виджетов 

Копирование/вставка доступна во всех проектах: скопируйте любой виджет при помощи шортката Cmd+C на Mac (Ctrl+C на PC), откройте другой проект или страницу и вставьте его при помощи Cmd+V (Ctrl+V на PC).

Шорткат Cmd+Option+C позволяет создавать копии, которые автоматически выравниваются с оригиналом.

Больше полезных шорткатов вы найдете здесь.