VRChat 非公式日本語ドキュメント

組み込みのTween型

各組み込み VRCTween 型の詳細な例です。

Transform Tween

Transform tweenは、GameObjectのposition、rotation、またはscaleをアニメーションさせます。これらは、シーン内でオブジェクトを移動させる際にもっとも一般的に使用されるtweenです。すべてのtransform tweenは、GameObjectまたはTransformのいずれかで呼び出すことができます。

// Both are equivalent
myObject.TweenPosition(target, 1f, VRCTweenEase.OutQuad);
myObject.transform.TweenPosition(target, 1f, VRCTweenEase.OutQuad);

TweenPosition と TweenLocalPosition

GameObjectのワールド座標またはローカル座標のpositionをアニメーションさせます。

public GameObject door;

public void OpenDoor()
{
    // Move to a world position
    door.TweenPosition(new Vector3(0, 3, 0), 1f, VRCTweenEase.OutQuad);
}

public void CloseDoor()
{
    // Move to a local position (relative to parent)
    door.TweenLocalPosition(Vector3.zero, 1f, VRCTweenEase.InOutQuad);
}

TweenRotation と TweenLocalRotation

オイラー角を使用して、GameObjectのrotationをアニメーションさせます。

public GameObject lever;

public void PullLever()
{
    // Rotate to world euler angles
    lever.TweenRotation(new Vector3(-45, 0, 0), 0.5f, VRCTweenEase.OutBack);
}

public void ResetLever()
{
    // Rotate to local euler angles (relative to parent)
    lever.TweenLocalRotation(Vector3.zero, 0.5f, VRCTweenEase.InOutQuad);
}

TweenScale

transform.localScaleをアニメーションさせます。Unityのワールド空間におけるscaleは読み取り専用であるため、TweenGlobalScaleのバリエーションは存在しません。

public GameObject pickup;

public void OnPickedUp()
{
    // Shrink to nothing
    pickup.TweenScale(Vector3.zero, 0.3f, VRCTweenEase.InBack);
}

public void OnDropped()
{
    // Pop back to full size
    pickup.TweenScale(Vector3.one, 0.3f, VRCTweenEase.OutBack);
}

パスTween

パスTweenは、GameObjectを一連のウェイポイントに沿って移動させます。ワールド空間のパスには TweenPath を、ローカル空間のパスには TweenLocalPath を使用してください。トランスフォームTweenと同様に、これらは GameObject または Transform のいずれに対しても呼び出すことができます。

TweenPath と TweenLocalPath

GameObjectを複数点のパスに沿ってアニメーションさせます。

public GameObject platform;

public void StartPatrol()
{
    Vector3[] route = new Vector3[] {
        new Vector3(0, 0, 0),
        new Vector3(10, 0, 0),
        new Vector3(10, 0, 10),
        new Vector3(0, 0, 10)
    };

    // Linear path that loops back to the start
    platform.TweenPath(route, 8f, VRCTweenPathType.Linear, true, 10, VRCTweenEase.Linear)
        .SetLoops(-1, VRCTweenLoopType.Restart);
}

直線的なセグメントではなく、滑らかな曲線パスにするには VRCTweenPathType.CatmullRom を使用してください。

public GameObject camera;

public void StartCameraFlythrough()
{
    Vector3[] cameraPath = new Vector3[] {
        new Vector3(0, 2, 0),
        new Vector3(5, 4, 3),
        new Vector3(10, 2, 8),
        new Vector3(15, 3, 5)
    };

    // Smooth curved path
    camera.TweenPath(cameraPath, 6f, VRCTweenPathType.CatmullRom, false, 10, VRCTweenEase.InOutSine)
        .OnComplete(this, nameof(OnFlythroughDone));
}

public void OnFlythroughDone()
{
    Debug.Log("Camera flythrough complete!");
}
パラメータ 説明
waypoints Vector3 位置の配列(最低2点)。メソッドに応じてワールド空間またはローカル空間となります。NaN、Infinity、または極端な大きさの値を含むウェイポイントは拒否されます。入力の検証を参照してください。
pathType 直線セグメントの場合は VRCTweenPathType.Linear 、滑らかな曲線の場合は VRCTweenPathType.CatmullRom を使用します。
closePath true に設定すると、パスは最後のウェイポイントから最初のウェイポイントへ自動的に閉じられます。
resolution CatmullRomパスの曲線の滑らかさ(デフォルトは10、数値が高いほど滑らか)。Linearの場合は無視されます。1〜50の範囲に自動的にクランプされます。
tip

巡回ルートをループさせる場合は、closePathtrue に設定し、.SetLoops(-1, VRCTweenLoopType.Restart) を使用してください。これにより、終点で目に見えるような途切れが発生することなく、シームレスなループが作成されます。

UI Tweens

UI tweenはUnity UIコンポーネントで動作します。メニュー、HUD、インタラクティブな要素のアニメーションに最適です。

TweenColor と TweenFade (Graphic)

Graphic は、ImageTextRawImage などのUI要素の基底クラスです。以下のメソッドは、これらの要素すべてに対して使用できます。

public Image myImage;
public Text myText;

void Start()
{
    // Fade an image to red
    myImage.TweenColor(Color.red, 1f, VRCTweenEase.OutQuad);

    // Fade text to transparent
    myText.TweenFade(0f, 1f, VRCTweenEase.OutQuad);
}

TweenFade (CanvasGroup)

UIパネルやグループ全体をフェードさせます。

public CanvasGroup menuPanel;

public void ShowMenu()
{
    menuPanel.gameObject.SetActive(true);
    menuPanel.TweenFade(1f, 0.5f, VRCTweenEase.OutQuad);
}

public void HideMenu()
{
    menuPanel.TweenFade(0f, 0.5f, VRCTweenEase.OutQuad)
        .OnComplete(this, nameof(OnMenuHidden));
}

public void OnMenuHidden()
{
    menuPanel.gameObject.SetActive(false);
}

TweenValue (Slider)

体力バーやプログレスインジケーターなどのスライダー値をアニメーションさせます。

public Slider healthBar;

public void TakeDamage(float damage)
{
    float newHealth = healthBar.value - damage;
    healthBar.TweenValue(newHealth, 0.3f, VRCTweenEase.OutQuad);
}

TweenAnchorPos

RectTransformのanchored positionをアニメーションさせます。これは、Canvasレイアウト内でUI要素を移動させるための適切な方法です。

public RectTransform notificationPanel;

public void SlideIn()
{
    // Slide from off-screen to center
    notificationPanel.anchoredPosition = new Vector2(-500, 0);
    notificationPanel.TweenAnchorPos(Vector2.zero, 0.5f, VRCTweenEase.OutQuad);
}

public void SlideOut()
{
    notificationPanel.TweenAnchorPos(new Vector2(500, 0), 0.5f, VRCTweenEase.InQuad);
}

TweenSizeDelta

RectTransformのsizeDelta(幅と高さ)をアニメーションさせます。UIパネルのサイズ変更、セクションの展開/折りたたみ、ポップアップのアニメーションなどに役立ちます。

public RectTransform tooltip;

public void ExpandTooltip()
{
    tooltip.TweenSizeDelta(new Vector2(400, 200), 0.3f, VRCTweenEase.OutQuad);
}

public void CollapseTooltip()
{
    tooltip.TweenSizeDelta(Vector2.zero, 0.3f, VRCTweenEase.InQuad);
}

Renderer Tweens

MaterialPropertyBlock を使用して、RendererのマテリアルプロパティをTween(補間)します。これは3Dオブジェクト上のマテリアルプロパティをアニメーションさせる際に推奨される方法であり、マテリアルインスタンスの作成を回避しつつ、GPUインスタンシングにも対応しています。

TweenColor (Renderer)

Rendererの色をアニメーションさせます。デフォルトでは、_Color シェーダープロパティをTweenします。

public Renderer myRenderer;

void Start()
{
    // Tween to red over 1 second
    myRenderer.TweenColor(Color.red, 1f, VRCTweenEase.OutQuad);
}

別のシェーダープロパティをTweenする場合は、プロパティ名を明示的に渡してください。

// Tween the emission color
myRenderer.TweenColor("_EmissionColor", Color.yellow, 1f, VRCTweenEase.OutQuad);

TweenFloat (Renderer)

Rendererの浮動小数点数(float)型のシェーダープロパティをアニメーションさせます。これは、ディゾルブエフェクト、エミッション強度、カットオフ値など、シェーダー駆動のVFXに有用です。

public Renderer myRenderer;

void Start()
{
    // Dissolve effect
    myRenderer.TweenFloat("_DissolveAmount", 1f, 2f, VRCTweenEase.InQuad);

    // Adjust metallic
    myRenderer.TweenFloat("_Metallic", 0.8f, 1f, VRCTweenEase.OutQuad);
}
tip

マテリアルインスペクターで、使用しているシェーダーのプロパティ名を確認してください。一般的な名前として、メインカラーには _Color、エミッションには _EmissionColor、その他 _Metallic_Glossiness_Cutoff などがあります。プロパティを変更しても見た目に変化がない場合は、そのシェーダーが別のプロパティ名を使用している可能性があります。

Light Tweens

Light コンポーネントのプロパティをトゥイーンさせ、昼夜のサイクル、明滅するライト、環境に反応する照明などの動的なライティングエフェクトを作成します。

TweenIntensity (Light)

Light の intensity をアニメーションさせます。

public Light myLight;

public void FadeOutLight()
{
    myLight.TweenIntensity(0f, 2f, VRCTweenEase.OutQuad);
}

public void FlashLight()
{
    myLight.TweenIntensity(5f, 0.1f, VRCTweenEase.OutQuad);
}

TweenColor (Light)

Light の color をアニメーションさせます。

public Light myLight;

void Start()
{
    // Sunset color shift
    myLight.TweenColor(new Color(1f, 0.5f, 0.2f), 3f, VRCTweenEase.InOutSine);
}

オーディオTween

TweenVolume (AudioSource)

オーディオの音量をフェードインまたはフェードアウトします。

public AudioSource musicSource;

public void FadeOutMusic()
{
    musicSource.TweenVolume(0f, 2f, VRCTweenEase.OutQuad);
}

public void FadeInMusic()
{
    musicSource.Play();
    musicSource.TweenVolume(1f, 2f, VRCTweenEase.InQuad);
}

TweenPitch (AudioSource)

AudioSourceのピッチをアニメーションさせます。一般的な範囲は-3から3ですが、有限の値であれば任意の値を指定できます。

public AudioSource engineSource;

public void AccelerateEngine()
{
    engineSource.TweenPitch(2f, 1f, VRCTweenEase.OutQuad);
}

public void DecelerateEngine()
{
    engineSource.TweenPitch(0.5f, 1.5f, VRCTweenEase.InOutQuad);
}

スプライトトゥイーン

2DゲームやスプライトベースのUIに最適です。

public SpriteRenderer mySprite;

void Start()
{
    // Fade sprite color
    mySprite.TweenColor(Color.blue, 1f, VRCTweenEase.OutQuad);

    // Fade sprite to transparent
    mySprite.TweenFade(0f, 1f, VRCTweenEase.OutQuad);
}

最終更新: