Skip to main content

Avatar Editor

The Genies Avatar SDK has an Avatar Editor framework which allows developers to display a functioning UI for users to change their Avatar looks and wearables.

Avatar Editor

Avatar Editor UI Functionality​

The Avatar Editor's UI can do the following:

  1. Preview the Avatar's wearables being changed.
  2. Preview the Avatar's body being changed.
  3. Save any previews by clicking the "Save" button.
  4. Discard any previews by clicking the "X" button.

Avatar Editor API​

Genies Sdk Avatar Library​

using Genies.Sdk.Avatar;

The GeniesSdkAvatar library contains methods to open or close the Avatar editor.

Avatar Editor Events​

GeniesSdkAvatar.Events.AvatarEditorOpened;
GeniesSdkAvatar.Events.AvatarEditorClosed;

These events will fire when the Avatar editor is opened or closed.

Is Avatar Editor Open Boolean​

GeniesSdkAvatar.IsAvatarEditorOpen;

This boolean checks if the Avatar Editor is open.

Close Avatar Editor Async Function​

GeniesSdkAvatar.CloseAvatarEditorAsync();

This function will close the Avatar editor. It will reset the camera back to its original location when the Avatar editor was opened.

Open Avatar Editor Async Function​

GeniesSdkAvatar.OpenAvatarEditorAsync(ManagedAvatar, [Camera]);

This function will open the Avatar editor. It requires a ManagedAvatar parameter to know which Avatar will be edited. It also has an optional Camera parameter to transition to the ideal view of the Avatar. If the camera parameter is not passed, it will default to the main camera in the scene.

note

The camera will transition to the ideal view assuming the Avatar is at position (0, 0, 0) and rotation (0, 0, 0). You will need to add logic to move and rotate the Avatar when the Avatar Editor is opened.

Example​

Open the Avatar Editor​

This example will setup two buttons to open and close the Avatar editor.

using Genies.Sdk.Avatar;
using UnityEngine;
using UnityEngine.UI;

public class AvatarEditorTest : MonoBehaviour
{
    [SerializeField] private ManagedAvatar userAvatar;
    [SerializeField] private Button openAvatarEditorButton;
    [SerializeField] private Button closeAvatarEditorButton;

    private void Start()
    {
        openAvatarEditorButton.onClick.AddListener(OpenAvatarEditor);
        closeAvatarEditorButton.onClick.AddListener(CloseAvatarEditor);
    }

    private void OnDestroy()
    {
        openAvatarEditorButton.onClick.RemoveListener(OpenAvatarEditor);
        closeAvatarEditorButton.onClick.RemoveListener(CloseAvatarEditor);
    }

    async void OpenAvatarEditor()
    {
        if(GeniesSdkAvatar.IsAvatarEditorOpen) {
            Debug.Log("Error: Avatar Editor Already Opened!");
        }else{
            Debug.Log("Opening Avatar Editor...");
            await GeniesSdkAvatar.OpenAvatarEditorAsync(userAvatar);
            Debug.Log("Avatar Editor Opened!");
        }
    }

    async void CloseAvatarEditor()
    {
        if(GeniesSdkAvatar.IsAvatarEditorOpen) {
            Debug.Log("Closing Avatar Editor...");
            GeniesSdkAvatar.CloseAvatarEditorAsync();
            Debug.Log("Avatar Editor Closed!");
        }else{
            Debug.Log("Error: Avatar Editor Already Closed!");
        }
    }
}
note

This example assumes the user is logged in before either button is pressed.