feat(buttonNavigation): move the selector along the path instead of moving directly to the selected button
This commit is contained in:
@@ -10,39 +10,10 @@ const props = withDefaults(
|
||||
);
|
||||
|
||||
const { onRender } = useScreen();
|
||||
|
||||
const { assets } = useAssets();
|
||||
|
||||
const ANIMATION_SPEED = 15;
|
||||
|
||||
let [currentX, currentY, currentWidth, currentHeight] = props.rect;
|
||||
|
||||
onRender((ctx, deltaTime) => {
|
||||
const [targetX, targetY, targetWidth, targetHeight] = props.rect;
|
||||
const dx = targetX - currentX;
|
||||
const dy = targetY - currentY;
|
||||
const dw = targetWidth - currentWidth;
|
||||
const dh = targetHeight - currentHeight;
|
||||
|
||||
if (
|
||||
Math.abs(dx) < 0.5 &&
|
||||
Math.abs(dy) < 0.5 &&
|
||||
Math.abs(dw) < 0.5 &&
|
||||
Math.abs(dh) < 0.5
|
||||
) {
|
||||
[currentX, currentY, currentWidth, currentHeight] = props.rect;
|
||||
} else {
|
||||
const speed = (ANIMATION_SPEED * deltaTime) / 1000;
|
||||
currentX += dx * speed;
|
||||
currentY += dy * speed;
|
||||
currentWidth += dw * speed;
|
||||
currentHeight += dh * speed;
|
||||
}
|
||||
|
||||
const x = Math.floor(currentX);
|
||||
const y = Math.floor(currentY);
|
||||
const w = Math.floor(currentWidth);
|
||||
const h = Math.floor(currentHeight);
|
||||
onRender((ctx) => {
|
||||
const [x, y, w, h] = props.rect;
|
||||
|
||||
ctx.globalAlpha = props.opacity;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user