Нижняя панель элементов для работы с полотном

Панель содержит элементы которые реализуют разнообразные механизмы работы с полотном(передвижение, зум, перемещение):

1. Показать/Скрыть подложку - элемент, который позволяет показать, как будет выглядеть нарисованный пользователем рисунок на полотне с подложкой или без нее.

Есть подложка

Подложка скрыта

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

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

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

2. Перемещение - данный элемент отвечает за перемещение по экрану.

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

Иконка курсора меняется на следующую

3. Приближение - элемент, который позволяет увеличить масштаб полотна.

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

Кнопка становится активной и подсвечивается, как при нажатии на кнопку, нажатие клавиши + или работой колесиком мышки/touchpad.

Особенности:

1. Данный механизм работает так же с кнопкой + на клавиатуре
2. Работает свайпом на touchpad
3. Работает с колесиком мышки

4. Отдаление - элемент, который позволяет уменьшить масштаб полотна.

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

Кнопка становится активной и подсвечивается, как при нажатии на кнопку, нажатие клавиши - или работой колесиком мышки/touchpad.

Особенности:

1. Данный механизм работает так же с кнопкой - на клавиатуре
2. Работает свайпом на touchpad
3. Работает с колесиком мышки

5. [5-8]Перемещение - элемент, позволяющий перемещаться по полотну.

Кнопка становится активной и подсвечивается, как при нажатии на кнопку, нажатие на клавиши стрелок на клавиатуре.

Особенности:

1. Работает со стрелками на клавиатуре