Animasi bagian

*Konten ini diterjemahkan menggunakan AI (Beta) dan mungkin mengandung kesalahan. Untuk melihat halaman ini dalam bahasa Inggris, klik di sini.

Pemain dapat mendapatkan umpan balik apakah tindakan mereka melakukan sesuatu dengan animasi atau tidak.Ini bisa menjadi pohon bergetar saat terkena, atau hewan peliharaan bergembira melompat saat diberi makan.Dalam kasus ini, kami akan menunjukkan cara membuat tombol yang bergerak saat pemain mengkliknya.

Tween dengan animasi

Salah satu cara untuk menganimasikan objek adalah menggunakan remaja.A tween , pendek untuk di antara, adalah proses mengubah nilai awal ke nilai akhir dalam jangka waktu tertentu.Anak-anak remaja dapat digunakan untuk mengubah properti seperti posisi, warna, atau rotasi.

Pengaturan proyek

Untuk proyek ini, seorang remaja akan memindahkan objek dari posisi awal ke posisi target.

  1. Tentukan bagian mana yang akan Anda animasikan. Dalam contoh di bawah ini, 1 adalah tombol dan 2 adalah dinding.

  2. Di bagian yang akan bergerak, tambahkan Detektor Klik dan skrip bernama TweenMove. Jangan ganti nama Detektor Klik.

  3. Buka skrip TweenMove. Kemudian, salin dan tempelkan skrip di bawah ini.


    -- Anak remaja mengembalikan bagian ke depan dan ke belakang berdasarkan sumbu yang dipilih
    -- Tombol memiliki status on/off yang memindahkan bagian ke depan atau ke belakang
    local TweenService = game:GetService("TweenService")
    local button = script.Parent
    local clickDetector = button:FindFirstChildWhichIsA("ClickDetector")
    local buttonState = -1 -- Menentukan arah tombol; -1 berarti akan ditekan, 1 berarti akan keluar
    local inTween = false
    -- Variabel yang dapat disesuaikan
    local TWEEN_TIME = 0.15
    local TWEEN_MOVE_DISTANCE = 1.5
    -- Variabel remaja
    local buttonTweenInfo = TweenInfo.new(
    TWEEN_TIME, -- Waktu
    Enum.EasingStyle.Quad, -- Gaya Mudahkan
    Enum.EasingDirection.Out -- Arah Mudahkan
    )
    local function buttonPress()
    -- Jika tombol sedang tweening, hindari agar tidak digunakan lagi
    if inTween == true then
    return
    end
    -- Hitung CFrame baru untuk posisi tombol
    local offsetCFrame = CFrame.new(0, TWEEN_MOVE_DISTANCE * buttonState, 0)
    local newCFrame = button.CFrame:ToWorldSpace(offsetCFrame)
    -- Buat remaja dan mainkan
    local tweenButton = TweenService:Create(button, buttonTweenInfo, {CFrame = newCFrame})
    tweenButton:Play()
    inTween = true
    -- Pada penyelesaian tween, buat tombol dapat digunakan lagi
    tweenButton.Completed:Connect(function()
    inTween = false
    -- Balikkan status tombol
    buttonState *= -1
    end)
    end
    clickDetector.MouseClick:Connect(buttonPress)
  4. Tes ulang dan klik objek.Saat menguji, Anda mungkin memperhatikan bahwa objek bergerak ke arah atau jarak yang salah.Itu dapat disesuaikan di bagian berikutnya.

Arah yang salah; perlu disesuaikan
>

Bergerak dengan benar; tidak perlu penyesuaian

Sesuaikan gerakan tween

Dengan skrip ditambahkan, Anda dapat menyesuaikannya untuk memenuhi kebutuhan gameAnda.Tombol dapat diberi tanda untuk bergerak ke arah seperti ke depan dan ke kembali, atau ke atas dan ke bawah.

Ubah posisi

Ingat, remaja bertransisi dari nilai awal ke nilai tujuan.Skrip ini menggunakan CFrames untuk memindahkan tombol ke arah relatif terhadap posisinya saat ini.Arah itu dikontrol di Baris 28 dari skrip.

Pada baris itu, CFrame baru dibuat menggunakan koordinat X, Y, dan Z. Dalam contoh ini, tombol bergerak relatif terhadap sumbu Y.


-- Hitung CFrame baru untuk posisi tombol
local offsetCFrame = CFrame.new(0, TWEEN_MOVE_DISTANCE * buttonState, 0)
local newCFrame = button.CFrame:ToWorldSpace(offsetCFrame)

Untuk memiliki tombol bergerak dalam arah yang berbeda , cukup ganti salah satu koordinat yang diinginkan dengan baris: TWEEN_MOVE_DISTANCE * buttonState .Atur semua koordinat lainnya ke 0.

Sebagai contoh, baris ini akan memindahkannya relatif ke sumbu X-nya sebagai gantinya.


-- Hitung CFrame baru untuk posisi tombol
local offsetCFrame = CFrame.new( TWEEN_MOVE_DISTANCE * buttonState, 0, 0)
local newCFrame = button.CFrame:ToWorldSpace(offsetCFrame)

Waktu dan jarak Tween

Skrip termasuk variabel berikut yang mempengaruhi gerakan remaja.Nama yang diberi huruf besar seperti TWEEN_TIME ditulis secara khusus untuk skrip ini dimodifikasi.

Coba ubah nilai satu variabel di bawah ini:

  • Baris 11 - TWEEN_TIME : Waktu dalam detik yang dibutuhkan untuk terjadinya remaja.
  • Baris 12 - TWEEN_MOVE_DISTANCE : Jarak yang ditempuh tombol dalam stud.

Membandingkan properti lain

Sebagian besar properti dengan jenis data numerik dapat dibagi.Bagian ini mencakup beberapa properti umum, seperti rotasi, yang dapat digunakan untuk membawa lebih banyak umpan balas pemain ke dalam gameAnda.Ingatlah, Anda juga dapat menyelipkan beberapa properti sekaligus.

Untuk daftar lengkap properti, lihat halaman TweenService.

Memutar

Untuk rotasi, gabungkan tweening dan CFrames alih-alih hanya menggunakan Vector3.Teenase rotasi dapat digunakan untuk membuat makhluk bergoyang saat hewan peliharaan, atau koin berputar saat diambil.

Dalam contoh skrip berikutnya, posisi dan rotasi makhluk sama-sama ditampilkan saat diklik untuk menunjukkan betapa bahagianya saat dipelihara.

Kode di bawah ini akan memutar objek berdasarkan jumlah derajat di TWEEN_ROT_ANGLES .


-- Menggunakan tween untuk membuat objek berputar ke atas dan melenting
local TweenService = game:GetService("TweenService")
local partToTween = script.Parent
local clickDetector = partToTween:FindFirstChildWhichIsA("ClickDetector")
local inTween = false
-- Variabel yang dapat disesuaikan
local TWEEN_TIME = 0.25
local TWEEN_ROT_ANGLES = -45
local TWEEN_MOVE_DISTANCE = 3
-- Variabel remaja
local tweenInfo = TweenInfo.new(
TWEEN_TIME, -- Waktu
Enum.EasingStyle.Quad, -- Gaya Mudahkan
Enum.EasingDirection.Out, -- Arah Mudahkan
1, -- RepeatCount (ketika kurang dari nol remaja akan berputar tanpa batas)
true -- Balik (antara akan membalik saat mencapai tujuannya)
)
local function activateAction()
-- Jika objek sedang tweening, hindari agar tidak tweening lagi
if inTween == true then
return
end
-- Hitung CFrame baru untuk posisi dan rotasi objek
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)
-- Buat remaja dan mainkan
local tweenObject = TweenService:Create(partToTween, tweenInfo, {CFrame = newCFrame})
tweenObject:Play()
inTween = true
-- Pada penyelesaian remaja, buat objek dapat diklik lagi
tweenObject.Completed:Connect(function()
inTween = false
end)
end
clickDetector.MouseClick:Connect(activateAction)

Skalanya

Mengubah ukuran objek dalam game juga dapat menunjukkan bahwa seorang pemain berinteraksi dengan mereka.Sebagai kejadian, pengambilan seperti paket kesehatan atau permata bisa menyusut saat disentuh.Untuk membesarkan bagian, ubah tujuan remaja menjadi Vector3 baru dari ukuran yang diinginkan.


-- Tween skala suku cadang saat disentuh, lalu hancurkan
local TweenService = game:GetService("TweenService")
local partToScale = script.Parent
local inTween = false
-- Variabel yang dapat disesuaikan
local TWEEN_TIME = 1
local TWEEN_SCALE = Vector3.zero
-- Variabel remaja
local tweenInfo = TweenInfo.new(
TWEEN_TIME, -- Waktu
Enum.EasingStyle.Exponential, -- Gaya Mudahkan
Enum.EasingDirection.Out -- Arah Mudahkan
)
local function onPartTouch(otherPart)
-- Jika objek sedang tweening, hindari agar tidak tweening lagi
if inTween == true then
return
end
local partParent = otherPart.Parent
local humanoid = partParent:FindFirstChildWhichIsA("Humanoid")
if humanoid then
-- Mencegah lebih lanjut tabrakan pada objek karena telah diambil
partToScale.CanCollide = false
-- Buat remaja dan mainkan
local tweenObject = TweenService:Create(partToScale, tweenInfo, {Size = TWEEN_SCALE})
tweenObject:Play()
inTween = true
-- Pada penyelesaian remaja, hancurkan objek
tweenObject.Completed:Connect(function()
partToScale:Destroy()
end)
end
end
partToScale.Touched:Connect(onPartTouch)

Perubahan warna

Bagian dapat beralih warna dengan beralih dengan nilai Color3.Sebagai kejadian, musuh atau objek yang dapat dihancurkan dapat menampilkan warna untuk memberikan umpan balik bahwa mereka telah terkena atau diklik.


-- Tween warna objek saat klik dan hancurkan setelah 3 klik
local TweenService = game:GetService("TweenService")
local partToTween = script.Parent
local clickDetector = partToTween:FindFirstChildWhichIsA("ClickDetector")
local inTween = false
-- Variabel yang dapat disesuaikan
local TWEEN_TIME = 0.2
local COLOR_ON_HIT = Color3.fromRGB(255, 0, 50)
local hitCount = 0
-- Variabel remaja
local tweenInfo = TweenInfo.new(
TWEEN_TIME, -- Waktu
Enum.EasingStyle.Exponential, -- Gaya Mudahkan
Enum.EasingDirection.InOut, -- Arah Mudahkan
0, -- RepeatCount (ketika kurang dari nol remaja akan berputar tanpa batas)
true -- Balik (antara akan membalik saat mencapai tujuannya)
)
local function activateAction()
-- Jika objek sedang tweening, hindari agar tidak tweening lagi
if inTween == true then
return
end
-- Buat remaja dan mainkan
local tweenObject = TweenService:Create(partToTween, tweenInfo, {Color = COLOR_ON_HIT})
tweenObject:Play()
inTween = true
-- Pada penyelesaian remaja, buat objek dapat diklik lagi
tweenObject.Completed:Connect(function()
inTween = false
-- Hitungan peningkatan hit
hitCount += 1
-- Setelah 3 pukulan, hancurkan objek
if hitCount == 3 then
partToTween:Destroy()
end
end)
end
clickDetector.MouseClick:Connect(activateAction)

Sementara skrip ini menggunakan Bagian normal untuk mengubah warna, juga dimungkinkan untuk menggunakannya di MeshParts dengan teksur yang diterapkan.MeshParts sering diimpor model 3D, bukan bagian yang dibangun langsung di Roblox Studio.

Jika Anda bekerja dengan MeshPart bertekstur penuh, kami menyarankan hal mengikuti:

  1. Gunakan SpecialMesh alih-alih MeshPart. Ini karena teksur MeshPart menggantikan warna yang ditentukan oleh skrip.

  2. Ubah skrip untuk memodifikasi VertexColor dari SpecialMesh bukan properti Warna.

Contoh proyek

Lihat semua contoh skrip di tempat non-copylocked ini. Dapatkan semua skrip untuk dimodifikasi juga.

Termasuk skrip untuk rotasi, skala, dan perubahan warna remaja.