แก้ไขครั้งสุดท้ายโดย nooknazha เมื่อ 2018-6-5 22:40
[Renpy] 23. วิธีทำฉากตัวละครนั่งอยู่ในรถ
จากที่มีท่านสมาชิกสอบถามไว้ --ถึงจะตอบช้าไปหน่อยแต่ก็ทำเป็นบทความให้แล้วค่ะ ^^
วิธีทำในบทความนี้จะเอามาประยุกต์ให้เป็นฉากตัวละครกำลังนั่งอยู่บนรถเรือ เรือบิน บอลลูน รถไฟ ฯลฯ หรือจะ เดิน - วิ่ง ก็ได้หมดนะคะแค่เปลี่ยนภาพในฉากเอา ^^ มาดูกันเลยดีกว่า
ภาพที่ต้องเตรียมควรหลักๆ ก็มี 3 ภาพด้วยกัน(ภาพอาจจะเยอะกว่านี้ก็ได้ ขึ้นอยู่กับคุณเป็นคนกำหนดรายละเอียดในฉาก)
1. ภาพฉากหลังพูดง่ายๆก็คือภาพที่เราจะมาทำให้มันวิ่งจากซ้ายไปขวากันขอแนะนำให้ความกว้างของฉากหลังควรมากกว่า 3 เท่าของขนาดจอภาพในเกมส์เช่น ถ้าจอภาพของคุณมีขนาด 800pt ฉากหลังที่จะให้เคลื่อนที่ไปตามแนวนอนก็ควรจะมีความกว้าง2400pt หรือ 3200 หรือ 4000 เป็นต้น (เพิ่มทีละ 800pt) การกำหนดความกว้างเช่นนี้จะทำให้ง่ายต่อการแบ่งส่วนพื้นที่ในภาพ
** เคล็ดลับที่จะทำให้ฉากหลังเคลื่อนที่ได้ต่อเนื่องไม่สะดุดก็คือ**
- เราจะต้องแบ่งความกว้างของฉากให้ได้เท่าๆกันเป็นช่วงๆ(ดูภาพด้านล่างประกอบ) จะเห็นว่าข้าพเจ้าแบ่งภาพออกเป็น 3 ช่วงคือ ภาพหัว(A), ภาพกึ่งกลาง(B), ภาพท้าย(C)กว้างช่วงละ 800pt เท่าๆกัน(เพราะข้าพเจ้ากำหนดให้หน้าจอเกมส์กว้างเท่ากับ800*600pt) แต่ถ้าภาพฉากของคุณยาวกว่านั้นคุณจะต้องแบ่งฉากของคุณให้มี 1.ภาพหัว และ 2.ภาพท้าย ที่มีความกว้าง*ยาวเท่ากับหน้าจอเกมส์ ส่วน"ภาพกึ่งกลาง" คุณจะแบ่งช่วงหรือไม่ก็ได้แต่มีข้อแม้ว่าภาพช่วงกึ่งกลางของคุณจะต้องมีความกว้างมากกว่าขนาดหน้าจอเกมส์ของคุณ
- คุณจะต้องทำให้"ภาพหัว(A)" และ "ภาพท้าย(C)" เป็นภาพเดียวกันนั่นความหมายว่าคุณจะต้องใช้ความสามารถในการวาดฉาก(ช่องว่างตรงกลาง)ยังไงก็ได้ให้เชื่อมต่อเนื่องกันจนดูเหมือนเป็นภาพเดียวกัน
2. ภาพภายในพาหนะที่ตัวละครนั่งอยู่ อาจจะเป็น รถยนต์ รถไฟ เรือหรือเครื่องบิน ก็ได้ เอาตามชอบเลยค่ะ
3. ภาพตัวละครที่จะมีบทในฉากนั้นๆ(ที่ต้องให้แยกกับฉากภายในพาหนะ เพราะบางครั้ง ตัวละครอาจจะเคลื่อนไหวหลายเท่าเช่น พลิกตัว เอียงตัว ขยับแขน-ขา หันหน้า ฯลฯการแยกภาพกันจะทำให้ควบคุมท่าทางต่างๆของตัวละครได้ง่ายกว่าค่ะ)
ถ้านำทั้ง 3 ภาพมาวางซ้อนกันก็จะได้ประมาณนี้ค่ะ
*************************************** โค๊ดแบบที่หนึ่ง *************************************** เหมาะสำหรับเกมส์ที่ไม่ซับซ้อนมากนักคือประมาณว่าทั้งเกมส์มีฉากเคลื่อนที่แค่ 1-2 ฉาก วิธีนี้ ภาพภายในของพาหนะจะถูกแทรกไว้ในโค๊ดควบคุมทิศทางการเคลื่อนที่ ข้อดี คือ ดูง่ายเวลาจะแก้ไขก็ไม่ต้องไล่หลายจุด
ข้อเสีย คือคำสั่งเคลื่อนที่จะผูกติดอยู่กับภาพภายในของพาหนะแค่ภาพเดียวหากในเนื้อเรื่องมีฉากเคลื่อนที่ด้วยพาหนะหลายชนิด จะทำให้ต้องเขียนคำสั่งควบคุมทิศทางเคลื่อนที่ซ้ำๆกันหลายครั้ง
CODE:
- define l = Character('Lim', color="#c8ffc8")
- image in_car = "in_car2.gif"
- image lim = "in_car3.gif"
- image go_home:
- "in_car1.jpg"
- xalign 1.0 yalign 0.0
- linear 3.0 xalign 0.0
- repeat
-
- # The game starts here.
- label start:
- show go_home
- show in_car
- show lim
- l "You've created a new Ren'Py game."
- l "Once you add a story, pictures, and music, you can release it to the world!"
- return
*************************************** โค๊ดแบบที่สอง(แนะนำ) ***************************************
เหมาะสำหรับเนื้อเรื่องเกมส์ที่มีความซับซ้อนมากขึ้นคือในเกมส์มีฉากเคลื่อนที่หลายฉากด้วยกันเราจึงจำเป็นต้องแยกส่วนคำสั่งที่ใช้ควบคุมทิศทางการเคลื่อนที่ออกมาต่างหาก
CODE:
- define l = Character('Lim', color="#c8ffc8")
- image bg_go_home = "in_car1.gif"
- image in_car = "in_car2.gif"
- image lim = "in_car3.gif"
- transform go_home:
- xalign 1.0 yalign 0.0 #สั่งให้ภาพเคลื่อนจาก ซ้าย >>> ขวา
- linear 3.0 xalign 0.0 #linear คือ ความเร็วในการเคลื่อนที่ของภาพ
- repeat
-
- # The game starts here.
- label start:
- jump car_go_home
- return
- label car_go_home:
- show bg_go_home at go_home #กำหนดให้ภาพ เคลื่อนที่ตามที่กำหนดไว้ใน transform ชื่อ go_home
- show in_car
- show lim
- l "Welcome to Thaigraph and Ren'Py game."
- l "I hope you will get benefits from my tutor!"
- hide bg_go_home
- hide in_car
- hide lim
- jump talk
-
- label talk:
- show bg_go_home at left
- show in_car
- show lim
- l "See you next my tutor."
- return
จากโค๊ดด้านบนเราจะเห็นว่าคำสั่ง transform จะเป็นตัวควบคุมทิศทางการเคลื่อนที่ของฉากหลังและเรียกใช้ได้โดยการพิมพ์ชื่อ หลังคำสั่ง "at" หากในเนื้อเรื่องเกมส์มีฉากนั่งพาหนะหลายชนิดเช่น มอไซ จักรยาน ฯลฯ ก็จะเรียกใช้ด้วยคำสั่งเดียวกันค่ะ(ดูภาพเชื่อมโยงความสัมพันธ์ด้านล่าง)
ลองมาดูผลลัพธ์ที่ได้หลังจากรันคำสั่งกันค่ะ จะเห็นว่าตัวละครนั่งอยู่กับที่ส่วนภาพฉากหลังจะเคลื่อนที่ไปเรื่อยๆจากซ้ายไปขวา
ฉากหลังค่อยๆเลื่อนไปเรื่อยๆ มองไป มองไปก็ตาลายได้เหมือนกันนะเนี่ย
สำหรับคนที่ต้องการตัวอย่างไฟล์เกมส์ของบทความนี้สามารถโหลดได้ที่ลิงค์ด้านล่างนี้ค่ะ
คลิกโหลดไฟล์ประกอบบทความ ที่นี่
***************************************
บทความโดย นุ้ก
ขอจบบทความแค่เพียงเท่านี้ แล้วพบกันใหม่บทความหน้าค่ะ ^^
(ขอสงวนสิทธิ์อนุญาตให้เผยแพร่เฉพาะในเว็บ www.graphicfufu.comเท่านั้น)
| 
โพสต์ 2018-6-5 22:22:48