CreateJS - 내 스프라이트 시트에 애니메이션을 적용 할 수 없습니다.

내 특정 질문에 대해이 포럼/인터넷/Google 포워드 및 거꾸로 체크했지만 아무 소용이 없습니다. 저는 제 가깝게 보이는 모범을 보았습니다. 저는 제 자신의 모범을 보려고했지만 아무것도하지 않았습니다. 도와주세요! 다시 한 번 사과 드리겠습니다. 그저 대답 해 주시면 사과 드리겠습니다. 그렇지 않으면 내 코드가 있습니다.CreateJS - 내 스프라이트 시트에 애니메이션을 적용 할 수 없습니다.

내가하려는 것은 점프중인 메가 맨의 단일 스프라이트 이미지를 움직이는 것입니다.
감사합니다. 해피 홀리데이!

참고 : Here the sprite I'm using 여기

나의 IS : 여기 JsFiddle

var stage, canvas, 
bmpA, data, 
megaman, spriteSheet; 

function Main() { 
    canvas = document.getElementById('canvas'); 
    stage = new createjs.Stage(canvas); 

    container = new createjs.Container(); 

    megaman = new Image(); 
    megaman.src = "megaman__jump.png"; 
    var bmpA = new createjs.Bitmap(megaman); 

    data = new createjs.SpriteSheet({ 
     images: [bmpA], 
     frames: { 
      width: 79, 
      height: 139, 
      count: 7 
     }, 
     animations: { 
      jump: [0, 6, "jump"] 
     } 
    }); 

    spriteSheet = new createjs.BitmapAnimation(data); 
    spriteSheet.gotoAndPlay("jump"); 


    createjs.Ticker.setFPS(30); 
    createjs.Ticker.addEventListener("tick", update); 
} 

function update(event) { 
    stage.addChild(spriteSheet); 
    stage.update(); 
} 


</script> 

</head> 

<body onload = "Main();"> 
    <canvas id = "canvas" width = "780" height = "300" 
     style = "border: 1px solid #000;"></canvas> 
</body> 
</html> 


    [1]: http://i.imgur.com/Q1OQM.png

출처

2014-12-25 MrDoubleJump

더 쉽게 도울 수있는 피들을 작성하십시오. – OnlyMAJ

예! 여기 내 바이올린이야. http://jsfiddle.net/MrDoubleJump/f58mr0Lk/ – MrDoubleJump

스프릿 시트가 생성되면 단 한번 스프라이트 시트를 추가하는 것이 좋습니다. 다시 추가하면 아무 것도 변경되지 않더라도 children 배열이 수정됩니다. – Lanny

빠른 편집이다. 그것이 내가 (jsfiddle은 당신을 위해 수행), 수입 easeljs body 태그를 드롭하도록 수정했습니다.에 붙여 당신의 코드가 있었고, 전체 이미지 경로를 사용하기 때문에 http://jsfiddle.net/lannymcnie/f58mr0Lk/9/

당신의 바이올린은 매우 도움이 아니었다.
BitmapAnimation 클래스의 이름이 언젠가 Sprite로 바뀌 었습니다. 사용하고있는 이젤 버전이 확실하지 않지만 더 이상 그 클래스가 없을 수도 있습니다.
비트 맵을 제거했습니다. SpriteSheet 데이터는 비트 맵이 아닌 문자열 경로 또는 이미지 참조를 허용합니다.
아래에서 제안했듯이 전체 업데이트 메서드를 제거하고 Sprite를 한 번 추가 한 다음 진드기로 스테이지를 직접 업데이트했습니다.

바이올린은 "작동"하지만 스프라이트 시트 크기가 옳지 않은 것처럼 보입니다. 봐.

data = new createjs.SpriteSheet({ 
    images: ["http://i943.photobucket.com/albums/ad274/Rah5er0/megaman__jump.png~original"], 
    frames: { 
     width: 79, 
     height: 139, 
     count: 7 
    }, 
    animations: { 
     jump: [0, 6, "jump"] 
    } 
}); 

var sprite = new createjs.Sprite(data);

출처

2014-12-25 19:04:01 Lanny

바이올린에 대해 유감스럽게 생각합니다. 아직 초보자입니다. 저는 오래된 구식 튜토리얼을 보았습니다 - 다른 구식 불일치/중복 중에서 '비트 맵 애니메이션'을 설명 할 것입니다. 이미지 - 방금 테스트 용 웹을 가져 왔고 균일 한 크기로 새로운 것을 만들었습니다 - 어쨌든 ... 고맙습니다, 정말 고맙게 생각합니다 - 하나의 학습 곡선이 해결되었습니다! – MrDoubleJump

내가 혼란스러운 또 하나 : Fiddle이 태그를 처리하므로 - 원래 코드에서 'onload'를 처리하는 방법에 대해 약간 분실했습니다. 컴파일러에 편집 된 코드를 넣으면 빈 캔버스가 생깁니다. 다시 한번 감사드립니다. – MrDoubleJump

전체 JavaScript 블록은 윈도우가로드 될 때 시작되는 함수 클로저에 래핑됩니다. 이것은 왼쪽의 Frameworks and Extensions 패널에서 구성 할 수 있습니다. – Lanny

CreateJS - 내 스프라이트 시트에 애니메이션을 적용 할 수 없습니다.

답변

관련 문제