2012-05-27 7 views
1

EaselJS에 익숙하지 않으므로 소스 zip 파일과 함께 패키지 된 "Simple Sprite Sheet"예제의 코드를 사용했습니다. 로드 및 재생을 위해 스프라이트 시트를 가져 오려고하지만 첫 번째 프레임 만 나타납니다.EaselJS로 스프라이트 시트로드하기

function init() { 
    var stage = new Stage(document.getElementById("canvas")); 
    var ss = new SpriteSheet({ 
     "frames": { 
      "width": 159, 
      "numFrames": 71, 
      "regX": 0, 
      "regY": 0, 
      "height": 85 
     }, 
     "animations":{ 
      "instance1": [0, 0], 
      "images": ["./assets/spritesheet.png"] 
     }); 

    var animate = new BitmapAnimation(ss); 
    animate.x = 0; 
    animate.y = 0; 

    ss.getAnimation("instance1").frequency = 2; 
    ss.getAnimation("instance1").next = "instance1"; 
    animate.gotoAndPlay("instance1"); 


    stage.addChild(animate); 
    Ticker.setFPS(60); 
    Ticker.addListener(stage); 
} 
나는 내가 어떤 이벤트를 등록하고 있지 않다 때문에, 난 그냥 INSTANCE1에서 놀고 있어요 시세 기능을 필요가 있다고 생각하지 않습니다

, 프레임 캔버스는 동일한 크기의 모두는 내가 경우 애니메이션을 통해 재생 animate.gotoAndPlay("instance1");animate.play("instance1");으로 대체하고 루프합니다. 어떤 제안? 미리 감사드립니다.

답변

2

나는 다른 사이트에서 이것을 대답했다고 생각합니다.

스프라이트 시트 형식이 잘못되었습니다. "애니메이션"속성은 시작 프레임과 끝 프레임이있는 명명 된 애니메이션이 포함 된 개체입니다. 이 예제에서 유일한 애니메이션의 시작 및 끝 프레임은 [0,0]이고 "images"속성은 애니메이션 객체 안에 있습니다. 올바른 형식은 여기에서 볼 수있다 :

https://github.com/CreateJS/EaselJS/blob/master/examples/SimpleSpriteSheet.html

var ss = new SpriteSheet({ 
    "frames": { 
     "width": 159, 
     "numFrames": 71, 
     "regX": 0, 
     "regY": 0, 
     "height": 85 
    }, 
    "animations":{ 
     "instance1": [0, 25] // sample end frame is "25" 
    }, 
    "images": ["./assets/spritesheet.png"]); 
}); 

내가 그 같은 문제를 가진 다른 사람을 도움이되기를 바랍니다. 건배,

+0

감사합니다. Lanny에게 감사드립니다. Google의 EaselJS 그룹에서 내 질문에 답변 해 주셨습니다. 여러 실험실과 다른 FPS를 사용하면서 또 다른 걸림돌을 치고 실험 해 보았습니다. 만약 당신이 한번 들러 볼 수 있다면, 나는 매우 감사 할 것입니다. http://stackoverflow.com/questions/10861247/easeljs-having-two-canvases-with-different -fps – dcd0181