diff --git a/packages/core/src/commands/view/Resize.ts b/packages/core/src/commands/view/Resize.ts index d2070fd7a..85e3aab7d 100644 --- a/packages/core/src/commands/view/Resize.ts +++ b/packages/core/src/commands/view/Resize.ts @@ -253,8 +253,8 @@ export default class CommandResize extends CommandAbstract< const { store, selectedHandler, config, resizer, event } = updateOptions; const { keyHeight, keyWidth, autoHeight, autoWidth, unitWidth, unitHeight } = config; - const onlyHeight = ['tc', 'bc'].indexOf(selectedHandler!) >= 0; - const onlyWidth = ['cl', 'cr'].indexOf(selectedHandler!) >= 0; + const onlyHeight = !options.ratioLock && ['tc', 'bc'].indexOf(selectedHandler!) >= 0; + const onlyWidth = !options.ratioLock && ['cl', 'cr'].indexOf(selectedHandler!) >= 0; const partial = !store; const style: StyleProps = {}; diff --git a/packages/core/src/utils/Resizer.ts b/packages/core/src/utils/Resizer.ts index 6275dc8a8..7588b797b 100644 --- a/packages/core/src/utils/Resizer.ts +++ b/packages/core/src/utils/Resizer.ts @@ -61,6 +61,12 @@ export interface ResizerOptions { */ ratioDefault?: boolean; + /** + * Indicate if the resizer should allow the ratio to change. + * @default false + */ + ratioLock?: boolean; + /** * On resize start callback. */ @@ -299,6 +305,7 @@ export default class Resizer { constructor(opts: ResizerOptions = {}) { this.defOpts = { ratioDefault: false, + ratioLock: false, onUpdateContainer: () => {}, step: 1, minDim: 10, @@ -751,7 +758,7 @@ export default class Resizer { } // Enforce aspect ratio (unless shift key is being held) - var ratioActive = opts.ratioDefault ? !data.keys!.shift : data.keys!.shift; + var ratioActive = opts.ratioLock || opts.ratioDefault ? !data.keys!.shift : data.keys!.shift; if (attr.indexOf('c') < 0 && ratioActive) { var ratio = startDim.w / startDim.h; if (box.w / box.h > ratio) { @@ -759,6 +766,14 @@ export default class Resizer { } else { box.w = Math.round(box.h * ratio); } + } else if (opts.ratioLock) { + // Enforce aspect ratio for center resizer + var ratio = startDim.w / startDim.h; + if (['cl', 'cr'].indexOf(attr) >= 0) { + box.h = Math.round(box.w / ratio); + } else { + box.w = Math.round(box.h * ratio); + } } if (~attr.indexOf('l')) {