Support for Spriter/Spine

GDevelop general Feature requests
1

I’d like to have a GD support exports from these kinds of animations. It might take a lot of time but it really is worth it and I believe this will take GD to a whole new level :slight_smile:

2

i too would like to see spriter support. Spine on the other hand not so fussed about. They have less features and the licensing scheme is ridiculously expensive when comparing it to spriter :laughing:

3

Hmm just went looking around and I see that Pixi.js(which GD uses for web platform) has support for Spine! Here you go:

http://www.goodboydigital.com/pixijs/examples/12-2/

Source code:

<!DOCTYPE HTML>
<html>
<head>
	<title>pixi.js example 12 Spine</title>
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: #000000;
		}
	</style>
	
	
	<script src="pixi.js"></script>
	<script src="../../src/pixi/loaders/SpineLoader.js"></script>
	<script src="../../src/pixi/extras/Spine.js"></script>
</head>
<body>
	<script>
	
	
	// create an array of assets to load
	
	var assetsToLoader = ["../../logo_small.png", "data/dragonBones.json", "data/dragonBones.anim"];
	
	// create a new loader
	loader = new PIXI.AssetLoader(assetsToLoader);
	
	// use callback
	loader.onComplete = onAssetsLoaded
	
	//begin load
	loader.load();
	
	
	// create an new instance of a pixi stage
	var stage = new PIXI.Stage(0xFFFFFF, true);

	// create a renderer instance
	var renderer = new PIXI.autoDetectRenderer(window.innerWidth, window.innerHeight);
	
	// set the canvas width and height to fill the screen
	renderer.view.style.display = "block";
	
	// add render view to DOM
	document.body.appendChild(renderer.view);
	
	function onAssetsLoaded()
	{
		var dragon = new PIXI.Spine("data/dragonBones.anim");
		
		var scale = 1;//window.innerHeight / 700;
		
		dragon.position.x = window.innerWidth/2;
		dragon.position.y =	window.innerHeight/2 + (450 * scale);
		
		dragon.scale.x = dragon.scale.y = scale
		
		
		dragon.state.setAnimationByName("flying", true);
		
		stage.addChild(dragon);
		
		var logo = PIXI.Sprite.fromImage("../../logo_small.png")
		stage.addChild(logo);
		
		
		logo.anchor.x = 1;
		logo.position.x = window.innerWidth
		logo.scale.x = logo.scale.y = 0.5;
		logo.position.y = window.innerHeight - 70;
		logo.setInteractive(true);
		logo.buttonMode = true;
		logo.click = logo.tap = function()
		{
			window.open("https://github.com/GoodBoyDigital/pixi.js", "_blank")
		}
		
	}
	
	
	
	requestAnimFrame(animate);
	     

	function animate() {

	    requestAnimFrame( animate );
	    renderer.render(stage);
	}

	</script>

	</body>
</html>
4

Still, something internal, like Victor’s extension that sadly isn’t updated anymore (but I’ll try to convince him to do so after tilemap is done) would be better as spriter/spine are paid software and such extension being part of GD would lower dev costs.

5

how about doing it with spriter?

A tutorial would be greatly appreciated. Even better- an automatism! :smiley:

spriter costs 25$ for pro version and it has a fully useable FREE version as well - unlike spine.

So please someone figure this thing out. Its a really good piece of software, much more mature than that GD extension that has dropped support for ages

6

Blurymind, the thing is Spriter doesn’t have fully functional free version. Otherwise no one would buy Pro one. Unless you are talking about trial.

7

it is functional enough to produce good results. In fact, the free version is way more mature and feature fill than the plug in :unamused: