Animowanie części

Gracze mogą uzyskać opinię, czy ich działania robią coś z animacjami. To może być drżenie drzewa, gdy dotknięto go, lub czy zwierzak wesoło skakuje, gdy karmi się. W tym przypadku pokażemy Ci, jak zrobić przycisk, który się porusza, gdy gracz kliknie na niego.

Animacja

Jednym z sposobów animowania obiektów jest używanie nastolatek. tween , skrót za przeciągnij, jest procesem zmiany wartości początkowej na wartość końcową w określonym czasie. Tweens można używać do zmiany właściwości, takich jak pozycja, kolor lub obrót.

Ustawienia projektu

Dla tego projektu tween przesunie obiekt z początkowej pozycji do pozycji docelowej.

1. Określ, która część będziesz animować. W przykładzie poniżej, 1 jest przyciskiem, a 2 to ściana.

   

2. W części, która się porusza, dodaj klikomierz i skrypt nazyający się TweenMove. Nie zmieniaj nazwy klikomierza.

   

   Jeśli używasz modelu z wieloma częściami, wybierz jedną część do przesunięcia (jak przycisk w tym przykładzie), a umieść skrypt MoveTween jako jego dziecko.

3. Otwórz skrypt TweenMove. Następnie skopiuj i wklej poniższy skrypt.

   -- Przyciąga część w górę i w dół w oparciu o wybrany osi
   -- Przycisk ma strefę włączania/wyłączania, która przesuwa część do przodu lub na tył
   
   local TweenService = game:GetService("TweenService")
   local button = script.Parent
   local clickDetector = button:FindFirstChildWhichIsA("ClickDetector")
   local buttonState = -1  -- Określa kierunek przycisku; -1 oznacza, że naciśnie się w, 1 oznacza, że wyrznie się
   local inTween = false
   
   -- Zmienne
   local TWEEN_TIME = 0.15
   local TWEEN_MOVE_DISTANCE = 1.5
   
   -- Zmienne Tween
   local buttonTweenInfo = TweenInfo.new(
   	TWEEN_TIME,  -- Czas
   	Enum.EasingStyle.Quad,  -- Łatwiejszy styl
   	Enum.EasingDirection.Out  -- Łatwiejsze kierunki
   )
   
   local function buttonPress()
   	-- Jeśli przycisk się zatrzymuje, zapobiegnij użyciu go ponownie
   	if inTween == true then
   		return
   	end
   
   	-- Oblicz nowy CFrame dla pozycji przycisku
   	local offsetCFrame = CFrame.new(0, TWEEN_MOVE_DISTANCE * buttonState, 0)
   	local newCFrame = button.CFrame:ToWorldSpace(offsetCFrame)
   
   	-- Utwórz tween i zagraj w niego
   	local tweenButton = TweenService:Create(button, buttonTweenInfo, {CFrame = newCFrame})
   	tweenButton:Play()
   	inTween = true
   
   	-- Podczas ukończenia tween'a ponownie umożliwь używanie przycisku
   	tweenButton.Completed:Connect(function()
   		inTween = false
   		-- Przywróć stan przycisku
   		buttonState *= -1
   	end)
   
   end
   
   clickDetector.MouseClick:Connect(buttonPress)

4. Zagrajtestuj i kliknij obiekt. Podczas testowania możesz zauważyć, że obiekt porusza złą kierunek lub odległość. To można być dostosowane w następnym sekcji.

Dostosowywanie ruchu Tween

Z dodanym skryptem możesz go dostosować do potrzeb swojej gra. Przycisk można przesuwać, aby poruszać się w kierunkach jak przodem i wsteczlub w górę i w dół.

Zmiana pozycji

Pamiętaj, że nastolatki przejściu z początkowej wartości do wartości celu. Ten skrypt używa CFrame, aby przenieść przycisk w kierunku jego obecnej pozycji. Ten kierunek jest kontrolowany w linii 28 skryptu.

Na tej linii utworzony jest nowy CFrame używając X, Y i Z. W tym przykładzie przycisk porusza się w stosunku do jego osi Y.

-- Oblicz nowy CFrame dla pozycji przycisku
local offsetCFrame = CFrame.new(0, TWEEN_MOVE_DISTANCE * buttonState, 0)
local newCFrame = button.CFrame:ToWorldSpace(offsetCFrame)

Aby mieć przycisk poruszać się w innym kierunku, po prostu zastąp jedną z pożądanych koordynat linią: TWEEN_MOVE_DISTANCE * buttonState . Ustaw wszystkie pozostałe koordynaty na 0.

Na przykład ta linia przesunie się w stosunku do jej osi X zamiast tego.

-- Oblicz nowy CFrame dla pozycji przycisku
local offsetCFrame = CFrame.new( TWEEN_MOVE_DISTANCE * buttonState, 0, 0)
local newCFrame = button.CFrame:ToWorldSpace(offsetCFrame)

Czas i dystans do przycierania

Skrypt zawiera następujące zmienne, które wpływają na ruch tweena. Zmienne nazwane jak TWEEN_TIME są pisane specjalnie dla tego skryptu, aby być zmienione.

Spróbuj zmienić wartość jednej zmiennej poniżej:

• Linia 11 - TWEEN_TIME : Czas w sekundach potrzebny na nadejście tweenu.
• Linia 12 - TWEEN_MOVE_DISTANCE : Dystans, w którym przesuwa się przycisk.

Dostosowywanie innych właściwości

Większość właściwości z liczbowym typem danych można ustawić na tryb. Ta sekcja zawiera kilka popularnych właściwości, takich jak obrót, które można użyć do zbierania więcej opinii graczy w Twojej grze. Pamiętaj, że możesz również ustawić wiele właściwości na raz.

Aby uzyskać pełną listę właściwości, zobacz stronę TweenService API.

Obrót

Do rotacji połącz wstępki i CFrame, zamiast używać tylko Vector3. Wstępki rotacji można używać do łączenia stworzeń, gdy zwierzak lub monety się poruszają, gdy są podnoszone.

W następnym przykładzie skryptu pozycja i obroty kreacji są obie zważane, gdy kliknięto, aby pokazać, jak szczęśliwa jest, gdy jest zwierzęciem.

Poniżej kod będzie obrócić obiekt w zależności od liczby stopni w TWEEN_ROT_ANGLES .

-- Używa tween, aby zesunąć obiekt w górę i zatrąb
local TweenService = game:GetService("TweenService")
local partToTween = script.Parent
local clickDetector = partToTween:FindFirstChildWhichIsA("ClickDetector")
local inTween = false

-- Zmienne
local TWEEN_TIME = 0.25
local TWEEN_ROT_ANGLES = -45
local TWEEN_MOVE_DISTANCE = 3

-- Zmienne Tween
local tweenInfo = TweenInfo.new(
	TWEEN_TIME,  -- Czas
	Enum.EasingStyle.Quad,  -- Łatwiejszy styl
	Enum.EasingDirection.Out,  -- Łatwiejsze kierunki
	1,  -- RepeatCount (jeśli mniejsza niż zero, pętla się nieskończono)
	true  -- Przywraca (tween będzie się odwracać po osiągnięciu celu)
)

local function activateAction()
	-- Jeśli obiekt jest tweening, zapobiegnij mu ponownemu tweeningowi
	if inTween == true then
		return
	end

	-- Oblicz nowy CFrame dla pozycji i rotacji obiektu
	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)

	-- Utwórz tween i zagraj w niego
	local tweenObject = TweenService:Create(partToTween, tweenInfo, {CFrame = newCFrame})
	tweenObject:Play()
	inTween = true

	-- Podczas skończenia tween'a, ponownie uczynić obiekt klikalnym
	tweenObject.Completed:Connect(function()
		inTween = false
	end)
end

clickDetector.MouseClick:Connect(activateAction)

Skalowanie

Zmiana rozmiaru obiektów w grze może również pokazać, że gracz z nimi interagował. Na instancja, pickups, takie jak paczki zdrowia lub klejnoty, mogą ulegać skręceniu, gdy są dotykane. Aby skalować części, zmień cel tweenu na nowy Vector3 pożądanej wielkości.

-- Zmień rozmiar części po dotknięciu, a następnie go zniszcz
local TweenService = game:GetService("TweenService")
local partToScale = script.Parent
local inTween = false

-- Zmienne
local TWEEN_TIME = 1
local TWEEN_SCALE = Vector3.zero

-- Zmienne Tween
local tweenInfo = TweenInfo.new(
	TWEEN_TIME,  -- Czas
	Enum.EasingStyle.Exponential,  -- Łatwiejszy styl
	Enum.EasingDirection.Out  -- Łatwiejsze kierunki
)

local function onPartTouch(otherPart)
	-- Jeśli obiekt jest tweening, zapobiegnij mu ponownemu tweeningowi
	if inTween == true then
		return
    end

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

	if humanoid then
		-- Zapobiecz dalszym kolizjom na obiegu, ponieważ został podniesiony
        partToScale.CanCollide = false

		-- Utwórz tween i zagraj w niego
		local tweenObject = TweenService:Create(partToScale, tweenInfo, {Size = TWEEN_SCALE})
		tweenObject:Play()
        inTween = true

		-- Podczas ukończenia tweenu zniszcz obiekt
		tweenObject.Completed:Connect(function()
			partToScale:Destroy()
		end)
	end
end

partToScale.Touched:Connect(onPartTouch)

Zmiana Koloru

Części mogą przejść kolory poprzez tweening z wartościami Color3. Na instancjawrogowie lub zniszczalne obiekty mogą wyświetlać kolory migotań, aby dać informacje zwrotne, że zostały one dotykane lub kliknięte.

-- Zmień kolor obiektu po kliknięciu i zniszcz go po 3 kliknięciach
local TweenService = game:GetService("TweenService")
local partToTween = script.Parent
local clickDetector = partToTween:FindFirstChildWhichIsA("ClickDetector")
local inTween = false

-- Zmienne niestandardowe
local TWEEN_TIME = 0.2
local COLOR_ON_HIT = Color3.fromRGB(255, 0, 50)
local hitCount = 0

-- Zmienne Tween
local tweenInfo = TweenInfo.new(
	TWEEN_TIME,  -- Czas
	Enum.EasingStyle.Exponential,  -- Łatwiejszy styl
	Enum.EasingDirection.InOut,  -- Łatwiejsze kierunki
	0,  -- RepeatCount (jeśli mniejsza niż zero, pętla się nieskończono)
	true  -- Przywraca (tween będzie się odwracać po osiągnięciu celu)
)

local function activateAction()
	-- Jeśli obiekt jest tweening, zapobiegnij mu ponownemu tweeningowi
	if inTween == true then
		return
	end

	-- Utwórz tween i zagraj w niego
	local tweenObject = TweenService:Create(partToTween, tweenInfo, {Color = COLOR_ON_HIT})
	tweenObject:Play()
	inTween = true

	-- Podczas skończenia tween'a, ponownie uczynić obiekt klikalnym
	tweenObject.Completed:Connect(function()
		inTween = false
		-- Zwiększ liczbę trafień
		hitCount += 1
		-- Po 3 trafieniach zniszcz obiekt
		if hitCount == 3 then
			partToTween:Destroy()
		end
	end)
end

clickDetector.MouseClick:Connect(activateAction)

Podczas gdy ten skrypt używa zwykłej części, aby zmienić kolor, można również użyć go na MeshPart z teksturą zastosowaną. MeshPart są często importowane 3D modele, a nie części budowane bezpośrednio w Roblox Studio.

Jeśli pracujesz z w pełni teksturowanym MeshPart, zalecamy obserwuje:

1. Użyj SpecialMesh zamiast MeshPart. Dzieje się tak dlatego, że tekstura MeshPart'u przekracza kolor, który jest nakładany przez skrypt.

2. Zmień skrypt, aby zmienić kolor VertexColor SpecialMesh zamiast właściwości Kolor.

Przykład Projektu

Zobacz wszystkie przykłady skryptów w tym niezablokowanym miejsce. Zdobądź wszystkie skrypty do modyfikacji również.

Zawiera skrypcje do rotacji, skalowania i zmiany koloru. Zobacz >