mirror of
https://github.com/unanmed/HumanBreak.git
synced 2025-01-31 23:29:27 +08:00
修改碎裂特效的效果
This commit is contained in:
parent
b31afca4b1
commit
b14e4edcc7
@ -30,7 +30,8 @@ export default function init() {
|
|||||||
export function applyFragWith(
|
export function applyFragWith(
|
||||||
canvas: HTMLCanvasElement,
|
canvas: HTMLCanvasElement,
|
||||||
length: number = 4,
|
length: number = 4,
|
||||||
time: number = 1000
|
time: number = 1000,
|
||||||
|
config: any = {}
|
||||||
) {
|
) {
|
||||||
// 先切分图片
|
// 先切分图片
|
||||||
const imgs = splitCanvas(canvas, length);
|
const imgs = splitCanvas(canvas, length);
|
||||||
@ -44,14 +45,17 @@ export function applyFragWith(
|
|||||||
const centerY = v.y + v.canvas.height / 2;
|
const centerY = v.y + v.canvas.height / 2;
|
||||||
const onX = centerX === cx;
|
const onX = centerX === cx;
|
||||||
const onY = centerY === cy;
|
const onY = centerY === cy;
|
||||||
const rate = MAX_MOVE_LENGTH - 1 + Math.random() ** 3 * MOVE_FLUSH;
|
const mml = config.maxMoveLength ?? MAX_MOVE_LENGTH;
|
||||||
|
const mf = config.moveFlush ?? MOVE_FLUSH;
|
||||||
|
const rate = mml - 1 + Math.random() ** 3 * mf;
|
||||||
let endX = onY ? 0 : (centerX - cx) * rate;
|
let endX = onY ? 0 : (centerX - cx) * rate;
|
||||||
let endY = onX ? 0 : (centerY - cy) * rate;
|
let endY = onX ? 0 : (centerY - cy) * rate;
|
||||||
const mx = Math.abs(endX + centerX) + Math.abs(v.canvas.width);
|
const mx = Math.abs(endX + centerX) + Math.abs(v.canvas.width);
|
||||||
const my = Math.abs(endY + centerY) + Math.abs(v.canvas.height);
|
const my = Math.abs(endY + centerY) + Math.abs(v.canvas.height);
|
||||||
if (mx > maxX) maxX = mx;
|
if (mx > maxX) maxX = mx;
|
||||||
if (my > maxY) maxY = my;
|
if (my > maxY) maxY = my;
|
||||||
const endRad = Math.random() * MAX_ROTATE * 2 - MAX_ROTATE;
|
const r = config.maxRotate ?? MAX_ROTATE;
|
||||||
|
const endRad = Math.random() * r * 2 - r;
|
||||||
|
|
||||||
return {
|
return {
|
||||||
deltaX: endX,
|
deltaX: endX,
|
||||||
@ -68,7 +72,8 @@ export function applyFragWith(
|
|||||||
const ctx = frag.getContext('2d')!;
|
const ctx = frag.getContext('2d')!;
|
||||||
const ani = new Animation();
|
const ani = new Animation();
|
||||||
ani.register('rate', 0);
|
ani.register('rate', 0);
|
||||||
ani.absolute().time(time).mode(FRAG_TIMING).apply('rate', 1);
|
const ft = config.fragTiming ?? FRAG_TIMING;
|
||||||
|
ani.absolute().time(time).mode(ft).apply('rate', 1);
|
||||||
frag.width = maxX * 2;
|
frag.width = maxX * 2;
|
||||||
frag.height = maxY * 2;
|
frag.height = maxY * 2;
|
||||||
ctx.save();
|
ctx.save();
|
||||||
@ -145,8 +150,8 @@ function splitCanvas(canvas: HTMLCanvasElement, l: number): SplittedImage[] {
|
|||||||
console.warn('切分画布要求切分边长大于等于画布长宽的一半!');
|
console.warn('切分画布要求切分边长大于等于画布长宽的一半!');
|
||||||
return [];
|
return [];
|
||||||
}
|
}
|
||||||
const w = canvas.width % l === 0 ? canvas.width : canvas.width - l;
|
const w = canvas.width;
|
||||||
const h = canvas.height % l === 0 ? canvas.height : canvas.height - l;
|
const h = canvas.height;
|
||||||
const numX = Math.floor(w / l);
|
const numX = Math.floor(w / l);
|
||||||
const numY = Math.floor(h / l);
|
const numY = Math.floor(h / l);
|
||||||
const rw = (w - numX * l) / 2;
|
const rw = (w - numX * l) / 2;
|
||||||
|
Loading…
Reference in New Issue
Block a user