걷기 애니메이션 개선: 프레임 교대 대신 총총 바운스 + 미세 기울임
두 걷기 프레임의 몸통 각도가 달라 교대 시 도리도리처럼 보이던 문제. walk1 한 프레임에 hop 바운스와 ±3.4° 기울임으로 걷는 느낌을 냄. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
이 커밋은 다음에 포함됨:
@@ -411,19 +411,17 @@ export default function VillageView() {
|
|||||||
y: anim.y,
|
y: anim.y,
|
||||||
draw: () => {
|
draw: () => {
|
||||||
shadow(anim.x, anim.y + 2, 11);
|
shadow(anim.x, anim.y + 2, 11);
|
||||||
const frameName = working
|
// 걷기는 프레임 교대 대신 한 프레임 + 총총 바운스 + 미세 기울임
|
||||||
? "work"
|
// (두 걷기 프레임의 몸통 각도가 달라 교대 시 도리도리처럼 보이는 문제 회피)
|
||||||
: moving
|
const frameName = working ? "work" : moving ? "walk1" : "idle";
|
||||||
? Math.floor(now / 180) % 2 === 0
|
|
||||||
? "walk1"
|
|
||||||
: "walk2"
|
|
||||||
: "idle";
|
|
||||||
const sprite = catFramesRef.current.get(frameName);
|
const sprite = catFramesRef.current.get(frameName);
|
||||||
if (sprite) {
|
if (sprite) {
|
||||||
const sh = 42;
|
const sh = 42;
|
||||||
const sw = (sprite.width / sprite.height) * sh;
|
const sw = (sprite.width / sprite.height) * sh;
|
||||||
|
const tilt = moving ? Math.sin(now / 150) * 0.06 : 0;
|
||||||
ctx.save();
|
ctx.save();
|
||||||
ctx.translate(anim.x, anim.y + bob);
|
ctx.translate(anim.x, anim.y + bob);
|
||||||
|
ctx.rotate(tilt);
|
||||||
if (anim.flip) ctx.scale(-1, 1);
|
if (anim.flip) ctx.scale(-1, 1);
|
||||||
ctx.drawImage(sprite, -sw / 2, -sh + 4, sw, sh);
|
ctx.drawImage(sprite, -sw / 2, -sh + 4, sw, sh);
|
||||||
ctx.restore();
|
ctx.restore();
|
||||||
|
|||||||
새 이슈에서 참조
사용자 차단