nooknazha โพสต์ 2018-6-30 00:06:54

[Renpy] 56. วิธีแทรกหน้า Bonus ไว้ที่ Main Menu แบบ Imagemap

แก้ไขครั้งสุดท้ายโดย nooknazha เมื่อ 2018-6-30 00:12


56. วิธีแทรกหน้า Bonus ไว้ที่ MainMenu แบบ Imagemap

พูดง่ายๆก็คือ เป็นการเพิ่มลูกเล่นพิเศษให้กับผู้เล่นโดยในการเล่นครั้งแรกผู้เล่นจะเห็นหน้าเกมส์เป็นแบบปกติค่ะแต่เมื่อผู้เล่นเล่นจบจน หรือเล่นจนสามารถเคลียร์เกมส์ได้แล้ว และกลับมาที่หน้าเมนูอีกครั้งหน้าหลักของเกมส์จะมีเมนูพิเศษแสดงให้เห็น

หน้าพิเศษมีไว้ทำอะไร?
แล้วแต่เราจะกำหนดค่ะ เช่น
1. เป็นหน้ารวมภาพ CG แกลอลรี่ลับ
2. เป็นหน้ารวมภาพฉากประทับใจที่ผู้เล่นทำถูกต้องตามเงื่อนไข
3. ข้อมูลลับของตัวละครในเกมส์ เช่น วันเดือนปีเกิด ส่วนสูงอาหารหรือสิ่งของที่ชอบ
4. ฟังเสียงพากษ์ตัวละคร
5. ฟังเสียงเพลงประกอบเกมส์
6. ดูภาพมูวี่เกมส์(อนิเมชั่น)
7. บทสนทนาพิเศษระหว่างตัวละครที่ไม่มีอยู่ในเนื้อเรื่องหลัก
8. ฯลฯ


โค๊ดที่จำเป็นต้องใช้
-ที่ไฟล์ Options.rpy ให้ใส่โค๊ดลงไปดังนี้เค่ะ

Code:

screen main_menu:
    tag menu
    if not persistent.extra_unlocked: #หาก persistent.extra_unlocked: เป็นเท็จ(=False) ให้ทำตามเงื่อนไขดังนี้
      imagemap:
            ground 'menu/main_menu_first.jpg'
            hover'menu/main_menu_first_hover.jpg'
      
            hotspot (314, 165, 251, 70) action Start() hover_sound "sound/click.wav"
            hotspot (314, 235, 251, 64) action ShowMenu('load') hover_sound "sound/click.wav"
            hotspot (314, 299, 251, 77) action ShowMenu('preferences') hover_sound "sound/click.wav"
            hotspot (314, 376, 251, 73) action Quit(confirm=False) hover_sound "sound/click.wav"

    else: #ถ้า persistent.extra_unlocked: เป็นจริง(=True) ให้ทำตามเงื่อนไขดังนี้
      imagemap:
            ground 'menu/main_manu_special.jpg'
            hover 'menu/main_manu_special_hover.jpg'

            hotspot (314, 155, 251, 66) action Start() hover_sound "sound/click.wav"
            hotspot (314, 221, 251, 62) action ShowMenu('load') hover_sound "sound/click.wav"
            hotspot (314, 283, 251, 72) action Start('special') hover_sound "sound/click.wav"
            hotspot (314, 355, 251, 75) action ShowMenu('preferences') hover_sound "sound/click.wav"
            hotspot (314, 430, 251, 67) action Quit(confirm=False) hover_sound "sound/click.wav"

อธิบายโค๊ด
....โค๊ดด้านล่างคือหน้าพิเศษที่เราสร้างเพิ่มขึ้นมา เมื่อทำการคลิกเข้าที่เมนูนี้โปรแกรมจะวิ่งไปที่ label ชื่อ special: ในไฟล์ script.rpy ทันที
hotspot (314, 283, 251, 72) action Start('special') hover_sound "sound/click.wav"

.....โค๊ดด้านล่างอีกตัวคือคำสั่งสำหรับให้เปิด "เสียงเฟคเอฟประกอบ" เวลาที่เรา"เลื่อนเม้าส์ผ่านปุ่มเมนูแต่ละปุ่ม"ค่ะ
hover_sound "sound/click.wav"
และที่ไฟล์ script.rpy ให้เราใส่สคริปว่า
$ persistent.extra_unlocked = True
ตำแหน่งท้ายสุดของเกมส์(จบเกมส์) เพื่อกำหนดให้ตัวแปรชื่อ "persistent.extra_unlocked" มีค่าเป็น"True"

และต่อจากนั้นก็ให้สร้าง label ชื่อ specialขึ้นมา ในส่วนของ label special นี้เราจะทำเป็นหน้าเมนูพิเศษ(Imagemap)หรือจะทำเป็นบทสนทนาพิเศษโต้ตอบกันระหว่างตัวละครซึ่งไม่มีในเนื้อเรื่องหลักก็ได้เช่นกันค่ะ

ตัวอย่างการใส่โค๊ดที่ไฟล์ script.rpy
Code:
label start:

    scene p7
    show m with dissolve
    p "สวัสดีชาวไทยกราฟทุกท่าน ฉันชื่อ \"ปกิณกะ\" ยินดีที่ได้รู้จักค่ะ!"
    "...ดำเนินเนื้อเรื่องเกมส์ไปตามปกติ......."
    "....................จบเกมส์แล้วจ๊ะ..............."
    $ persistent.extra_unlocked = True #สั่งให้ persistent.extra_unlocked = True (เป็นจริง)
                                                             #ใส่โค๊ดนี้ไว้ที่บรรทัดสุดท้าย
                                                             #ต่อจากบทสนทนาสุดท้ายของเกมส์(ก่อนจบเกมส์)
    return

.........................................................................

ดูแต่โค๊ดอย่างเดียวน้องๆอาจจะยังงงๆ งั้นมาดูวิธีทำกันดีกว่าค่ะ
วิธีทำ
ขั้นตอนที่1 หลักๆเราจะต้องเตรียมภาพสำหรับทำหน้าMain Menu ไว้ 4 ภาพค่ะคือ
1. หน้าเมนูหลัก(ground)


2. หน้าเมนูหลัก จะเปลี่ยนแปลงเมื่อมีเม้าส์เลื่อนมาวางทับบนเมนู(hover)

3. หน้าเมนูหลักพิเศษปกติ(ground)


4. หน้าเมนูหลักพิเศษจะเปลี่ยนแปลงเมื่อมีเม้าส์เลื่อนมาวางทับบนเมนู (hover)


ภาพที่ 5 เป็นภาพที่ออกไว้เป็นหน้าพืเศษ เมื่อผู้เล่นทำการคลิกเมนู "special"ก็จะเจอกับหน้า Imagemap หน้านี้ค่ะ(หรือจะไม่ทำก็ได้เช่นเมื่อคลิกเข้ามาก็จะพบกับบทสทนาพิเศษโต้ตอบกันระหว่างตัวละครแทน)

ขั้นตอนที่ 2 เมื่อภาพพร้อมแล้ว เราจะต้องหาพิกัดแต่ละตำแหน่งของ Imagemap ทั้งหน้าเมนูแบบปกติ และหน้าเมนูแบบพิเศษค่ะ
(หากยังหาพิกัดภาพไม่เป็นให้ศึกษาจากบทความนี้ก่อนค่ะ 53. วิธีทำImagemap ภายในเกมส์)


ขั้นตอนที่ 3
เปิดไฟล์ screen.rpy ดูประมาณบรรทัดที่170-200เราจะเจอโค๊ดเมนูหลักที่โปรแกรมสร้างมาให้ ให้แดรกเม้าส์เลือกโค๊ดทั้งชุดและกดปุ่มDelete ลบทิ้งไปเลยค่ะ(ไม่งั้นมันจะไปกวนกับโค๊ดหน้าเมนูหลักที่เราจะใส่ลงไป)

ขั้นตอนที่ 4
เปิดไฟล์ options.rpy ให้นำโค๊ดหน้าmainmenu ที่เราทำเป็น Imagemap ไว้มาใส่ไว้ที่บรรทัดล่างสุดค่ะ


ขั้นตอนที่ 5
เปิดไฟล์ script.rpy ใส่โค๊ด$ persistent.extra_unlocked = True เพิ่มลงไปที่ตำแหน่งก่อนจบเกมส์และสร้างหน้า label special เตรียมไว้


ขั้นตอนที่ 6
- บันทึกไฟล์ทั้งหมดและรันเกมส์ค่ะ
- เมื่อเข้าเกมส์ครั้งแรกหรือถ้าผู้เล่นยังเล่นเกมส์ไม่จบจริง หน้าเมนูหลักจะแสดงเป็นหน้าปกติตามตัวอย่างข้างล่างค่ะ

- เราจะต้องเล่นเกมส์ให้จบก่อน

- เมื่อเราเล่นเกมส์จนเคลียร์เกมส์จบแล้วโปรแกรมจะวิ่งกลับไปที่หน้าเมูหลักอีกครั้ง และจะแสดงหน้าเมนูพิเศษขึ้นมา(ดูภาพด้านล่างประกอบ)


- แล้วเมื่อผู้เล่นคลิกเลือกที่เมนู "Special"โปรแกรมก็จะวิ่งไปที่ไฟล์ script.rpy ตรง labelชื่อ special ค่ะ
- และภายใน labelspecial: ข้าพเจ้าได้ใส่โค๊ดคำสั่งไว้ว่า call screenexample_imagemap ซึ่งเป็นการสั่งให้โปรแกรมแสดงหน้า Imagemap ชื่อ "example_imagemap" ขึ้นมา ผลลัพธ์ก็จะออกมาเป็นดังภาพด้านล่างค่ะ


สามารถดูต่อความเนื่องได้ที่นี่ค่ะ 25. วิธีทำCG Gallery แบบ Imagemap

ขอให้สนุกกับการสร้างเกมส์นะค่ะ^^"******************************
บทความโดย นุ้ก
ขอจบบทความแค่เพียงเท่านี้ แล้วพบกันใหม่บทความหน้าค่ะ ^^
(ขอสงวนสิทธิ์อนุญาตให้เผยแพร่เฉพาะในเว็บ www.graphicfufu.comเท่านั้น)

หน้า: [1]
ดูในรูปแบบกติ: [Renpy] 56. วิธีแทรกหน้า Bonus ไว้ที่ Main Menu แบบ Imagemap