Jump to content

multiatlas animation


giorg
 Share

Recommended Posts

hello all!

 

trying to create animation exported from texture packer, which created a json and many png (not only one),
in preload I do:

      

this.load.path = game_assets + 'filmati';
this.load.multiatlas('man', 'welcome.json');

 

and in create:

this.anims.create({ key: 'welcome', frames: this.anims.generateFrameNames('man', { start: 0, end: 98 }), repeat: -1 });

this.add.sprite(400, 300).setScale(2.7).play('welcome');


getting this:
TypeError: t is undefined, can't access property "frame" of it
any hint?

Link to comment
Share on other sites

Hi samme,

thanks for your answer. that gives me a very big object in console:

…}

__BASE: {…}

autoRound: -1

centerX: 16

centerY: 16

customData: Object {  }

customPivot: false

cutHeight: 32

cutWidth: 32

cutX: 0

cutY: 0

data: Object { cut: {…}, trim: false, radius: 22.627416997969522, … }

glTexture: WebGLTexture { isAlphaPremultiplied: true, isRenderTexture: false, width: 32, … }

halfHeight: 16

halfWidth: 16

height: 32

name: "__BASE"

pivotX: 0

pivotY: 0

rotated: false

source: Object { resolution: 1, width: 32, height: 32, … }

sourceIndex: 0

texture: {…}

customData: Object {  }

dataSource: Array []

firstFrame: "__BASE"

frameTotal: 1

frames: Object { __BASE: {…} }

key: "__MISSING"

manager: Object { _eventsCount: 0, name: "TextureManager", _pending: 0, … }

source: Array [ {…} ]

<prototype>: Object { add: add()
, has: has(), get: get()
, … }

u0: 0

u1: 1

v0: 0

v1: 1

width: 32

x: 0

y: 0

<prototype>: Object { setSize: setSize()
, setTrim: setTrim(), setCropUVs: setCropUVs()
, … }

<prototype>: {…

not sure which property I should check... anyway my json looks like:

{
	"textures": [
		{
			"image": "welcome-0.png",
			"format": "RGBA8888",
			"size": {
				"w": 1799,
				"h": 1890
			},
			"scale": 1,
			"frames": [
				{
					"filename": "s4b2manw_0004.png",
					"rotated": false,
					"trimmed": true,
					"sourceSize": {
						"w": 490,
						"h": 648
					},
					"spriteSourceSize": {
						"x": 136,
						"y": 20,
						"w": 298,
						"h": 628
					},
					"frame": {
						"x": 1,
						"y": 1,
						"w": 298,
						"h": 628
					}
				},

so how should I exactly call those functions?

Thanks a lot!

Link to comment
Share on other sites

Actually, just do, in create(): 

console.log(this.anims.generateFrameNames('man'));

That should show you all the names.

If your animation uses every frame, you can just use that: 

this.anims.generateFrameNames('man')

Otherwise, you need something like 

this.anims.generateFrameNames('man', {
  start: 0,
  end: 1, // or however many
  prefix: 's4b2manw_',
  suffix: '.png',
  zeroPad: 4
});

 

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...