How to keep the center of the image in the same place while changing the size of only one of the directions?

I dont know how to explain what I mean, neither do I know if its even a feature, but I want something like in the attached gif where I do it in photopea, basically I change the vertical size while keeping the center where it is and also without changing the horizontal sizes

help needed

It’s not a feature at the moment. But I believe it was suggested at least one time.
For now the easiest way is to enable a 2x2 grid, resize the image and move it until the center handle snaps to the intersection of the grid.

2 Likes

Thanks @MusicalBox

This is something I always wanted to do in typography but couldn’t find the way. Thanks so much.

I’ve implemented this functionality, and it appears to be working well on my end.

rectangle

If you want to try it out, make a backup copy of RectangleControl.qml in the Shotcut\share\shotcut\qml\modules\Shotcut\Controls folder, and copy-and-paste the file below.
RectangleControl.qml (42.0 KB)

Double-clicking any of the 8 handles that are attached to the rectangle toggles the mode.

click

This toggle might need some further work because it isn’t intuitive for users. The mode also doesn’t stick, which means that the handle behavior always reverts back to default when you switch between clips. I think this can be improved.

The mode is indicated by the handles’ color, which turns from default white to light-gray.

One known bug is that the center of the image, which is also called position handle, can slightly move if you drag one of the 8 handles too quickly toward the center.

I also have to mention that I think I’ve accounted for this rectangle’s use in the Reframe filter where the width and height need to be even numbers.

5 Likes

@TRA Despite the small issues you mentioned, this is a very good start.
Good work! This is a very useful feature. :+1:

I agree. A double-click might not be intuitive. In other programs, they use a keyboard shortcut.
In my version of Photoshop: Shift + Alt + Mouse drag
In Inkscape: Shift + Ctrl + Mouse drag
In Gimp: Ctrl + Mouse drag

On my screen, there is no big difference between the normal color and the light-gray one.
Maybe the handles could turn into a more visible color? Like red or green?

2 Likes

seems to work well, thanks :folded_hands:

1 Like

I’ve tried red before and didn’t think it was aesthetically pleasing. To me, a more subtle change like how the center handle flips its gradient is more appropriate. The light-gay I used is something like RGB(230, 230, 230). Silver like color RGB(204, 204, 204) is probably good enough to be distiguishable from white.

If you’re up to it, you can edit Line 33 of RectangleControl.qml and change the first three 0.9 number to get any color. Each corresponds to Red, Green, and Blue of RGB in the form of a number between 0 and 1. Not the last 0.9 though because it’s transparency.

I checked Inkscape and yeah it’s a pretty nice feel when Shift/Control modifies how the rectangle changes its size.
I added the Control key as an another way to temporarily toggle. It doesn’t work exactly like how the position handle works, but it’s a start.
I guess in this implementation unlike Inkscape the handles change color as soon as you hit the Control key, so you can visually see which mode it’s in beforehand.
You can add this too by inserting

if (event.key === Qt.Key_Control)
    lockPositionHandle = true;

to Line 179 and

if (event.key === Qt.Key_Control)
    lockPositionHandle = false;

to Line 183.

1 Like

I agree that red might be a bit violent. But it clearly indicates that the constrain option is active. Also, red is a color that will be very visible on pretty much any background (media on the track below). Plus it’s not like the option will be active at all time. I don’t know about you, but I’d expect it to be active only when needed.

t works nice! I like it much better than the double-click.
But the Control key is already used in the player to restrain the movement of the rectangle control vertically and horizontally. I don’t know if that can cause problems or confusion…
Maybe you should use the Alt key instead?
Or Shift+Alt? (Shift+Ctrl will keep restrain the vertical/horizontal movement of the rectangle control).

This feature makes things a lot faster and easier when I need to add and align a background under some text. :+1:

2 Likes

That’s a nice catch. Control clearly doesn’t work here. I vaguely remember the thread about a feature suggestion that got eventually added. I’ll change it to Alt. You can also test on your end by changing Qt.Key_Control to Qt.Key_Alt.

When I want to use this functionality in the current state, I’ll most likely exclusively use double click to toggle. It’s not gonna be just a few seconds of flash of color for me.

My argument against using red is that red is a color of caution, a color that draws attention when attention doesn’t need to be drawn. Any color other than something on the gray scale sends a message that is typically associated to that color.

Another argument is that I’m using the rectangle control tracing plugin I wrote a while ago and its primary line color is red. I think the lines should remain red, and I don’t want it mixed up with the rectangle color.

Yet another argument, much weaker one, is that “let’s go with conventions.” Krita, Glaxnimate, Inkscape, and GIMP to my knowledge all use something on the grayscale, typically white or black, for UI controls that change shapes. Exceptions are Kdenlive and OBS.

If you can pick a number on the gray scale that you feel comfortable with, I’ll consider it.

:+1:

Yes, but… as a desperate attempt to convince you :innocent:

Well, If it has to be a gray color, I guess that 0.7 - 0.7 - 0.7 would be something I could live with.
The difference is more noticeable than using 0.9 - 0.9 - 0.9, and it’s not too dark.

The red here shows you what your actions will affect ala the red record button. It is mildly cautionary in that you need to pay attention to what is selected when changing things in other panels.

1 Like