トンネル効果cocos2d

COCOS2D（iOS）で同様のトンネル効果を作成したいと考えています。誰かがポインターを提案できますか？

参照ビデオ1

参照ビデオ2

今まで、縮尺を小さくして中心を同じポイントに配置し、小さいスプライトごとにZを小さくしたまま、いくつかのリング形状のスプライトを試しました。

それにより、CCScaleToでアニメートし、アニメーションの継続時間でサイズを2.0に変更しますが、参考文献に示されているトンネル効果に近づきません。

ありがとう、サム

この効果の作者から実装の説明を見つけました。

確かに、2D平面で深度錯視を作成するのは大変な作業でした。

原理は非常に簡単ですが、円はスケール0で画面の中央から始まります。その後、トンネルの最初の円は経過時間に比例してスケーリングを開始し（線形スケーリングは機能しません）、しばらくすると2番目の円がスケーリングを開始します、3番目、4番目など。

次に、円のアルファ値を比例的に下げます（奥にあるものは前にあるものよりもアルファ値が低く、ぼかしの錯覚を与えます）。すべての円がたどるパスを定義し、XとYを移動します。それの座標、その後、画面の中央に宇宙船を置きます。デバイスを傾けると、トンネルが上下左右に移動します（ただし、宇宙船が動いているように見えます！）。

サークルが画面から出ると、すぐにフェードされ、初期位置に戻ります（メモリを節約するため、新しいサークルを作成する必要はありませんが、同じサークルを再利用します）。

私の英語については申し訳ありませんが、それが一般的なアイデアを説明したことを願っています:)

Z値とスケールが減少する複数のリングスプライトを使用して、ほぼそこにいます。すべてを中央に配置しないでください。

トンネルを遠くのイベントホライズンに到達させるポイントを追跡する必要があります。好きなように、そのポイントを時間をかけて移動できます。

次に、新しいスプライトをそれぞれ配置し、そのポイントに配置し、それを小さくスケーリングし、不透明度を好きなように設定しCCSpawnてCCScaleToから、CCFadeTo例を示します。

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

すべてのスプライトを事前に作成し、効率を維持するために背面にあるスプライトを回転させます。

おそらく、背景レイヤーとパーティクルエフェットでソートしようとするでしょう。パーティクルデザイナーで効果をテストし、後で背景レイヤーで効果を再生できます。

正直なところ、画像が2Dカメラを使用してレンダリングされるとは思いません。ゲームは3Dレンダリングシステムを使用してレンダリングされているようです。ただし、cocos2dを使用するため、その3D変換マトリックスを自分でシミュレートする必要があります。まず、3Dシーンでは、すべてのオブジェクトが3つのスカラー値x、y、およびzで定義されていることを知っています。使用できる最も簡単な方法は、提案どおりにスケーリングすることですが、実装時ではありません！ccScaleTo時間の経過とともに線形スケーリングが行われ、3D感触が得られません。値でオブジェクトをスケーリングすることから始めることができます1/z。これは、あなたが考えることができる最も単純な投影行列と何となく同じです！それでも満足できない場合は、より現代的で複雑な射影行列を見てください。

サイドノート：cocos2Dでカスタム投影マトリックスを実装するのは少し面倒です。効果が気に入らない場合は、3Dサポートのあるエンジンに変更することを強くお勧めします。

擬似コードで私がやった方法は次のとおりです

トンネル効果をアクティブにします。

1. CCRepeatForever（CCFunc（createCircle））を作成します
2. 「ViewNode」というノードをシーンに追加します

createCircle（）

1. シーンの中央にレイヤー、位置を作成します。「ViewNode」に子として追加します。
2. アクションを実行：CCSequence（CCEaseExponentialIn（CCScaleTo）、CCRemoveSelf）
3. レイヤーに物を入れてください。つまり、サクサク、敵、宇宙船などです。

コントロール（視差あり）

1. トンネル効果を持つすべてのレイヤー（つまり、ViewNodeの子）
2. タッチ位置に基づいてアンカー位置を更新します。

位置は消失点であるため、消失点を移動せずにレイヤーを移動することはできません。ただし、アンカーポイントを移動すると、レイヤーは移動したように見えますが、消失ポイントは同じままです。これにより、視差効果が作成されます。同じものを遠くのレイヤーに移動します。

アンカーの位置を変更すると、すべてのレイヤーで同じ動きが作成されるように、すべてを同じサイズのレイヤーでラップします。