Improve the rectangular selection tool

[novhack]

Right now it's possible to move selected pixels with a shift button but it would be nice to be able to copy the selection with a ctrl button too.

[OverloadedOrama]

You can already copy selections with Ctrl-C, and paste them with Ctrl-V. Although I think we need to make it more apparent for users because this functionality is quite hidden as for right now.

[novhack]

Some other programs indicate it by animating the selection rectangle (slowly rotating dashed line). Since the selection rectangle is a 2D polygon maybe that could be done with a shader?
But I still think that allowing fast copy/paste when fast move is available would not be bad for workflow.

[novhack]

Today someone came to Discord and was a little confused on how selection in Pixelorama works so I did a little research in a few desktop pixel art programs and this is how they behave. I unfortunately don't have ProMotion on this machine but I might add it eventually. I have thrown MSPaint in because that is what 99% of people who ever used Windows used at least once.

Glossary:

Just to be sure we understand each other...
Selection - rectangular bordered area created with the selection tool by Click + drag over the canvas
Selected - part of the canvas bordered by the selection

Pyxel Edit:

• selecting doesn't add resize/rotation gizmos - only added on paste and when movement starts - rotation starts when clicked and dragged near the corners of selection
• Click + movement moves only selection
• Ctr + Click + movement cuts selected and moves it with selection
• Shift + Click + movement creates a new selection and merges it with already existing one - if gizmos are present same as Ctrl + movement
• Alt + Click + movement creates a new selection and subtracts it from already existing one - if gizmos are present moves selection with selected preview and automatically pastes selected when mouse is released
• Ctrl+C/Ctrl+V creates a movable selection with selected preview, on consecutive Ctrl+V draws selected to canvas (selection is kept at the same position)

Aseprite:

• every selection adds resize/rotation gizmos - rotation behaviour is the same as in Pyxel Edit
• when selection exists creating another selection with a right mouse click subtracts from it
• Click + movement cuts selected and moves it with selection
• Ctr + Click + movement moves selection with selected preview and automatically draws selected to canvas when mouse is released
• Shift + Click + movement creates a new selection and merges it with already existing one
• Alt + Click + movement always activates color picker - non-selection feature
• Ctrl+C/Ctrl+V creates a movable selection with selected preview, on consecutive Ctrl+V draws selected to canvas (on paste selection moves back to the position of the original copy)

Graphics Gale:

• resize gizmos added on every selection - rotation gizmo is a line from the center of selection with a draggable end that controls rotation
• only program where left clicking out of selection doesn't remove selection - right click outside does it
• cursor has vertical and horizontal line gizmos
• Click + movement cuts selected and moves it with selection
• Ctr + Click + movement moves the canvas in the window (non-selection feature)
• Shift + Click + movement same as Click + movement but locks movement to X and Y of the center of the original selection position
• Alt + Click + movement same as Click + movement
• Ctrl+C/Ctrl+V same as Pyxel Edit

MS Paint:

• resize gizmos added on every selection, no rotation
• Click + movement cuts selected and moves it with selection
• Ctr + Click + movement moves selection with selected preview, draws selected to canvas on mouse release
• Shift + Click + movement Windows XP Solitaire game won effect... a nice nostalgic throwback but an unusable feature
• Alt + Click + movement same as Click + movement
• Ctrl+C/Ctrl+V creates selection with selected preview at (0,0) position, on consecutive Ctr+V creates another selection at (0,0) and draws the previous one to canvas

Pixelorama 0.6

• resize/rotation gizmos are not yet implemented
• Click + movement moves only selection
• Ctr + Click + movement same as Click + movement
• Shift + Click + movement cuts selected and moves it with selection
• Alt + Click + movement same as Click + movement
• Ctrl+C/Ctrl+V allows to move selection and draw copy of selected to the canvas (no preview), copy data is lost when selection is removed by clicking outside of it

Suggestions

I think that the base for selection behaviour in Pixelorama is solid but I have compiled a list of proposed behaviour from what I learned from other programs:

• Left click outside removes selection (ESC could too). Left click + movement creates a new selection.

• Left click + Shift + movement outside adds to the current selection if the new selection connects with it. Left click + Ctrl + movement subtracts from selection if new and current overlap.

• Holding Shift toggles on resize/rotate gizmos. When manipulating selection with gizmos Shift can be released but gizmos will remain present until the mouse is released.

• Shift + movement cuts the selected area and moves the selection, Shift can be released, selected area is drawn to canvas on mouse release (current behaviour). Since Shift is being held it shows resize/rotate gizmos while moving the selection (thus indicating destructive operation).

• Ctrl + movement moves selection with a preview of the selected area, on mouse release it draws the preview to canvas.

• Ctrl+C keeps the copied selection even after de-selection. Current behaviour after paste remains the same - if the selection is not deselected but moved Ctr-V pastes on it's position. But if it was de-selected Ctr-V re-creates the copied selection on it's original position.

• I would avoid any combination with Alt since it reserved for windows manipulation in basically all X11 based desktop environments.

The main three additions in my proposal are then:

1. Use Left click + movement outside to add to/subtract from already existing selection if the new and current selections overlap (once there is support for non-rectangular selections).
2. Show gizmos when Shift is being held to indicate that the selected area will be destructively affected. This feature could be potentially reversible in preferences to not show gizmos when Shift is held - that might be better default for new users that used more "traditional" programs before.
3. Keep the selection copied with Ctr-C even after de-selection.

These are of course just suggestions but I have spent multiple hours thinking about this and this is the most consistent, full featured, solution I came up with.

Oh and I love the vertical/horizontal line gizmos in Graphics Gale... they really make it easier to align the selection. Maybe we could "borrow" that. 😄

[Calinou]

Speaking of selection features, Photoshop also lets you drag a selection while you're creating the initial rectangle by holding Space and moving the mouse. This is pretty handy when you need to adjust your selection's initial corner without releasing the mouse button.

[OverloadedOrama]

Closing this issue to continue the discussion on #129 :)