สร้างเอฟเฟกต์ต่อเนื่องและเงาซ้อนของสไปรท์


15

ฉันต้องการสร้าง trailing ที่น่ากลัวเหมือนเอฟเฟกต์ของ sprite ที่เคลื่อนที่เร็ว สิ่งที่คล้ายกับภาพของโซนิคนี้มาก (ขอโทษด้วยคุณภาพที่ไม่ดีมันเป็นเพียงตัวอย่างเดียวที่ฉันสามารถหาเอฟเฟกต์ที่ฉันต้องการได้)

เส้นทางผี

อย่างไรก็ตามฉันไม่ต้องการทำสิ่งนี้ในระดับ sprite sheet เพื่อหลีกเลี่ยงการเพิ่มจำนวนสไปรต์ใน Atlas ของฉันเป็นสองเท่า (หรืออาจจะเป็นสี่เท่า) นอกจากนี้ยังใช้แรงงานเข้มข้นมาก

ดังนั้นมีวิธีอื่นในการบรรลุผลนี้หรือไม่? อาจเป็นเพราะเวทมนตร์วูดู shader ฉันใช้ Unity และ 2D Toolkit ถ้าช่วยได้

คำตอบ:


21

คุณสามารถทำได้อย่างง่ายดายด้วยระบบอนุภาคและเครื่อง Shader ติดตั้งระบบอนุภาคเพื่อปล่อย 1 อนุภาคทุก X มิลลิวินาทีด้วยสูงสุด 3 อนุภาค (เลือก X ตามระยะห่างที่คุณต้องการให้สไปรต์ต่อท้าย) สำหรับอนุภาคใช้ภาพเดียวกับสไปรต์ปัจจุบันของตัวละคร แต่ใช้วัสดุอื่น ลองใช้เครื่องผสมอัลฟาผสมกับวัสดุบางอย่างเพื่อให้ได้เอฟเฟกต์ที่คุณต้องการในอนุภาคที่ตามมา

หากคุณต้องการได้รับมากขึ้นคุณสามารถปรับจำนวนสูงสุดของอนุภาคและการตั้งค่าอื่น ๆ ตามความเร็วปัจจุบันของตัวละคร

นี่คือตัวอย่างที่ฉันสามารถทำได้ด้วย 1 Quad, 1 sprite, 2 วัสดุและระบบอนุภาค

ฉันติดระบบอนุภาคเข้ากับ Quad และตั้งค่า quad ให้ใช้ Sonic sprite ฉันใช้เฉพาะค่า Emission, Color over Life และ Renderer ของระบบ Particle

อนุภาคสูงสุด: 5

พื้นที่จำลอง: โลก

เริ่มอายุการใช้งาน: 1

ความเร็วเริ่มต้น: 0

สีตลอดอายุการใช้งาน: จางจากสีขาว (อัลฟา 255) เป็นสีดำ (อัลฟา 0)

วัสดุ Renderer: ใช้ภาพเดียวกันกับต้นฉบับ แต่มี shader "อนุภาค / อัลฟ่าเบลนด์"

โซนิคพร้อมเอฟเฟกต์อนุภาคต่อท้าย


1
มันทำงานได้อย่างสมบูรณ์แบบ สิ่งเดียวที่ฉันต้องคิดออกก็คือวิธีการตั้งค่าวัสดุบนโปรแกรมตัวจำลองระบบอนุภาคให้ตรงกับภาพสไปรต์ปัจจุบัน (อีกครั้งฉันใช้ชุดเครื่องมือ 2D ดังนั้นมันจึงแตกต่างจากระบบสไปรท์ของ Unity)
Cooper

4

เช่นเดียวกับโซลูชันระบบอนุภาคคุณสามารถใช้ 2dtoolkit เพื่อสร้างเอฟเฟกต์เดียวกัน เพิ่มวัตถุของเกมสำหรับเด็ก 3 ตัวให้กับตัวละครโดยมีเพียงเทพดาที่อยู่ติดกับพวกมัน เปลี่ยนอัลฟาและระบายสีตามต้องการ จากนั้นคุณสามารถเปลี่ยนแปลงตำแหน่งท้องถิ่นของสไปรท์ขึ้นอยู่กับความเร็วของตัวละคร:

myTransform.localPosition = characterSpeed * distanceFactor;

มันบันทึกการโทรแบบดึง (เทียบกับอนุภาค) และให้คุณควบคุมการแพร่กระจายของเอฟเฟกต์ทั้งหมดหากคุณต้องการทำให้ราบรื่นหรือเซ


นี่นำฉันไปสู่ทางออกที่ดีกว่าซึ่งเหมาะกว่าเมื่อใช้ชุดเครื่องมือ 2D แต่ฉันลังเลที่จะทำเครื่องหมายเป็นคำตอบที่ยอมรับ วิธีระบบอนุภาคเป็นวิธี "Unity generic" ที่เหมาะสมที่สุดสำหรับนักพัฒนา Unity ส่วนใหญ่ ฉันจะโพสต์วิธีการแก้ปัญหาที่ฉันใช้
Cooper

3

ในขณะที่โซลูชันระบบอนุภาคที่จัดทำโดย LVBen ทำงานได้มันไม่ใช่โซลูชันที่เหมาะสมที่สุดเมื่อใช้ 2D Toolkit สำหรับสไปรต์ของคุณ เหตุผลหลักก็คือมันเป็นไปไม่ได้ที่จะซิงค์วัสดุเส้นทางผีในระบบอนุภาคกับภาพเคลื่อนไหวสไปรต์ปัจจุบันของรูปแบบสำเร็จรูปหลัก

นี่คือโซลูชันที่เป็นมิตรกับ 2D Toolkit ที่ฉันใช้

สำหรับรูปแบบสำเร็จรูปที่คุณต้องการให้ Ghost Trail มาให้แนบวัตถุเกมที่ว่างไว้เพื่อทำหน้าที่เป็นรูท ใต้รูทนี้ให้แนบ tk2dSprite หรือ tk2dSpriteAnimator จำนวนเท่าใดก็ได้ (ขึ้นอยู่กับว่าคุณต้องการ sprite เคลื่อนไหวหรือไม่) วัตถุเกม (ฉันเพิ่ม 4) และปรับค่าอัลฟาสีตามความเหมาะสมเพื่อให้ได้เอฟเฟกต์ ghosting / fading

ในการปรับปรุงหลักด้านบน

// AmountToMove is a Vector3 of the amount we will translate this gameobject.
float y = (int)AmountToMove.y == 0 ? 0 : -AmountToMove.y;
float distanceFactor = 0.05f;
for (int i = 0; i < GhostingRoot.childCount; ++i) {
    // Based on the player's current speed and movement along the x and y axes,
    // position the ghost sprites to trail behind.
    Vector3 ghostSpriteLocalPos = Vector3.Lerp(
                                      GhostingRoot.GetChild(i).localPosition,
                                      new Vector3((-CurrentSpeed * distanceFactor * i),
                                                  (y * distanceFactor * i), 0),
                                      10f * Time.deltaTime);
    // GhostingRoot is the root gameobject that's parent to the ghost sprites.
    GhostingRoot.GetChild(i).localPosition = ghostSpriteLocalPos;
    // Sync the animations.
    // _ghostSprites is a List of the tk2dSpriteAnimator ghost sprites.
    _ghostSprites[i].Play(SpriteAnimator.CurrentClip.name);
    _ghostSprites[i].Sprite.FlipX = Sprite.FlipX;
}

วิธีนี้จะสร้างเอฟเฟกต์ ghosting ต่อท้ายในขณะที่ซิงค์อนิเมชั่นของสไปรต์ผีกับสไปรต์หลัก

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.