2. Animasyonları Olan Hareketli Nesneler

UEFN’de nesnelerini hareket ettirmenin birkaç yolu vardır. Bir dönüşümü doğrudan değiştirmek için TeleportTo[] veya MoveTo() gibi fonksiyonlar ya da bir nesneyi önceden ayarlanmış bir yolda hareket ettirmek için nesne yürütücü gibi başka bir cihaz kullanabilirsin. Ancak animasyon biçiminde başka bir kullanışlı seçenek daha var.

Her Kreatif nesnesinde animasyonlarını oynatmak için kullanabileceğin bir play_animation_controller bulunur. Animasyonların, nesnenin dönüşümünü hareket ettirmeyle ilgili birkaç avantajı vardır. Animasyonlar genellikle MoveTo() veya TeleportTo() ile objeleri hareket ettirmekten daha yumuşak hareketler sunar çünkü bu fonksiyonlar her oyun güncellemesinde bu fonksiyonları çağırmak zorunda kalmanın neden olduğu ağ gecikmesini önler. Animasyonlar ayrıca oyuncularla veya diğer objelerle daha tutarlı çarpışmalar oluşturur ve Nesne Yürütücü cihazı kullanmaya kıyasla objelerin nerede ve nasıl hareket ettiği konusunda daha fazla kontrole sahip olursun. Animasyonları döngü halinde veya pinpon moduyla ileri geri oynatabilirsin.

Animasyonlar ayrıca bir interpolasyon türü seçmene de olanak tanır. İnterpolasyon türü, animasyonunun izleyeceği hız düzenleme türünü veya animasyon eğrisini belirler. Örneğin doğrusal interpolasyon türü, animasyonunu sabit bir hızda oynatırken hızlanan tür yavaş başlar ve sona doğru hızlanır. Animasyonun için doğru interpolasyon türünü seçerek nesnenin farklı noktalarda yavaşlamasını, hızlanmasını veya doğrusal hareket etmesini belirleyebilirsin.

Engellerin için farklı animasyonlar arasında geçiş yapıp aynı nesneleri kullanarak oyuncular için çeşitli görevler yaratabilirsin. Bu bölümde kendi animasyonlarını oluşturmak ve nesnelerini hareket ettirmek için bu güçlü aracı nasıl kullanacağını öğreneceksin!

Animasyon Kontrollerini Ayarlama

Nesnelerinin animasyon kontrollerini ayarlamak için aşağıdaki adımları izle:

1. Verse Gezgini ile movement_behaviors adında yeni bir Verse dosyası oluştur. Bu dosya, nesnelere animasyon eklemek için gerekli olan yardımcı fonksiyonları depolar.

2. { /Fortnite.com/Devices } kullanılıyor, { /Fortnite.com/Devices/CreativeAnimation } kullanılıyor ve { /UnrealEngine.com/Temporary/SpatialMath }kullanılıyor ifadelerini dosyanın üst kısmına ekleyerek bu modülleri içe aktar. Nesnene animasyon uygulamak için bunlara ihtiyacın var.

3. movement_behaviors içerisinde move_to_ease_type adında yeni bir enum oluştur. Bu enum’daki değerler, farklı animasyon hızlanması türlerine karşılık gelir. Bu hızlanma türlerinin her birini InterpolationTypes modülünde görüntüleyebilirsin.

   Verse

        # This file stores functions common to animating creative props using keyframes.
        # It also defines the move_to_ease_type enum to help in building animations.
        using { /Fortnite.com/Devices }
        using { /UnrealEngine.com/Temporary/SpatialMath }
        using { /Fortnite.com/Devices/CreativeAnimation }
   
        # Represents the different movement easing types.
        move_to_ease_type<public> := enum {Linear, Ease, EaseIn, EaseOut, EaseInOut}

   Copy full snippet(8 lines long)

4. X, Y ve Z değerlerinin tamamının 1.0 olarak ayarlandığı durumlarda bir vector3 oluşturan VectorOnes adında yeni bir vector3 tür diğer adı ekle. Bu vektörü daha sonra bazı matematiksel işlemleri kolaylaştırmak için kullanacaksın dolayısıyla bunun için türün diğer adını tanımladığında tekrar tekrar vector3{X:=1.0, Y:=1.0, Z:=1.0} yazmak zorunda kalmazsın.

   Verse

        # Initializes a vector3 with all values set to 1.0.
        VectorOnes<public>:vector3 = vector3{X:=1.0, Y:=1.0, Z:=1.0}

   Copy full snippet(2 lines long)

5. Bir move_to_ease_type alıp bir cubic_bezier_parameters döndüren yeni bir GetCubicBezierForEaseType() metodu ekle.

   Verse

        # Return the cubic_bezier_parameters based on the given move_to_ease_type.
        GetCubicBezierForEaseType(EaseType:move_to_ease_type):cubic_bezier_parameters=
   

   Copy full snippet(2 lines long)

   Kübik bezier, animasyonun kullandığı hızlanma fonksiyonunun türünü tanımlayan dört sayıdan oluşur. Örneğin bir hızlanan eğriye ait parametreler animasyonun başlangıçta yavaşlayıp sonrasında hızlanmasını sağlar. Doğrusal bir eğrinin parametreleri, animasyonun sabit bir hızda oynatılmasını sağlar. Bu değerleri sana özel animasyon eğrileri oluşturmak için tanımlayabilirsin ancak InterpolationTypes modülünde tanımlanan değerleri kullanacağın için bu örnekte tanımlamana gerek yok.

6. GetCubicBezierForEaseType() içerisinde, bir case() ifadesinde, move_to_ease_type fonksiyonunu temel alarak InterpolationTypes modülünden cubic_bezier_parameters alabilirsin. Örneğin, EaseOut, InterpolationTypes.EaseOut değerini, Linear ise InterpolationTypes.Linear vb. döndürmelidir. Tamamlanmış GetCubicBezierForEaseType() fonksiyonun şu şekilde görünmelidir:

   Verse

   # Return the cubic_bezier_parameters based on the given move_to_ease_type.     GetCubicBezierForEaseType(EaseType:move_to_ease_type):cubic_bezier_parameters=
            case (EaseType):
                move_to_ease_type.Linear => InterpolationTypes.Linear
                move_to_ease_type.Ease => InterpolationTypes.Ease
                move_to_ease_type.EaseIn => InterpolationTypes.EaseIn
                move_to_ease_type.EaseOut => InterpolationTypes.EaseOut
                move_to_ease_type.EaseInOut => InterpolationTypes.EaseInOut

   Copy full snippet(7 lines long)

7. movable_prop sınıfına geri dön ve MoveEaseType adında yeni bir düzenlenebilir move_to_ease_type ekle. Bu, nesnenin animasyonuna uygulayacağı hızlanma türüdür.

   Verse

        # The type of animation easing to apply to the RootProp's movement. The easing type
        # changes the speed of the animation based on its animation curve.
        @editable {ToolTip := MoveEaseTypeTip}
        MoveEaseType:move_to_ease_type = move_to_ease_type.EaseInOut
   

   Copy full snippet(4 lines long)

Anahtar Karelerle Animasyon Oluşturma

Kodda animasyonlar oluşturmak için anahtar kareleri kullan. Animasyonlar bir veya daha fazla anahtar kare ile yapılır ve her anahtar kare, animasyonun belirli noktalarındaki objenin değerlerini belirtir. Anahtar kareleri ile bir animasyon oluşturarak, nesnenin hareket edeceği, döneceği veya hatta ölçekleneceği birden fazla nokta belirleyebilirsin.

Anahtar karelerin beş değeri vardır. DeltaLocation, DeltaRotation ve DeltaScale, nesnenin anahtar karenin başlangıcından sonuna kadar yaptığı her bir değerdeki değişiklikleri belirtir. Ayrıca Time veya animasyonun saniye cinsinden süresi ve Interpolation ya da anahtar kare için interpolasyon modu bulunur. Örnek bir anahtar kare şu şekilde olabilir:

    # An example keyframe.
    KeyFrame := keyframe_delta:

        # The target position of the `creative_prop`. This is the difference between the starting and ending translation of the prop.
        DeltaLocation := EndTransform.Translation - StartTransform.Translation,

        # The target rotation for the `creative_prop` to rotate to.
        DeltaRotation := EndTransform.Rotation,

        # The target scale for the `creative_prop`. Scale is multiplicative to the starting Scale of the `creative_prop`

Anahtar kareleri kullanarak bir animasyon oluşturmak için şu adımları izle:

1. movement_behaviors dosyana MoveToEase() adında yeni bir creative_prop uzantı metodu ekle. Bu fonksiyon, hareket ettirilecek nesnenin konumunu, dönüşünü ve ölçeğini, animasyonun ne kadar süreceğini, hareket hız düzenleme türünü ve animasyon modunu belirler.

   Verse

        # Animate a creative_prop by constructing an animation from a single keyframe, and then playing that animation on the prop.
        # This method takes a Position, Rotation, and Scale for the prop to end at, the duration of the animation,
        # the type of easing to apply to the movement, and the animation mode of the animation.
        (CreativeProp:creative_prop).MoveToEase<public>(Position:vector3, Rotation:rotation, Scale:vector3, Duration:float, EaseType:move_to_ease_type, AnimationMode:animation_mode)<suspends>:void=

   Copy full snippet(4 lines long)

2. MoveToEase() içerisinde, GetAnimationController[] kullanarak Kreatif nesnesinin animasyon denetleyicisini al. Animasyon denetleyicisi, nesne üzerinde animasyonlar oynatmanı sağlar ve ayrıca daha sonra bekleyeceğin bir olayı çıkarır.

   Verse

        (CreativeProp:creative_prop).MoveToEase<public>(Position:vector3, Rotation:rotation, Scale:vector3, Duration:float, EaseType:move_to_ease_type, AnimationMode:animation_mode)<suspends>:void=
            # Get the animation controller for the CreativeProp to move.
            if (AnimController := CreativeProp.GetAnimationController[]):

   Copy full snippet(3 lines long)

3. ScaleMultiplicative adı verilen ölçekte nesne değişikliğini hesapla. Scale, bu durumda biraz daha karmaşıktır. Ölçek çarpımsal olduğundan son dönüşümün ölçeği, ölçeklenmesi gereken miktarda değil orijinal dönüşümün ölçeklenmesi gereken miktarda olmalıdır. Örneğin, orijinal dönüşümün ölçeği 1.2 ise ve 1.5 değerine ölçeklemek istiyorsan 1.2 * 1.25 = 1.5 olduğundan aslında 1.25 değerine ölçeklemen gerekir. Son değer, VectorOnes değeridir ve yeni ölçekle eski ölçek arasındaki farkın eski ölçeğe bölümüdür. Animasyon sırasında boyutunu değiştirirsen animasyonun doğru bir biçimde uygulanmaya devam etmesi için bu değere ihtiyacın var.

   Verse

        # Calculate the multiplicative scale for the keyframe to scale to.
        ScaleMultiplicative:vector3 = VectorOnes + ((Scale - CreativeProp.GetTransform().Scale) / CreativeProp.GetTransform().Scale)
   

   Copy full snippet(2 lines long)

4. Her animasyon için çalıştırılacak anahtar kare dizisi gereklidir. Bu fonksiyonda tek bir anahtar kare kullanıp bir diziye dönüştürürsün. Bu dizide yalnızca tek bir anahtar kare olacağından, nesnen yeni bir konuma sorunsuz bir şekilde animasyon uygulamak için tek bir hareket yapacaktır. Ayrıca bir döngü içinde MoveToEase() çağıracağın için nesne, satırda art arda birden fazla animasyon belirtmeye gerek kalmadan animasyon oluşturmaya devam edebilir.

   Keyframes adında yeni bir keyframe_delta dizisi tanımla. Bu diziyi yeni bir diziye eşitle ve bu dizinin içinde yeni bir keyfram_delta oluştur.

   Verse

    # Build the keyframe array from a single keyframe_delta of the given values.
    Keyframes:[]keyframe_delta = array:
            keyframe_delta:
   

   Copy full snippet(3 lines long)

5. keyframe_delta tanımında, anahtar kareni oluşturmak için gereken her bir değeri başlat. DeltaLocation değerini yeni Position ile Kreatif nesnesinin yer değiştirmesi arasındaki farka ayarla. DeltaRotation değerini Rotation, DeltaScale değerini ise daha önce hesapladığın ScaleMultiplicative olarak ayarla. Time değerini Duration olarak ayarla ve GetCubicBezierForEaseType() çağrısı yaparak doğru Interpolation değerini elde et.

   Verse

        # Build the keyframe array from a single keyframe_delta of the given values.
        Keyframes:[]keyframe_delta = array:
            keyframe_delta:
                DeltaLocation := Position - CreativeProp.GetTransform().Translation,
                DeltaRotation := Rotation,
                DeltaScale := ScaleMultiplicative,
                Time := Duration,
                Interpolation := GetCubicBezierForEaseType(EaseType)
   

   Copy full snippet(8 lines long)

6. Keyframes dizin oluşturulduktan sonra, bunu SetAnimation() ile AnimationMode modunu geçirerek animasyon denetleyicisinin animasyonu olarak ayarla. Animasyonu Play() ardından Await() MovementCompletedEvent ile oynat. Tamamlanmış MoveToEase() uzantı metodun şöyle görünmelidir:

   Verse

        # Animate a creative_prop by constructing an animation from a single keyframe, and then playing that animation on the prop.
        # This method takes a Position, Rotation, and Scale for the prop to end at, the duration of the animation,
        # the type of easing to apply to the movement, and the animation mode of the animation.
        (CreativeProp:creative_prop).MoveToEase<public>(Position:vector3, Rotation:rotation, Scale:vector3, Duration:float, EaseType:move_to_ease_type, AnimationMode:animation_mode)<suspends>:void=
   
            # Get the animation controller for the CreativeProp to move.
            if (AnimController := CreativeProp.GetAnimationController[]):
   
                # Calculate the multiplicative scale for the keyframe to scale to.
                ScaleMultiplicative:vector3 = VectorOnes + ((Scale - CreativeProp.GetTransform().Scale) / CreativeProp.GetTransform().Scale)
   
   Expand code Copy full snippet(24 lines long)

Fonksiyonları Aşırı Yükleme

Yazdığın MoveToEase() fonksiyonu kullanışlı olsa da fonksiyonu her çağırmak istediğinde bu kadar çok sayıda değişkeni fonksiyona geçirmek karmaşık olabilir. Nesne dönüşümünün yer değiştirme veya dönme gibi yalnızca bir bölümünü değiştirmek istediğin durumlar olabilir ve bu durumda çağrılacak daha basit bir fonksiyona sahip olmak faydalı olabilir.

Bu sorunu çözmek için fonksiyon aşırı yüklemesinden yararlanabilirsin. MoveToEase() fonksiyonunu aşırı yükleyerek farklı girdilerin türlerini işlemek için aynı ada sahip birden fazla metot ayarlayabilirsin. Aşırı yüklenmiş fonksiyonları ayarlamak için aşağıdaki adımları izle.

1. movement_behaviors dosyanda, aynı ada ancak farklı girdilere sahip başka bir uzantı metodu oluşturarak MoveToEase() fonksiyonunu aşırı yükle. Bu MoveToEase() yalnızca nesne yer değiştirmesini günceller, dönüşü ve ölçeği aynı bırakır. Yani yalnızca Position, Duration, EaseType ve AnimationMode bağımsız değişkenlerine ihtiyacın vardır.

   Verse

        # An overload of MoveToEase() that changes the position of the prop while keeping the rotation and scale the same.
        (CreativeProp:creative_prop).MoveToEase<public>(Position:vector3, Duration:float, EaseType:move_to_ease_type, AnimationMode:animation_mode)<suspends>:void=

   Copy full snippet(2 lines long)

2. Yeni MoveToEase() fonksiyonunda tüm girdilerinin yanında IdentityRotation() ve VectorOnes değerlerini Scale olarak ileterek orijinal MoveToEase() fonksiyonunu çağır. IdentityRotation(), her değerin 0 olduğu bir dönüş döndürür: (0,0,0). Animasyonuna dönüş eklemek istemediğin için IdentityRotation() burada gerekli. Aşırı yüklü MoveToEase() fonksiyonun şu şekilde görünmelidir:

   Verse

        # An overload of MoveToEase() that changes the position of the prop while keeping the rotation and scale the same.
        (CreativeProp:creative_prop).MoveToEase<public>(Position:vector3, Duration:float, EaseType:move_to_ease_type, AnimationMode:animation_mode)<suspends>:void=
            CreativeProp.MoveToEase(Position, IdentityRotation(), VectorOnes, Duration, EaseType, AnimationMode)

   Copy full snippet(3 lines long)

3. Yer değiştirmeyi ve ölçeği aynı tutarak yalnızca dönüşü değiştiren başka bir aşırı yüklenmiş metot oluşturmak için bu işlemi tekrarla. Bu yeni aşırı yüklenmiş metot şu şekilde görünmelidir:

   Verse

        # An overload of MoveToEase() that changes the rotation of the prop while keeping the position and scale the same.
        (CreativeProp:creative_prop).MoveToEase<public>(Rotation:rotation, Duration:float, EaseType:move_to_ease_type, AnimationMode:animation_mode)<suspends>:void=
            CreativeProp.MoveToEase(CreativeProp.GetTransform().Translation, Rotation, VectorOnes, Duration, EaseType, AnimationMode)

   Copy full snippet(3 lines long)

4. Yer değiştirmeyi ve dönüşü aynı tutarak yalnızca ölçeği değiştiren bir metot oluşturmak için bu işlemi yeniden tekrarla. Ancak, translation ve scale, vector3 olduğundan, ortaya çıkan fonksiyon, yer değiştirme için yaptığın aşırı yüklemeyle aynı imzaya sahip olur ve bir hata verir. Bunu, fonksiyon parametrelerini yeniden sıralayarak çözebilirsin. Aşırı yüklenmiş fonksiyonunu almak için Duration ve Scale konumunu değiştir. Aşırı yüklenmiş metot şu şekilde görünmelidir:

   Verse

        # An overload of MoveToEase() that changes the position and scale of the prop while keeping the rotation the same.
        (CreativeProp:creative_prop).MoveToEase<public>(Duration:float, Scale:vector3, EaseType:move_to_ease_type, AnimationMode:animation_mode)<suspends>:void=
            CreativeProp.MoveToEase(CreativeProp.GetTransform().Translation, IdentityRotation(), Scale, Duration, EaseType, AnimationMode)

   Copy full snippet(3 lines long)

5. Birden fazla anahtar kare işleyebilen MoveToEase() sürümüne sahip olmak faydalıdır. Bunu, anahtar kareleri önceden ayarlayıp tümünü MoveToEase() fonksiyonuna geçirerek işleyebilirsin. Bu şekilde fonksiyonun, animasyonu yalnızca Kreatif nesnesinde ayarlaması ve oynatması gerekir. Bir anahtar kare dizisi ve animasyon modunu girdi olarak alan yeni bir MoveToEase() aşırı yüklemesi ekle.

   Verse

        # An overload of MoveToEase() that takes a pre-built array of keyframes and plays an animation.
        (CreativeProp:creative_prop).MoveToEase<public>(Keyframes:[]keyframe_delta, AnimationMode:animation_mode)<suspends>:void=
            if (AnimController := CreativeProp.GetAnimationController[]):
                AnimController.SetAnimation(Keyframes, ?Mode:=AnimationMode)
                AnimController.Play()
                AnimController.MovementCompleteEvent.Await()

   Copy full snippet(6 lines long)

6. Kodunu kaydet ve derle.

Metotlarını ayarladıktan sonra harekete geçme zamanı! Bir sonraki bölümde, hareketli platformlar oluşturmak için nesneleri çevireceksin!

• 

  3. Nesnelerin Yerini Değiştirme

  Bir Fall Guys parkuru için engeller ayarlamak üzere Verse ile yer değiştirmeyi kullan.

Tam Kod

Bu bölümde oluşturulan kodun tamamı şöyledir:

movement_behaviors.verse

# This file stores functions common to animating creative props using keyframes.
# It also defines the move_to_ease_type enum to help in building animations.
using { /Fortnite.com/Devices }
using { /UnrealEngine.com/Temporary/SpatialMath }
using { /Fortnite.com/Characters}
using { /Fortnite.com/Devices/CreativeAnimation }

# Represents the different movement easing types.
move_to_ease_type<public> := enum {Linear, Ease, EaseIn, EaseOut, EaseInOut}