RobloxStudioで簡単なアニメーションを作成(Tween)|Robloxゲーム作成メモ

RobloxStudioで簡単なアニメーションを追加するメモになります。サンプルとしてスライド式ドアの開閉を作成してみます。

はじめに

下記にて、RobloxStudioで簡単なお店を作成しました。今回は簡単なアニメーションをTweenを利用して実装してみます。

製作開始

まずは簡単に動作の確認をしていきます。「Part」から「Block」を追加します。

追加した「Part」の名前を「MovePart」に変更、配下に「ProximityPrompt」と「Script」を追加します。

Scriptの中身を下記に変更します。アクションをトリガーしたときにパーツの位置を変更しています。

local part = workspace.MovePart
local prompt = part.ProximityPrompt

prompt.Triggered:Connect(function()
	part.Position = part.Position + Vector3.new(10, 0, 0)
end)

実行してパーツの位置が変更されたらOKです。この時、パーツは瞬間移動しています。

Tweenで実装

スクリプトを下記に変更します。

local TweenService = game:GetService("TweenService")

local part = workspace.MovePart
local prompt = part.ProximityPrompt

local goal = {}
local tweenInfo = TweenInfo.new(5)
local tween = nil

prompt.Triggered:Connect(function()
	
	goal.Position = part.Position + Vector3.new(10, 0, 0)
	tween = TweenService:Create(part, tweenInfo, goal)
	tween:Play()

end)

実行してみると下記のように指定した位置までを補間したアニメーションでパーツが移動します。

Tweenの公式リファレンスは下記です。プロパティ、サンプルなどが載っています。

扉の開閉アニメーション

Tweenを利用してスライド式のドアの開閉を実装していきます。まずは枠を作成します。

扉を2枚作成して、片方は動くようにするため「ProximityPrompt」と「Script」を配下に追加します。

Scriptの中身を下記に変更します。

local TweenService = game:GetService("TweenService")

local Movedoor = script.Parent
local prompt = Movedoor.ProximityPrompt
local SlideLength = 9

local goalClose = {}
goalClose.Position = Movedoor.Position

local goalOpen = {}
goalOpen.Position = Movedoor.Position + Vector3.new(SlideLength, 0, 0)

local tweenInfo = TweenInfo.new(1)

local tweenOpen = TweenService:Create(Movedoor, tweenInfo, goalOpen)
local tweenClose = TweenService:Create(Movedoor, tweenInfo, goalClose)

prompt.Triggered:Connect(function()
	if prompt.ActionText == "Close" then
		tweenClose:Play()
		prompt.ActionText = "Open"
	else
		tweenOpen:Play()
		prompt.ActionText = "Close"
	end
end)

OPENで指定した距離を移動、CLOSEで元に戻ります。実行して下記のように動けばOKです。