tünel etkisi cocos2d


12

COCOS2D'de (iOS) benzer bir tünel efekti oluşturmak istiyorum. Herhangi bir işaretçi önerebilir mi?

Ref Görüntüsü

ref Video 1

ref Video 2

Şimdiye kadar azalan ölçeğe sahip birkaç merkez şekli spreyi denedim ve merkezi aynı noktaya konumlandırdım ve her küçük sprite için Z'yi de azalttım.

Bununla, CCScaleTo ile canlandırın ve animasyon süresi ile boyutu 2.0 olarak değiştirin, ancak referansta gösterilen tünel efektine yakın bir şekilde gelmez.

Teşekkürler, sam

Yanıtlar:


10

Bu açıklamanın yazarından uygulama açıklamasını buldum:

2B düzlemde derinlik yanılsaması yaratmak kesinlikle çok işti.

Prensip çok kolay olsa da: daireler ekranın ortasında 0 ölçeğiyle başlar. Sonra tünelin ilk çemberi geçen zamanla orantılı olarak ölçeklenmeye başlar (doğrusal ölçekleme çalışmaz) ve bir süre sonra ikinci daire ölçeklemeye başlar , sonra 3. ve 4. vb.

Daha sonra daireler için alfa değerini orantılı olarak düşürürsünüz (en arkadaki olanlar, bulanıklık yanılsaması vermek için önde olanlardan daha düşük alfa değerine sahiptir), her dairenin izlemesi gereken bir yol tanımlarsınız, X ve Y'yi hareket ettirirsiniz. koordinatları, ekranın ortasına bir uzay gemisi koymak. Cihazın yatırılması, tünelin sola ve sağa, yukarı ve aşağı kaymasını sağlar (ancak bu, uzay gemisinin hareket ettiği izlenimini verir!).

Daireler ekranın dışına çıktığında, hızla soluyorlar ve başlangıç ​​pozisyonlarına geri dönüyorlar (hafızadan tasarruf etmek için yeni daireler oluşturmam gerekmiyor ama aynı olanları tekrar kullanıyorum).

İngilizcem için üzgünüm, ama umarım bu genel fikri açıklar :)


1

Z değerinin ve ölçeğinin azaldığı çoklu halka spritelarına sahip olmak için neredeyse oradasınız. Hepsini ortalamayın.

Tünelin uzaktaki olay ufkuna çarpmasını istediğiniz noktayı takip etmelisiniz. İstediğiniz zaman bu noktayı zaman içinde hareket ettirebilirsiniz.

Daha sonra, her yeni hareketli grafiği yerleştirirken, o noktaya yerleştirin, küçük ölçekleyin, opaklığı istediğiniz gibi ayarlayın, ardından a CCSpawnile başlayın CCScaleTove CCFadeToörneğin:

sprite->runAction(CCSpawn::create(
    CCScaleTo::create(2.0f, 1.5f),
    CCFadeTo::create(5.0f, 255),
    nullptr));

Tüm spriteları önceden oluşturun ve verimli tutmak için arkada olanı döndürün.


1

Muhtemelen bir arka plan katmanı ve parçacık efekti ile sıralanmaya çalışacağım. Parçacık tasarımcısında efektleri test edebilir ve daha sonra bunları backgroung katmanında oynatabilirsiniz.


0

Dürüst olmak gerekirse, görüntünün bir 2D kamera kullanılarak oluşturulduğunu sanmıyorum. Oyun bir 3D render sistemi kullanılarak oluşturulmuş gibi görünüyor. Ancak cocos2d'yi kullanmak istediğiniz için, bu 3D iletim matrisini kendiniz simüle etmeniz gerekir. İşte bir fikir: 3D sahnede her nesne x, y ve z olmak üzere 3 skaler değerle tanımlanır. Kullanabileceğiniz en basit yöntem, önerdiğiniz gibi ölçeklendirmektir, ancak uyguladığınız gibi değil! ccScaleTozaman içinde doğrusal bir ölçeklendirme ile sonuçlanacak ve bu da 3D hissi vermeyecektir. Nesneyi değerine göre ölçekleyerek başlayabilirsiniz 1/z. Bu bir şekilde aklınıza gelebilecek en basit projeksiyon matrisi ile aynıdır! bunun sizi tatmin etmediğini bile düşünüyorsanız, daha modern ve daha karmaşık projeksiyon matrislerine bir göz atın .

Yan not: cocos2D'de özel projeksiyon matrisi uygulamak biraz kirli olacaktır. Etkiyi gerçekten sevmiyorsanız, motorunuzu 3D destekli bir motora değiştirmenizi şiddetle tavsiye ederim.


Ben şeyleri daha karmaşık hale getirmek için 3d tanıtmak istemiyorum ama bu etki sahte tünel görünümü oluşturmak için cocos2d yapılır (bazen bu oyunun yazarıyla bir görüşme
yaptım

0

Sahte kodda, bunu nasıl yaptım

Tünel efektini etkinleştir:

  1. CCRepeatForever oluşturma (CCFunc (createCircle))
  2. Sahnenize "ViewNode" adlı bir düğüm ekleyin

createCircle ()

  1. Sahnenin ortasında katman ve konum oluşturun. "ViewNode" öğesine alt öğe olarak ekleyin.
  2. eylemi çalıştır: CCSequence (CCEaseExponentialIn (CCScaleTo), CCRemoveSelf)
  3. Tabakanıza bir şeyler koyun, örneğin çemberler, düşmanlar, uzay gemileri, her neyse.

Kontrol (paralaks ile)

  1. Tünel etkisi olan tüm katmanlar için (örn. ViewNode öğelerinin alt öğeleri)
  2. çapa konumunu dokunma konumuna göre güncelleyin.

Konum Ufuk Noktasıdır, bu nedenle katmanları ufuk noktasını hareket ettirmeden hareket ettiremezsiniz. Ancak, bağlantı noktasını hareket ettirirseniz, katman hareket ediyor gibi görünür, ancak Ufuk Noktası aynı kalır - bu bir paralaks efekti oluşturur, çünkü ccp'yi (0.2,0.2) yakın bir katmanda (büyük ölçekli) taşımak, aynı şeyi uzaktaki bir katman üzerinde taşımak.

Çapanın yeniden konumlandırılmasının tüm katmanlarda aynı hareketi yarattığından emin olmak için her şeyi aynı boyutta katmanlara sarırsınız.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.