Sprite2D with AnimationPlayer - Animate "animation" properties

[monkeez]

Forgive me if this is already an option but would it be possible to have an import option to animate the sprite using the animation properties?

[nklbdev]

I'm sorry, but you can't do this directly. This is because when you manipulate the hframes, vframes, frame and frame_coords properties of Sprite2D, your sprite is split into rows and columns without taking into account the borders around each region.

Importality uses the sprite_sheet/edges_artifacts_avoidance_method import setting, which controls the creation of borders around each sprite. You can read about it on the wiki: About exporting data from source files. Importality cannot use the hframes, vframes, frame and frame_coords properties of Sprite2D because they are not compatible with the extra borders around each region.

You can do it differently:
Select in import settings:

• Import As: Aseprite -> Sprite sheet (JSON)
• Layout: Horizontal Stripes (or Vertical Stripes if you wish)))
• Max Cells in Strip: 8 (or other value. Zero (0) is for one infinite strip)
• Trim Sprites to Overall Min Size: false (or true if you want to trim your sprites in sprite sheet)
• Collapse Transparent Sprites: false (or true if you don't want to see multiple fully transparent sprites)
• Merge duplicated Sprites: false (or true if you don't want to see multiple identical sprites)

After importing you will get a JSON resource which will contain the data in the data property. This is a regular Dictionary with primitive data. But the sprite_sheet.atlas field contains the real Texture2D resource in the CompressedTexture2D format to be precise.

You can use this data as you wish. For example, you can create your own post-import script, which from this data will create the Sprite2D you need with animations (via your own AnimationPlayer) based on the hframes, vframes, frame and frame_coords properties.
To do this, create your script by copying post_import_script_example.gd. Place it where it is more convenient for you. For example, in the root folder of the project.

Select the script in import settings in the "Post import script" setting.

Change the script to suit you.
The context.resource field will contain the same JSON-resource that I mentioned above.
Try creating your Sprite2D with a child AnimationPlayer. Create animations based on data from context.resource.data
Pack your Sprite2D as PackedScene and put it in context.resource instead of JSON

I hope I was able to help you.

P.S.: I think I've figured out how I can add this feature in the future. But it will only be available if sprite_sheet/edges_artifacts_avoidance_method is set to None.

An example of the data you will find in your context.resource.data:

{
	"animation_library": {
		"animations": [
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.15,
						"sprite_index": 0
					},
					{
						"duration": 0.15,
						"sprite_index": 1
					}
				],
				"name": "idle",
				"repeat_count": 0
			},
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.15,
						"sprite_index": 2
					},
					{
						"duration": 0.15,
						"sprite_index": 3
					},
					{
						"duration": 0.15,
						"sprite_index": 4
					},
					{
						"duration": 0.15,
						"sprite_index": 5
					}
				],
				"name": "walking",
				"repeat_count": 0
			},
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.075,
						"sprite_index": 6
					},
					{
						"duration": 0.075,
						"sprite_index": 7
					},
					{
						"duration": 0.075,
						"sprite_index": 8
					},
					{
						"duration": 0.075,
						"sprite_index": 9
					}
				],
				"name": "running",
				"repeat_count": 0
			},
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.15,
						"sprite_index": 10
					},
					{
						"duration": 0.15,
						"sprite_index": 11
					}
				],
				"name": "braking",
				"repeat_count": 0
			},
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.15,
						"sprite_index": 12
					}
				],
				"name": "jumping",
				"repeat_count": 0
			},
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.15,
						"sprite_index": 13
					}
				],
				"name": "flying_up",
				"repeat_count": 0
			},
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.15,
						"sprite_index": 14
					}
				],
				"name": "flying_down",
				"repeat_count": 0
			},
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.15,
						"sprite_index": 15
					}
				],
				"name": "crouched",
				"repeat_count": 0
			},
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.15,
						"sprite_index": 16
					},
					{
						"duration": 0.15,
						"sprite_index": 17
					},
					{
						"duration": 0.15,
						"sprite_index": 18
					},
					{
						"duration": 0.15,
						"sprite_index": 19
					},
					{
						"duration": 0.15,
						"sprite_index": 20
					},
					{
						"duration": 0.15,
						"sprite_index": 21
					},
					{
						"duration": 0.15,
						"sprite_index": 22
					},
					{
						"duration": 0.15,
						"sprite_index": 23
					}
				],
				"name": "crawling",
				"repeat_count": 0
			},
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.15,
						"sprite_index": 24
					},
					{
						"duration": 0.15,
						"sprite_index": 25
					},
					{
						"duration": 0.15,
						"sprite_index": 26
					},
					{
						"duration": 0.15,
						"sprite_index": 27
					},
					{
						"duration": 0.15,
						"sprite_index": 28
					},
					{
						"duration": 0.15,
						"sprite_index": 29
					}
				],
				"name": "climbing",
				"repeat_count": 0
			},
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.15,
						"sprite_index": 30
					},
					{
						"duration": 0.15,
						"sprite_index": 31
					},
					{
						"duration": 0.15,
						"sprite_index": 32
					},
					{
						"duration": 0.15,
						"sprite_index": 33
					}
				],
				"name": "shocked",
				"repeat_count": 0
			},
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.15,
						"sprite_index": 34
					},
					{
						"duration": 0.15,
						"sprite_index": 35
					},
					{
						"duration": 0.15,
						"sprite_index": 36
					},
					{
						"duration": 0.15,
						"sprite_index": 37
					},
					{
						"duration": 0.15,
						"sprite_index": 38
					},
					{
						"duration": 0.15,
						"sprite_index": 39
					}
				],
				"name": "dying",
				"repeat_count": 0
			},
			{
				"direction": 0,
				"frames": [
					{
						"duration": 0.15,
						"sprite_index": 40
					}
				],
				"name": "dead",
				"repeat_count": 0
			}
		],
		"autoplay_index": -1
	},
	"sprite_sheet": {
		"atlas": "<CompressedTexture2D#-9223368087800023943>",
		"source_image_size": "(34, 34)",
		"sprites": [
			{
				"offset": "(-1, -1)",
				"region": "[P: (0, 0), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (36, 0), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (72, 0), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (108, 0), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (144, 0), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (180, 0), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (216, 0), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (252, 0), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (0, 36), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (36, 36), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (72, 36), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (108, 36), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (144, 36), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (180, 36), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (216, 36), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (252, 36), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (0, 72), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (36, 72), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (72, 72), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (108, 72), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (144, 72), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (180, 72), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (216, 72), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (252, 72), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (0, 108), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (36, 108), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (72, 108), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (108, 108), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (144, 108), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (180, 108), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (216, 108), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (252, 108), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (0, 144), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (36, 144), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (72, 144), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (108, 144), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (144, 144), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (180, 144), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (216, 144), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (252, 144), S: (36, 36)]"
			},
			{
				"offset": "(-1, -1)",
				"region": "[P: (0, 180), S: (36, 36)]"
			}
		]
	}
}