12 ก.ค. 2565·อ่าน 1 นาที

เล่นเสียงและไฟ Confetti บล็อกใน AppMaster

เรียนรู้วิธีสร้าง Play Sound และ Fire Confetti ใน AppMaster

เล่นเสียงและไฟ Confetti บล็อกใน AppMaster

ใน AppMaster คุณสามารถเพิ่มองค์ประกอบแบบอินเทอร์แอกทีฟให้กับเว็บแอปพลิเคชัน เช่น เอฟเฟ็กต์ภาพ เสียง และอื่นๆ ในบทความนี้เราจะแสดงวิธีใช้บล็อก Fire Confetti และ Play Sound ร่วมกัน

ตัวอย่างที่อธิบายในบทความนี้ง่ายมาก เพื่อให้ผู้อ่านมีความรู้ระดับใด ๆ ในการทำงานกับแพลตฟอร์ม AppMaster สามารถเข้าใจสาระสำคัญของการใช้บล็อกเหล่านี้และปรับให้เข้ากับแอปพลิเคชันของพวกเขา

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

ก่อนอื่น มาดูกระบวนการทางธุรกิจของ Play Sound and Fire Confetti กันก่อนดีกว่า

1. เล่นเสียง - บล็อกของกระบวนการทางธุรกิจที่เล่นเสียงจากไฟล์ที่ลิงก์ที่กำหนด

URL (mp3) [สตริง] - เส้นทางไปยังไฟล์ เป็นการดีที่จะระบุพาธไปยังไฟล์จากที่เก็บไฟล์ของแอปพลิเคชัน จากนั้น URL จะมีลักษณะดังนี้ /api/_file//download/ โดยที่ ID คือ ID ไฟล์ในแบ็คเอนด์ของแอปพลิเคชัน

2. Fire Confetti - บล็อกกระบวนการทางธุรกิจที่ยิง Confetti ให้กับผู้ใช้ปัจจุบัน

  • พรีเซ็ต [vmodel] - ให้คุณเลือกแอนิเมชั่นสำหรับถ่าย confetti

- ปืนใหญ่

- ดอกไม้ไฟ

- เหมือนจริง

- หิมะ

- ความภาคภูมิใจของโรงเรียน

  • Duration (ms) [integer] - ระยะเวลาของภาพเคลื่อนไหวในหน่วย ms

  • ตำแหน่งด้านบน (%) [จำนวนเต็ม] - การเบี่ยงเบนของจุดทริกเกอร์จากด้านบนของหน้าจอ

  • ตำแหน่งซ้าย (%) [จำนวนเต็ม] - ส่วนเบี่ยงเบนของจุดทริกเกอร์จากด้านซ้ายของหน้าจอ

  • จำนวนอนุภาค [จำนวนเต็ม] - จำนวนอนุภาคลูกปา

  • มุม [จำนวนเต็ม] - มุม

  • สี [อาร์เรย์สตริง] - สีอนุภาคลูกปา

มาเริ่มกันที่การตั้งค่ากระบวนการทางธุรกิจกัน ในตัวอย่างของเรา ลูกปาจะถูกไล่ออกหลังจากผู้ใช้ล็อกอินสำเร็จ ดังนั้น การปรับเปลี่ยนที่จำเป็นทั้งหมดจะทำในกระบวนการทางธุรกิจที่เกี่ยวข้องกับปุ่มเข้าสู่ระบบ

จำเป็นต้องค้นหาช่วงเวลาในกระบวนการทางธุรกิจที่เปลี่ยนเส้นทางผู้ใช้ไปยังหน้าถัดไปเมื่อเข้าสู่ระบบสำเร็จ ซึ่งก็คือบล็อกการนำทาง การปรับเปลี่ยนกระบวนการทางธุรกิจของเรามีดังนี้:

การตั้งค่าบล็อก Fire Confetti ที่ใช้ที่นี่:

  • ที่ตั้งไว้ล่วงหน้า = ปืนใหญ่;

  • ระยะเวลา (มิลลิวินาที) = 1;

  • จำนวนอนุภาค = 500;

  • มุม = 30.

อินพุตของบล็อก Play Sound ได้รับเส้นทางไปยังไฟล์เพลงที่อัปโหลดไปยังแอปพลิเคชันเซิร์ฟเวอร์ก่อนหน้านี้

ดังนั้น ในบทความนี้ เราได้อธิบายความเป็นไปได้ของการใช้บล็อกแบบโต้ตอบ Play Sound และ Fire Confetti หลังจากเข้าใจวิธีการทำงานแล้ว คุณสามารถใช้มันเองในสถานการณ์ที่ซับซ้อนมากขึ้นได้

ง่ายต่อการเริ่มต้น
สร้างบางสิ่งที่ น่าทึ่ง

ทดลองกับ AppMaster ด้วยแผนฟรี
เมื่อคุณพร้อม คุณสามารถเลือกการสมัครที่เหมาะสมได้

เริ่ม
เล่นเสียงและไฟ Confetti บล็อกใน AppMaster | AppMaster