Skip to content

Commit 401ae49

Browse files
authored
Add rotation transformation documentation
1 parent 25011fd commit 401ae49

14 files changed

+53
-1
lines changed

cursor/resize-handle.png

302 Bytes
Loading

cursor/rotate-handle.png

373 Bytes
Loading

rotate.md

+53-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,57 @@
11
# Rotate Selection
22

3-
![Rotate Handles](rotate/rotatehandles.gif)
3+
Any selection can be rotated using either [handles](rotate.md#handles) or [menu options](rotate.md#menu-options), both methods will rotate the selection around the [pivot point](rotate.md#rotation-pivot) using the chosen [algorithm](rotate.md#rotation-algorithms).
4+
5+
## Rotation Pivot
6+
7+
![Rotation Pivot](rotate/pivot-point-context-bar.png)
8+
9+
Selection is rotated around a single, defined point (![Rotation Pivot](rotate/pivot-point.png)). By default the pivot point is set in the center of the selection and is not visible until you start rotating the image.
10+
11+
Its placement and visibility settings can be changed from the context bar of any selection tool. Rotation pivot can also be moved with a mouse by holding <kbd>Left click</kbd> and dragging the point.
12+
13+
![Rotation Pivot Settings](rotate/pivot-point-settings.gif)
14+
![Moving the Rotation Pivot with a mouse](rotate/pivot-point-mouse-move.gif)
15+
16+
## Handles
17+
18+
Selection can be rotated by moving your mouse to the outer part of a handle (![Handle](rotate/handle.png)), holding <kbd>Left click</kbd> and dragging your mouse around the canvas.
19+
20+
![Rotate Handles](rotate/rotate-handles.gif)
21+
22+
Cursor change will indicate whether dragging a handle will resize or rotate the selection.
23+
24+
| | Resize | Rotate |
25+
| ------ | :----------------------------------------: | :----------------------------------------: |
26+
| Cursor | ![Resize Handle](cursor/resize-handle.png) | ![Rotate Handle](cursor/rotate-handle.png) |
427

528
With <kbd>Shift</kbd> key you can snap angles (0º, 45º, 90º, etc.)
29+
30+
## Menu Options
31+
32+
![Edit > Rotate](rotate/edit-rotate.png)
33+
34+
Selection can be rotated by 90º or 180º using menu options under _Edit > Rotate_.
35+
36+
![Rotate Menu Options](rotate/rotate-menu-options.gif)
37+
38+
## Rotation Algorithms
39+
40+
![Rotation Algorithms](rotate/rotation-algorithms.png)
41+
42+
There are two rotation algorithms available:
43+
44+
- Fast Rotation
45+
- [RotSprite](https://en.wikipedia.org/wiki/Pixel-art_scaling_algorithms#RotSprite)
46+
47+
While RotSprite is widely accepted as an algorithm producing better results, the choice is up to your preferences.
48+
49+
![Fast Rotation vs RotSprite](rotate/rotation-algorithm.gif)
50+
51+
---
52+
53+
**SEE ALSO**
54+
55+
[Flip](flip.md) |
56+
[Resize](resize.md) |
57+
[Move](move-selection.md)

rotate/edit-rotate.png

4.17 KB
Loading

rotate/handle.png

114 Bytes
Loading

rotate/pivot-point-context-bar.png

2.89 KB
Loading

rotate/pivot-point-menu.png

6.59 KB
Loading

rotate/pivot-point-mouse-move.gif

51.4 KB
Loading

rotate/pivot-point-settings.gif

52.7 KB
Loading

rotate/pivot-point.png

197 Bytes
Loading

rotate/rotate-handles.gif

270 KB
Loading

rotate/rotate-menu-options.gif

183 KB
Loading

rotate/rotation-algorithm.gif

23.9 KB
Loading

rotate/rotation-algorithms.png

3.5 KB
Loading

0 commit comments

Comments
 (0)