ahracho

안녕하세요. <code>this.physics.closest()</code>는 단순히 중심 좌료 기준으로 계산됩니다. Phaser에서 closest 함수가 실제로 어떻게 구현되어 있는지 <a target="_blank" rel="noopener noreferrer nofollow" href="https://github.com/phaserjs/phaser/blob/master/src/physics/arcade/ArcadePhysics.js">링크</a>에서 확인해보시면, 다음과 같이 source에 물리엔진 body가 있다면 body의 center(중심점)을 사용하고 있는 것을 확인하실 수 있습니다! 따라서 몹의 히트박스가 크기가 다양하다면 예상대로 동작하지 않을 확률이 크고, 그런 경우에는 edge to edge로 거리를 구하는 커스텀 로직을 작성하셔야 합니다.<pre><code class="language-javascript">closest: function (source, targets)
{
 if (!targets)
 {
 targets = this.world.bodies.entries;
 }

 var min = Number.MAX_VALUE;
 var closest = null;
 var x = source.x;
 var y = source.y;
 var len = targets.length;

 for (var i = 0; i < len; i++)
 {
 var target = targets[i];
 var body = target.body || target;

 if (source === target || source === body || source === body.gameObject || source === body.center)
 {
 continue;
 }

 var distance = DistanceSquared(x, y, body.center.x, body.center.y); // center 사용

 if (distance < min)
 {
 closest = target;
 min = distance;
 }
 }

 return closest;
},</code></pre>

physics.closest()는 중심점 기준인가요, 충돌 영역 기준인가요?

안녕하세요~ 이 게임 제작에 활용한 player, mob과 비슷한 이미지는 "free spritesheets" 라는 키워드로 검색해보시면 사이트를 좀 찾을 수 있습니다.<a target="_blank" rel="noopener noreferrer nofollow" href="https://opengameart.org/">https://opengameart.org/</a> → 여기서 spritesheet로 검색하시면 원하시는 느낌의 이미지가 많이 나옵니다~<a target="_blank" rel="noopener noreferrer nofollow" href="https://kenney.nl/assets/toon-characters-1">https://kenney.nl/assets/toon-characters-1</a> → 이 이미지는 도트 느낌은 아니지만 spritesheet 형식으로 되어있는 듯 합니다.이미지가 원하는 크기와 좀 다르다면 scale로 조금 조정해 볼 수 있을 듯 합니다. 이미지 자체의 크기를 깔끔하게 조정하려면 그래픽 툴을 사용해야 할 듯 한데.. 이 부분은 잘 모르겠네요 ㅠㅠ

player, mob, background 이미지

안녕하세요. Phaser가 Node 18버전과 호환이 되면 18버전으로 수강하셔도 무방하시겠습니다. 다만 18버전으로 진행하시면 강의와 똑같이 따라하셔도 버전 업으로 달라진 부분 때문에 에러가 날 수 있습니다. 이런 부분은 구글링하시며 디버깅하시면 좋은 학습이 될 것 같습니다~

node 버전 문의드립니다.

안녕하세요.해당 오류는 node 버전이 강의 버전과 맞지 않아 발생하는 오류 같습니다. 이 강의는 node 16.16.0 버전으로 진행되었습니다. node를 다운그레이드해주시거나, mise 같은 툴을 사용하실 것을 권해드립니다.mise는 node, python, terraform 등의 개발 도구/런타임을 설치 및 관리하고 프로젝트마다 사용할 도구 버전을 지정할 수 있도록 하는 툴입니다. 환경 변수를 관리해 프로젝트마다 다른 AWS key 등을 지정할 수도 있습니다.mise를 설치하신 뒤, node 버전을 phaser 게임 프로젝트 루트 폴더로 이동하셔서 <code>mise use node@16</code> 명령어를 입력하시면 됩니다. mise 설치 및 사용은 다음 링크를 참고하시면 됩니다: <a target="_blank" rel="noopener noreferrer nofollow" href="https://www.itsmo.dev/introduce-mise/">https://www.itsmo.dev/introduce-mise/</a>

npm start 관련 에러 질문

안녕하세요.질문자님과 같은 경우, node 버전을 프로젝트 버전마다 다르게 설정할 수 있는 mise를 설치해서 사용할 것을 추천드립니다.mise는 node, python, terraform 등의 개발 도구/런타임을 설치 및 관리하고 프로젝트마다 사용할 도구 버전을 지정할 수 있도록 하는 툴입니다. 환경 변수를 관리해 프로젝트마다 다른 AWS key 등을 지정할 수도 있습니다.mise를 설치하신 뒤, node 버전을 phaser 게임 프로젝트 루트 폴더로 이동하셔서 <code>mise use node@16</code> 명령어를 입력하시면 됩니다. mise 설치 및 사용은 다음 링크를 참고하시면 됩니다: <a target="_blank" rel="noopener noreferrer nofollow" href="https://www.itsmo.dev/introduce-mise/">https://www.itsmo.dev/introduce-mise/</a>

노드.js 버전 질문

안녕하세요.현재 이동과 관련된 코드는 PlayingScene.js의 movePlayerManager 메서드에서 관리하고 있는데, player를 이동하는 코드와 weapon을 이동하는 코드의 순서가 보장되지 않아 발생하는 문제로 생각됩니다.<pre><code class="language-javascript">movePlayerManager() {
 this.m_player.move(vector);
 this.m_weaponStatic.children.each(weapon => {
 weapon.move(vector);
 }, this);
}</code></pre>다음과 같은 두 방법을 시도해보실 수 있겠습니다.<ol><li>player의 move 메소드 내로 weapon을 move시키는 코드를 이동시킵니다.</li><li>AI 답변으로 적혀져 있는 방법대로, catnip의 move 메소드를 player의 좌표를 가져와 직접 대입하는 방식으로 변경합니다.</li></ol>&nbsp;

catnip 이펙트 범위가 이상하네요

안녕하세요.일반적으로 Maximum call stack size exceeded라는 에러는 무한루프 또는 반복 호출로 인해 콜스택 크기가 초과되었을 때 발생합니다. 코드에서 Beam.setVelocity가 여러 번 반복 호출되면서 에러가 난 것 같습니다.수업 자료대로라면 setVelocity 메서드에서 무한 루프가 발생하진 않을 것 같은데, 이벤트가 너무 짧은 시간 안에 계속해서 발생해서 콜스택 크기를 초과한 것으로 보입니다. 콜스택의 크기를 직접 변경할 수는 없으니 repeatGap을 조금씩 늘려서 콜스택이 터지지 않는 범위를 찾는 것이 최선일 것 같습니다.

addAttackEvent 속도가 너무 빠르면 이런 오류가 발생하네요

안녕하세요, Phaser labs 페이지에서 해당 페이지가 삭제된 것으로 보입니다.Phaser labs에 있는 다른 예시들을 통해 실습해보실 수 있습니다. (<a target="_blank" rel="noopener noreferrer nofollow" href="https://labs.phaser.io/index.html">https://labs.phaser.io/index.html</a>)<a target="_blank" rel="noopener noreferrer nofollow" href="https://labs.phaser.io/view.html?src=src\physics\arcade\bounce%20test.js&v=3.80.1">https://labs.phaser.io/view.html?src=src\game%20objects\sprites\create%20from%20config.js</a> 여기서는 <code>this.make.sprite(config8);</code> 부분에서 config8을 config1, 2, 3, 4, 5 등으로 바꾸고 config의 내용을 바꿔보면서 실습하실 수 있습니다.<a target="_blank" rel="noopener noreferrer nofollow" href="https://labs.phaser.io/view.html?src=src\physics\arcade\bounce%20test.js&v=3.80.1">https://labs.phaser.io/view.html?src=src\physics\arcade\bounce%20test.js&v=3.80.1</a> 여기서는<pre class="hljs"><code>this.logo.setOrigin(0.5, 0);
this.logo.setVelocity(0, 60);
this.logo.setBounce(1, 1);
this.logo.setCollideWorldBounds(true);</code></pre>이 부분의 수치를 바꾸고 Run Code 해보며 물리 적용에 관련해 실습해보실 수 있습니다.이외에도 다양한 샘플이 홈페이지에 있으므로 각 페이지에서 Edit를 눌러 코드를 수정한 뒤 Run Code를 해보며 간단히 실습해보시면 되겠습니다.

hello world 강의 질문이요~

안녕하세요 JJanmo님!에러 제보주셔서 감사합니다. 노션 내용 업데이트 완료하였습니다. 🙂

[참고] Uncaught Error: createEmitter removed. See ParticleEmitter docs for info : 에러에 대한 해결 방법 공유

안녕하세요, WS Kim님.강의의 원활한 수강을 위해 샘플 코드를 강의 제작시 버전으로 다운그레이드하여 수강하시는 것을 권해드립니다.다음과 같은 git 명령어로 강의 제작 시점의 코드를 clone할 수 있습니다.혹시 다음 명령어를 사용해도 오류가 발생하면 추가 댓글 부탁드립니다!<pre class="hljs"><code>git clone https://github.com/phaserjs/template-webpack.git
git reset --hard 737428d</code></pre>

ahracho

Posts