fix that zooming from .5 to .333 by scroll wheel is not smooth

This commit is contained in:
DD Liu 2020-05-11 18:42:52 -04:00
parent 5230e97903
commit 0e20cd0234
2 changed files with 11 additions and 10 deletions

View file

@ -20,7 +20,7 @@ import {setLayout} from '../reducers/layout';
import {getSelectedLeafItems} from '../helper/selection';
import {convertToBitmap, convertToVector} from '../helper/bitmap';
import {resetZoom, zoomOnSelection} from '../helper/view';
import {resetZoom, zoomOnSelection, OUTERMOST_ZOOM_LEVEL} from '../helper/view';
import EyeDropperTool from '../helper/tools/eye-dropper';
import Modes from '../lib/modes';
@ -211,7 +211,13 @@ class PaintEditor extends React.Component {
}
}
handleZoomIn () {
zoomOnSelection(PaintEditor.ZOOM_INCREMENT);
// Make the "next step" after the outermost zoom level be the default
// zoom level (0.5)
let zoomIncrement = PaintEditor.ZOOM_INCREMENT;
if (paper.view.zoom === OUTERMOST_ZOOM_LEVEL) {
zoomIncrement = 0.5 - OUTERMOST_ZOOM_LEVEL;
}
zoomOnSelection(zoomIncrement);
this.props.updateViewBounds(paper.view.matrix);
this.handleSetSelectedItems();
}

View file

@ -18,6 +18,7 @@ const PADDING_PERCENT = 25; // Padding as a percent of the max of width/height o
const BUFFER = 50; // Number of pixels of allowance around objects at the edges of the workspace
const MIN_RATIO = .125; // Zoom in to at least 1/8 of the screen. This way you don't end up incredibly
// zoomed in for tiny costumes.
const OUTERMOST_ZOOM_LEVEL = 0.333;
const ART_BOARD_BOUNDS = new paper.Rectangle(0, 0, ART_BOARD_WIDTH, ART_BOARD_HEIGHT);
const MAX_WORKSPACE_BOUNDS = new paper.Rectangle(
-ART_BOARD_WIDTH / 4,
@ -108,14 +109,7 @@ const resizeCrosshair = () => {
const zoomOnFixedPoint = (deltaZoom, fixedPoint) => {
const view = paper.view;
const preZoomCenter = view.center;
let newZoom;
if (view.zoom <= 0.5 && deltaZoom < 0) {
newZoom = 0.333;
} else if (view.zoom <= 0.333 && deltaZoom > 0) {
newZoom = 0.5;
} else {
newZoom = Math.max(0.5, view.zoom + deltaZoom);
}
const newZoom = Math.max(OUTERMOST_ZOOM_LEVEL, view.zoom + deltaZoom);
const scaling = view.zoom / newZoom;
const preZoomOffset = fixedPoint.subtract(preZoomCenter);
const postZoomOffset = fixedPoint.subtract(preZoomOffset.multiply(scaling))
@ -212,6 +206,7 @@ export {
ART_BOARD_HEIGHT,
ART_BOARD_WIDTH,
CENTER,
OUTERMOST_ZOOM_LEVEL,
SVG_ART_BOARD_WIDTH,
SVG_ART_BOARD_HEIGHT,
MAX_WORKSPACE_BOUNDS,