แอนิเมชั่นส่วน

ผู้เล่นสามารถรับข้อเสนอแนะได้ว่าการกระทำของพวกเขามีอะไรเกี่ยวกับแอนิเมชั่นหรือไม่นี่อาจเป็นต้นไม้สั่นเมื่อโดน หรือสัตว์เลี้ยงกระโดดอย่างมีความสุขเมื่อได้รับอาหารในกรณีนี้เราจะแสดงวิธีการสร้างปุ่มที่เคลื่อนเมื่อผู้เล่นคลิก

ทวีนกับแอนิเมชั่น

วิธีหนึ่งในการแอนิเมชั่นวัตถุคือการใช้วัยรุ่นA ทวีน สั้นสำหรับระหว่างทางเป็นกระบวนการเปลี่ยนมูลค่าเริ่มต้นเป็นมูลค่าสิ้นสุดภายในระยะเวลาที่กำหนดวัยรุ่นสามารถใช้เพื่อเปลี่ยนคุณสมบัติเช่นตำแหน่ง สี หรือการหมุน

การตั้งค่าโครงการ

สำหรับโครงการนี้ วัยรุ่นจะย้ายวัตถุจากตำแหน่งเริ่มต้นไปยังตำแหน่งเป้าหมาย

1. กำหนดส่วนที่คุณจะแอนิเมชั่น ในตัวอย่างด้านล่าง 1 คือปุ่มและ 2 คือผนัง

   

2. ในส่วนที่จะเคลื่อนที่เพิ่ม ClickDetector และสคริปต์ชื่อ TweenMove อย่าเปลี่ยนชื่อ ClickDetector

   

   หากคุณกำลังใช้รูปแบบที่มีหลายส่วน เลือกส่วนหนึ่งที่จะย้าย (เช่นปุ่มในตัวอย่างนี้) และใส่สคริปต์ MoveTween เป็นลูก

3. เปิดสคริปต์ TweenMove จากนั้นคัดลอกและวางสคริปต์ด้านล่าง

   -- วัยรุ่นหมุนส่วนกลับไปมาตามแกนที่เลือก
   -- ปุ่มมีสถานะเปิด/ปิดซึ่งเคลื่อนส่วนไปข้างหน้าหรือข้างหลัง
   
   local TweenService = game:GetService("TweenService")
   local button = script.Parent
   local clickDetector = button:FindFirstChildWhichIsA("ClickDetector")
   local buttonState = -1  -- กำหนดทิศทางของปุ่ม; -1 หมายถึงจะกดลง, 1 หมายถึงจะป๊อปออก
   local inTween = false
   
   -- ตัวแปรที่ปรับแต่งได้
   local TWEEN_TIME = 0.15
   local TWEEN_MOVE_DISTANCE = 1.5
   
   -- ตัวแปรระหว่างทีวีน
   local buttonTweenInfo = TweenInfo.new(
   	TWEEN_TIME, -- เวลา
   	Enum.EasingStyle.Quad, -- สไตล์การผ่อนคลาย
   	Enum.EasingDirection.Out -- ทิศทางการผ่อนคลาย
   )
   
   local function buttonPress()
   	-- หากปุ่มกำลังเปลี่ยนสถานะ, ป้องกันไม่ให้ใช้อีกครั้ง
   	if inTween == true then
   		return
   	end
   
   	-- คำนวณ CFrame ใหม่สำหรับตำแหน่งปุ่ม
   	local offsetCFrame = CFrame.new(0, TWEEN_MOVE_DISTANCE * buttonState, 0)
   	local newCFrame = button.CFrame:ToWorldSpace(offsetCFrame)
   
   	-- สร้างทีนและเล่นมัน
   	local tweenButton = TweenService:Create(button, buttonTweenInfo, {CFrame = newCFrame})
   	tweenButton:Play()
   	inTween = true
   
   	-- เมื่อเสร็จสิ้นกลางวัยทำให้ปุ่มใช้งานได้อีกครั้ง
   	tweenButton.Completed:Connect(function()
   		inTween = false
   		-- ย้อนสถานะปุ่ม
   		buttonState *= -1
   	end)
   
   end
   
   clickDetector.MouseClick:Connect(buttonPress)

4. ทดสอบและคลิกที่วัตถุในระหว่างการทดสอบคุณอาจสังเกตเห็นว่าวัตถุเคลื่อนที่ไปในทิศทางหรือระยะทางที่ผิดสามารถปรับแต่งได้ในส่วนถัดไป

ปรับทีวีเคลื่อนที่

เมื่อเพิ่มสคริปต์แล้ว ย้อนกลับหรือขึ้นและลง

เปลี่ยนตำแหน่ง

จำไว้ว่าวัยรุ่นเปลี่ยนจากมูลค่าเริ่มต้นเป็นมูลค่าเป้าหมายสคริปต์นี้ใช้ CFrames เพื่อย้ายปุ่มไปในทิศทางที่เกี่ยวข้องกับตำแหน่งปัจจุบันทิศทางนั้นถูกควบคุมใน เส้น 28 ของสคริปต์

ในบรรทัดนั้น CFrame ใหม่ถูกสร้างขึ้นโดยใช้ X, Y และ Z ในการคำนวณ ในตัวอย่างนี้ปุ่มจะเคลื่อนที่เป็นสัดส่วนกับแกน Y

-- คำนวณ CFrame ใหม่สำหรับตำแหน่งปุ่ม
local offsetCFrame = CFrame.new(0, TWEEN_MOVE_DISTANCE * buttonState, 0)
local newCFrame = button.CFrame:ToWorldSpace(offsetCFrame)

เพื่อให้ปุ่มเคลื่อนที่ในทิศทางที่แตกต่างกัน เพียงแค่เปลี่ยนหนึ่งในพิกัดที่ต้องการด้วยเส้น: ตั้งค่าพิกัดอื่น ๆ ทั้งหมดเป็น 0

ตัวอย่างเช่น บรรทัดนี้จะย้ายไปเป็นค่าเฉพาะในแกน X แทน

-- คำนวณ CFrame ใหม่สำหรับตำแหน่งปุ่ม
local offsetCFrame = CFrame.new( TWEEN_MOVE_DISTANCE * buttonState, 0, 0)
local newCFrame = button.CFrame:ToWorldSpace(offsetCFrame)

เวลาและระยะทางระหว่างทีวีน

สคริปต์รวมถึงตัวแปรต่อไปนี้ที่มีผลต่อการเคลื่อนไหวของวัยรุ่นชื่อยศตัวหนาเช่น TWEEN_TIME ถูกเขียนขึ้นเป็นพิเศษเพื่อแก้ไขสคริปต์นี้

ลองเปลี่ยนค่าของตัวแปรหนึ่งด้านล่าง:

• บรรทัด 11 - TWEEN_TIME : เวลาในวินาทีที่ใช้สำหรับการเกิดขึ้นของวัยรุ่น
• บรรทัด 12 - TWEEN_MOVE_DISTANCE : ระยะที่ปุ่มเคลื่อนที่ในสตัด:

เปรียบเทียบคุณสมบัติอื่นๆ

คุณสมบัติส่วนใหญ่ที่มีประเภทข้อมูลเชิงตัวเลขสามารถแบ่งได้ส่วนนี้รวมถึงคุณสมบัติทั่วไปบางอย่าง เช่น การหมุน ซึ่งสามารถใช้เพื่อนําความคิดเห็นของผู้เล่นเพิ่มเติมเข้าสู่เกมของคุณโปรดจำไว้ว่าคุณยังสามารถแยกหลายคุณสมบัติได้ในครั้งเดียว

สำหรับรายการคุณสมบัติทั้งหมด ดูที่หน้า API TweenService

หมุน

สำหรับการหมุนรวมการทวีนและ CFrames แทนที่จะใช้เพียง Vector3วัยรุ่นหมุนสามารถใช้เพื่อทำให้สิ่งมีชีวิตกระพือเมื่อสัตว์เลี้ยงหรือเหรียญหมุนเมื่อถูกหยิบขึ้นมา

ในตัวอย่างสคริปต์ต่อไป ตำแหน่งและการหมุนของสิ่งมีชีวิตจะถูกแบ่งออกเป็นสองส่วนเมื่อคลิกเพื่อแสดงว่ามันมีความสุขแค่ไหนเมื่อถูกเลี้ยง

โค้ดด้านล่างจะหมุนวัตถุตามจํานวนองศาใน TWEEN_ROT_ANGLES

-- ใช้ทวีนเพื่อทำให้วัตถุหมุนขึ้นและเด้งขึ้น
local TweenService = game:GetService("TweenService")
local partToTween = script.Parent
local clickDetector = partToTween:FindFirstChildWhichIsA("ClickDetector")
local inTween = false

-- ตัวแปรที่ปรับแต่งได้
local TWEEN_TIME = 0.25
local TWEEN_ROT_ANGLES = -45
local TWEEN_MOVE_DISTANCE = 3

-- ตัวแปรระหว่างทีวีน
local tweenInfo = TweenInfo.new(
	TWEEN_TIME, -- เวลา
	Enum.EasingStyle.Quad, -- สไตล์การผ่อนคลาย
	Enum.EasingDirection.Out, -- ทิศทางการผ่อนคลาย
	1, -- จำนวนการทำซ้ำ (เมื่อน้อยกว่าศูนย์ทวีนจะทำซ้ำอย่างไม่มีกำหนด)
	true  -- ย้อนกลับ (ระหว่างจะย้อนกลับเมื่อถึงเป้าหมายแล้ว)
)

local function activateAction()
	-- หากวัตถุกำลังเปลี่ยนแปลง, ป้องกันไม่ให้มันถูกเปลี่ยนแปลงอีกครั้ง
	if inTween == true then
		return
	end

	-- คำนวณ CFrame ใหม่สำหรับตำแหน่งและการหมุนของวัตถุ
	local offsetCFrame = CFrame.new(0, TWEEN_MOVE_DISTANCE, 0)
	local rotatedCFrame = CFrame.Angles(math.rad(TWEEN_ROT_ANGLES), 0, 0)
	offsetCFrame = offsetCFrame:ToWorldSpace(rotatedCFrame)
	local newCFrame = partToTween.CFrame:ToWorldSpace(offsetCFrame)

	-- สร้างทีนและเล่นมัน
	local tweenObject = TweenService:Create(partToTween, tweenInfo, {CFrame = newCFrame})
	tweenObject:Play()
	inTween = true

	-- เมื่อเสร็จสิ้นการโต้ตอบ ทำให้วัตถุกดได้อีกครั้ง
	tweenObject.Completed:Connect(function()
		inTween = false
	end)
end

clickDetector.MouseClick:Connect(activateAction)

ขนาด

การเปลี่ยนขนาดของวัตถุในเกมยังสามารถแสดงได้ว่าผู้เล่นโต้ตอบกับพวกเขาตัวอย่างเช่นการรับสิ่งของเช่นแพ็คสุขภาพหรืออัญมณีสามารถหดเมื่อสัมผัสเพื่อขยายชิ้นส่วน เปลี่ยนเป้าหมายวัยรุ่นเป็น Vector3 ใหม่ของขนาดที่ต้องการ

-- แบ่งเครื่องชั่งของส่วนเมื่อสัมผัสแล้วทำลาย
local TweenService = game:GetService("TweenService")
local partToScale = script.Parent
local inTween = false

-- ตัวแปรที่ปรับแต่งได้
local TWEEN_TIME = 1
local TWEEN_SCALE = Vector3.zero

-- ตัวแปรระหว่างทีวีน
local tweenInfo = TweenInfo.new(
	TWEEN_TIME, -- เวลา
	Enum.EasingStyle.Exponential, -- สไตล์การผ่อนคลาย
	Enum.EasingDirection.Out  -- ทิศทางการผ่อนคลาย
)

local function onPartTouch(otherPart)
	-- หากวัตถุกำลังเปลี่ยนแปลง, ป้องกันไม่ให้มันถูกเปลี่ยนแปลงอีกครั้ง
	if inTween == true then
		return
    end

	local partParent = otherPart.Parent
    local humanoid = partParent:FindFirstChildWhichIsA("Humanoid")

	if humanoid then
		-- ป้องกันการชนกันเพิ่มเติมบนวัตถุเนื่องจากถูกหยิบขึ้นมาแล้ว
        partToScale.CanCollide = false

		-- สร้างทีนและเล่นมัน
		local tweenObject = TweenService:Create(partToScale, tweenInfo, {Size = TWEEN_SCALE})
		tweenObject:Play()
        inTween = true

		-- เมื่อทำการสิ้นสุดในวัยรุ่น ทำลายวัตถุ
		tweenObject.Completed:Connect(function()
			partToScale:Destroy()
		end)
	end
end

partToScale.Touched:Connect(onPartTouch)

การเปลี่ยนสี

ชิ้นส่วนสามารถเปลี่ยนสีได้โดยใช้ค่า Color3 อินสแตนซ์ศัตรูหรือวัตถุที่ทำลายได้สามารถแสดงสีเพื่อให้ข้อเสนอแนะว่าพวกเขาถูกโจมตีหรือคลิก

-- เปลี่ยนสีของวัตถุเมื่อคลิกและทำลายหลังจาก 3 คลิก
local TweenService = game:GetService("TweenService")
local partToTween = script.Parent
local clickDetector = partToTween:FindFirstChildWhichIsA("ClickDetector")
local inTween = false

-- ตัวแปรที่ปรับแต่งได้
local TWEEN_TIME = 0.2
local COLOR_ON_HIT = Color3.fromRGB(255, 0, 50)
local hitCount = 0

-- ตัวแปรระหว่างทีวีน
local tweenInfo = TweenInfo.new(
	TWEEN_TIME, -- เวลา
	Enum.EasingStyle.Exponential, -- สไตล์การผ่อนคลาย
	Enum.EasingDirection.InOut, -- ทิศทางการผ่อนคลาย
	0, -- จำนวนการทำซ้ำ (เมื่อน้อยกว่าศูนย์ทวีนจะทำซ้ำอย่างไม่มีกำหนด)
	true  -- ย้อนกลับ (ระหว่างจะย้อนกลับเมื่อถึงเป้าหมายแล้ว)
)

local function activateAction()
	-- หากวัตถุกำลังเปลี่ยนแปลง, ป้องกันไม่ให้มันถูกเปลี่ยนแปลงอีกครั้ง
	if inTween == true then
		return
	end

	-- สร้างทีนและเล่นมัน
	local tweenObject = TweenService:Create(partToTween, tweenInfo, {Color = COLOR_ON_HIT})
	tweenObject:Play()
	inTween = true

	-- เมื่อเสร็จสิ้นการโต้ตอบ ทำให้วัตถุกดได้อีกครั้ง
	tweenObject.Completed:Connect(function()
		inTween = false
		-- เพิ่มจํานวนการโจมตี
		hitCount += 1
		-- หลังจาก 3 คลิกทำลายวัตถุ
		if hitCount == 3 then
			partToTween:Destroy()
		end
	end)
end

clickDetector.MouseClick:Connect(activateAction)

ในขณะที่สคริปต์นี้ใช้ส่วนปกติเพื่อเปลี่ยนสี แต่ยังเป็นไปได้ที่จะใช้สิ่งนี้กับ MeshParts ที่มีเทกเจอร์ที่ใช้แล้วชิ้นส่วนเมชจะนำเข้าโมเดล 3D บ่อยกว่าที่จะสร้างชิ้นส่วนโดยตรงใน Roblox Studio

หากคุณกำลังทำงานกับ MeshPart ที่มีพื้นผิวเต็ม กำลังติดตาม:

1. ใช้ SpecialMesh แทน MeshPart เนื่องจากเทกเจอร์ของ MeshPart ทำการแทนที่สีที่ถูกเปลี่ยนโดยสคริปต์

2. เปลี่ยนสคริปต์เพื่อแก้ไข VertexColor ของ SpecialMesh แทนที่จะเป็นคุณสมบัติสี

ตัวอย่างโครงการ

ดูตัวอย่างสคริปต์ทั้งหมดในสถานที่ที่ไม่ได้ล็อคสำเนา รับสคริปต์ทั้งหมดเพื่อแก้ไขเช่นกัน

รวมสคริปต์สำหรับการหมุน, การขยาย, และการเปลี่ยนสีวัยรุ่น ดู