Custom Component

One may want to introduce a component with custom logic. Unity Figma Importer handles this scenario with a workflow that is easy to understand and apply.

Custom "Progress Spinner" component

Unity Importer Plugin

When designing custom components, you need to name your component via Unity Importer in Figma, just type in the desired name to Component Type field. For example, Progress Spinner is named "ProgressSpinner". In this Progress Spinner example, a child container with binding key "Container" of the component is rotated endlessly.

"Container" of a ProgressSpinner

Scripting Custom Component

When declaring a custom component, [FigmaComponent(typeId)] attribute should be used. For example, the declaration of class ProgressSpinner should be:

[FigmaComponent("ProgressSpinner")]
public class ProgressSpinner : MonoBehaviour, IFigmaNodeBinder
{
    [FigmaNode("Container")]
    [SerializeField]
    private FigmaNode _container;

    public float duration = 1f;
    public int period = 12;
    public Vector3 axis = Vector3.forward;
    
    private float _periodDuration;
    private float _elapsedTime;

    private void Start()
    {
        _periodDuration = duration / period;
        StartCoroutine(Rotate());
    }

    private IEnumerator Rotate()
    {
        while (true)
        {
            _elapsedTime += Time.deltaTime;
            if (_elapsedTime >= _periodDuration)
            {
                _elapsedTime -= _periodDuration;
                _container.transform.Rotate(axis * (360f / period));
            }
            yield return new WaitForEndOfFrame();
        }
    }

    public void OnBind(FigmaNode figmaNode)
    {
        _container.rectTransform.pivot = Vector3.one * 0.5f;
    }
}

Now anytime Unity Figma Importer sees an instance (only instances of components are imported) of "ProgressSpinner" component, it adds this behavior to the GameObject.

Tips

To assign behavior on import time, implementing IFigmaNodeBinder for your custom component would be a good choice. For more information, you may want to check Bindings documentation.

Bindings