組み込みの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の範囲に自動的にクランプされます。 |
巡回ルートをループさせる場合は、closePath を true に設定し、.SetLoops(-1, VRCTweenLoopType.Restart) を使用してください。これにより、終点で目に見えるような途切れが発生することなく、シームレスなループが作成されます。
UI Tweens
UI tweenはUnity UIコンポーネントで動作します。メニュー、HUD、インタラクティブな要素のアニメーションに最適です。
TweenColor と TweenFade (Graphic)
Graphic は、Image、Text、RawImage などの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);
}
マテリアルインスペクターで、使用しているシェーダーのプロパティ名を確認してください。一般的な名前として、メインカラーには _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);
}
最終更新: