Skip to main content

Use with Unity

Overview​

This guide demonstrates how to use the Axie Mixer SDK in a Unity app. The Axie Mixer is built upon Spine Animation with additional customization, that helps you create the skeleton data to be used with Spine.

Before you start​

Before you start using Axie Mixer in your Unity app, make sure you have the following:

Initialize the SDK​

To initialize the Axie Mixer SDK, call Mixer.Init() once at the start of the game. The best place for this method is in the loading scene.

caution

Refrain from calling Mixer.Init() more than once.

Create Axie Spine​

To create an Axie's Spine data, you need to know the Axie's ID (axieID) and its genes (genesString).

Create an object in the scene with the SkeletonAnimation component:

var skeletonAnimation = GetComponent<SkeletonAnimation>();
Mixer.SpawnSkeletonAnimation(skeletonAnimation, axieId, genesString);

API​

Mixer.SpawnSkeletonAnimation(
    SkeletonAnimation skeletonAnimation,
    string axieId,
    string genesStr
)
  • skeletonAnimation: Main Spine component for rendering and controling the animation.
  • axieId: Axie ID.
  • genesString: Axie genes, must be gene512.
info

You may need to scale down the SkeletonAnimation component to the desired size. To flip the Axie, use the scaleX field of the skeleton. For example, skeletonAnimation.skeleton.ScaleX = -1.

Create Axie Spine for UI canvas​

Creating an Axie's Spine data for the UI canvas is similar to the preceding section. The difference is you need to use SkeletonGraphic instead of SkeletonAnimation.

Mixer.SpawnSkeletonAnimation(
    SkeletonGraphic skeletonGraphic,
    string axieId,
    string genesStr
)

Display animation​

  1. Get all available animation names using the following code:
List<string> animationList = Mixer.Builder.axieMixerMaterials.GetMixerStuff(AxieFormType.Normal).GetAnimatioNames();
  1. Display animation:
skeletonAnimation.state.SetAnimation(0, "action/idle/normal", true);
// The above code will play Idle animation with looping
// For Skeleton Graphic
skeletonGraphic.AnimationState.SetAnimation(0, "action/idle/normal", true);
// You can find more information about the function here http://en.esotericsoftware.com/spine-applying-animations

Build the project​

To build the project, add AxieMixerShaderVariants to your preload shaders at Project Settings > Graphics > Shader loading > Preloaded shaders.

Demo scenes​

Among the assets, you can find two demo scenes:

  • DemoMixer: an interactive environment for building and animating Axies using the Axie Mixer capabilties.
  • FlappyAxie: a minigame based on FlappyBird. In this demo, you can find the AxieFigure class that helps to set up SkeletonAnimation automatically. The axie id and genes are static though.

Both demo scenes are available in this documentation:

Was this helpful?
Happy React is loading...