[Renpy] 32. วิธี เพิ่ม- ลด คะแนนคำถาม (Score Question) แบบแสดงที่หน้าอื่น
แก้ไขครั้งสุดท้ายโดย nooknazha เมื่อ 2018-6-22 17:2532. วิธี เพิ่ม- ลด คะแนนคำถาม (Score Question) แบบแสดงที่หน้าอื่น
จากบทความที่สอนการเพิ่ม-ลดคะแนนก่อนหน้านี้ จะเห็นว่า... เมื่อแถบค่าสเตตัสต่างๆที่ถูกสั่งให้ไปแสดงที่หน้าหลักของเกมส์ มีผลทำให้หน้าจอเกมส์แคบลง (แล้วแต่คนชอบแต่โดยส่วนตัวข้าพเจ้าชอบให้หน้าจอหลักมันโล่งๆมากกว่า) ด้วยเหตุนี้เองในบทความนี้จึงแนะนำอีกวิธีที่จะแยกการแสดงผลคะแนนให้ไปโชว์อยู่ที่หน้าจออื่นเพื่อความสบายตามากขึ้น (หรือเปล่า? -*-)
ขั้นตอนที่ 1
- ให้เตรียมภาพ 5ภาพได้แก่
1. ภาพปุ่มพิเศษแบบปกติ
2. ภาพปุ่มพิเศษแบบ hover
3. ภาพพื้นฉากแบบปกติ
4. ภาพพื้นภาพเมื่อเลื่อนเม้าส์มาวางทับ (hover)
5. ภาพที่จะมาแสดงแทนค่าคะแนนตัวแลข
-------------------------------------------------
ขั้นตอนที่ 2
เราจะต้องสร้างปุ่มพิเศษเพื่อให้สามารถคลิกไปที่หน้าสะสมคะแนนได้ซะก่อนโดยให้หาพิกัดตำแหน่งของปุ่มพิเศษในโปรแกรม Photoshop และนำโค๊ดนี้ไปแทรกเพิ่มไว้ที่หน้า QuickMenu
- ดูวิธีการทำ Quick menu แบบ Imagemapได้ที่บทความนี้ค่ะ วิธีทำ ImagemapQuick Menu
CODE:<font size="4">
hotspot (721, 5, 54, 49) action ShowMenu('score')
</font>ตัวอย่างการแทรกโค๊ด.............
หลังจากแทรกโค๊ดแล้ว ปุ่มพิเศษก็จะมาแสดงอยู่ที่หน้าจอเกมส์หลักดังนี้ค่ะถ้าคลิกที่ปุ่มนี้ มันก็จะวิ่งไปที่หน้า score:
------------------------------------------------------
ขั้นตอนที่ 3
- ให้สร้างหน้าscore: รองรับไว้โดยให้นำโค๊ดด้านล่างนี้ไปใส่ที่ไฟล์ options.rpyบรรทัดล่างสุด
CODE:<font size="4">
#__________________________________________________________
################::::Screen_Score ::::###############
screen score:
imagemap:
xalign 1.0 yalign 1.0
ground 'menu/bg_screen_score.png'
hover 'menu/bg_screen_score_hover.png'
hotspot (568, 128, 190, 56) action Return() hover_sound "sound/click.wav"
##--------------------คะแนน ของกวี--------------- ##
python:
ui.text("ชื่อ:" , bold=True, size=25, xalign=0.25, yalign=0.09)
ui.text("กวี", size=25, xalign=0.35, yalign=0.09)
ui.text("score:", bold=True, size=25, xalign=0.26, yalign=0.15)
ui.text("%d/%d" % (score_heart, max_score_heart),
size=25, xalign=0.4, yalign=0.15)
ui.text("ความสัมพันธ์:" , bold=True, size=25, xalign=0.295, yalign=0.21)
ifscore_heart == 0:
ui.text("เฉยๆ", xalign=0.5,yalign=0.21, size=25)
ifscore_heart == 1:
ui.text("สนใจ", xalign=0.5,yalign=0.21, size=25)
ui.image("menu/heart1.png",xalign=0.53, yalign=0.09)
ifscore_heart == 2:
ui.text("ชอบ", xalign=0.5,yalign=0.21, size=25)
ui.image("menu/heart1.png",xalign=0.53, yalign=0.09)
ui.image("menu/heart1.png",xalign=0.56, yalign=0.09)
ifscore_heart == 3:
ui.text("สนิท", xalign=0.5,yalign=0.21, size=25)
ui.image("menu/heart1.png",xalign=0.53, yalign=0.09)
ui.image("menu/heart1.png",xalign=0.56, yalign=0.09)
ui.image("menu/heart1.png",xalign=0.59, yalign=0.09)
##--------------------คะแนน ของปกิณกะ--------------- ##
python:
ui.text("ชื่อ:" , bold=True, size=25, xalign=0.25, yalign=0.43)
ui.text("ปกิณกะ", size=25, xalign=0.36, yalign=0.43)
ui.text("score:", bold=True, size=25, xalign=0.26, yalign=0.49)
ui.text("%d/%d" % (score_heart2, max_score_heart2),
size=25, xalign=0.4, yalign=0.49)
ui.text("ความสัมพันธ์:" , bold=True, size=25, xalign=0.295, yalign=0.55)
ifscore_heart2 == 0:
ui.text("เฉยๆ", xalign=0.5,yalign=0.55, size=25)
ifscore_heart2 == 1:
ui.text("สนใจ", xalign=0.5,yalign=0.55, size=25)
ui.image("menu/heart1.png",xalign=0.53, yalign=0.415)
ifscore_heart2 == 2:
ui.text("ชอบ", xalign=0.5,yalign=0.55, size=25)
ui.image("menu/heart1.png",xalign=0.53, yalign=0.415)
ui.image("menu/heart1.png",xalign=0.56, yalign=0.445)
ifscore_heart2 == 3:
ui.text("สนิท", xalign=0.5,yalign=0.55, size=25)
ui.image("menu/heart1.png",xalign=0.53, yalign=0.415)
ui.image("menu/heart1.png",xalign=0.56, yalign=0.415)
ui.image("menu/heart1.png",xalign=0.59, yalign=0.415)
##--------------------คะแนน ของวัฎฎะ--------------- ##
python:
ui.text("ชื่อ:" , bold=True, size=25, xalign=0.25, yalign=0.76)
ui.text("วัฎฎะ", size=25, xalign=0.36, yalign=0.76)
ui.text("score:", bold=True, size=25, xalign=0.26, yalign=0.82)
ui.text("%d/%d" % (score_heart3, max_score_heart3),
size=25, xalign=0.4, yalign=0.82)
ui.text("ความสัมพันธ์:" , bold=True, size=25, xalign=0.295, yalign=0.88)
ifscore_heart3 == 0:
ui.text("เฉยๆ", xalign=0.5,yalign=0.88, size=25)
ifscore_heart3 == 1:
ui.text("สนใจ", xalign=0.5,yalign=0.88, size=25)
ui.image("menu/heart1.png",xalign=0.53, yalign=0.745)
ifscore_heart3 == 2:
ui.text("ชอบ", xalign=0.5,yalign=0.88, size=25)
ui.image("menu/heart1.png",xalign=0.53, yalign=0.745)
ui.image("menu/heart1.png",xalign=0.56, yalign=0.745)
ifscore_heart3 == 3:
ui.text("สนิท", xalign=0.5,yalign=0.88, size=25)
ui.image("menu/heart1.png",xalign=0.53, yalign=0.745)
ui.image("menu/heart1.png",xalign=0.56, yalign=0.745)
ui.image("menu/heart1.png",xalign=0.59, yalign=0.745)
#________________________________________________________
###########################################
</font>(***ค่าตำแหน่ง xalign กับ, yalignเราต้องกะระยะเอาเองโดยการทดลองเปลี่ยนตัวเลขจุดทศนิยมข้างหลังและรันโปรแกรมเพื่อดูผลลัพธ์ที่หน้าจอเกมส์ X คือปรับค่าแสดงผลตามแนวนนอน/ Y ปรับค่าแสดงผลตามแนวตั้งมันเสียเวลาจะหาตำแหน่งยากแค่อันแรกๆ พอหาตำแหน่งหลักได้ที่เหลือก็แค่เปลี่ยนตัวเลขขยับตาม หรือ+ค่าเพิ่มไปแค่นิดหน่อย)
-------------------------------------------
ขั้นตอนที่ 4
- ตัวอย่างการเขียนโค๊ดที่ไฟล์script.rpy อันนี้ข้าพเจ้าเขียนแค่พอเป็นแนวทางนะค่ะไปประยุกต์สร้างเงื่อนไขเอาเอง
CODE: <font size="4">
# You can place the script of your game in this file.
# Declare images below this line, using the image statement.
# eg. image eileen happy = "eileen_happy.png"
defineb = Character('กวี', color="#FCFC68",
what_xpos = 5,
ctc="ctc_animation",ctc_position="fixed",
show_side_image=ConditionSwitch(
"ccg == 'normal' ", "cha/kawii_mini2.png",
"ccg == 'happy' ", "cha/kawii_mini_smile2.png",
None, Null(),
xalign=0.01, yalign=1.01))
image ctc_animation = Animation("menu/ctc_1_1.png", 0.20,
"menu/ctc_1_2.png", 0.20,
"menu/ctc_1_3.png", 0.20,
xpos=0.85, ypos=0.95,
xanchor=1.0, yanchor=1.0 )
image kawii01 = "cha/kawii_01.png"
image kawii02 = "cha/kawii_02.png"
image group_charactor = "cha/group_charactor.png"
#------------------------------------------------------------------------------
# เริ่มเกมส์
label start:
$ score_num = 0
$ max_score_heart = 3
$ max_score_heart2 = 3
$ max_score_heart3 = 3
$ score_heart = 0
$ score_heart2 = 0
$ score_heart3 = 0
scene black
show kawii01 at left with dissolve
$ ccg = 'happy'
#------------------------------------------------------------------------------
#คำถามที่ 1 ------เก็บคะแนนของ....กวี-----------------
menu:
b "พยัญชนะในภาษาอังกฤษตัว \"ph\" เมื่อออกเสียง ผสมกัน
ในภาษาไทยจะเท่ากับพยัญชนะตัวอะไร ?"
"ออกเสียงเป็นตัว ช.ช้าง":
pass
"ออกเสียงเป็นตัว ฟ.ฟัน":
$ score_num +=1
$ score_heart += 1
pass
"ออกเสียงเป็นตัว พ.พาน และ ฮ.นกฮูก":
pass
#คำถามที่ 2
menu:
b "พยัญชนะในภาษาอังกฤษตัว \"aew\" เมื่อออกเสียง ผสมกัน
ในภาษาไทยจะเท่ากับสระตัวอะไร ?"
"สระ เ-" :
$ score_heart -= 1
ifscore_heart <= 0:
$ score_heart = 0
pass
"สระ แ-ว ":
$ score_num +=1
$ score_heart += 1
pass
"สระ แ- ":
$ score_heart -= 1
ifscore_heart <= 0:
$ score_heart = 0
pass
#คำถามที่ 3 (คำถามสุดท้าย)
menu:
b "พยัญชนะในภาษาอังกฤษตัว \"oei\" เมื่อออกเสียง ผสมกัน
ในภาษาไทยจะเท่ากับสระตัวอะไร ?"
"สระ ไ- ":
$ score_heart -= 1
ifscore_heart <= 0:
$ score_heart = 0
pass
"สระ เ-า":
$ score_heart -= 1
ifscore_heart <= 0:
$ score_heart = 0
pass
"สระ เ-ย":
$ score_num +=1
$ score_heart += 1
pass
#------------------------------------------------------------------------------
#คำถามที่ 1----เก็บคะแนนของ.....วัฎฎะ-------------
menu:
b "พยัญชนะในภาษาอังกฤษตัว \"ph\" เมื่อออกเสียง ผสมกัน
ในภาษาไทยจะเท่ากับพยัญชนะตัวอะไร ?"
"ออกเสียงเป็นตัว ช.ช้าง":
pass
"ออกเสียงเป็นตัว ฟ.ฟัน":
$ score_num +=1
$ score_heart2 += 1
pass
"ออกเสียงเป็นตัว พ.พาน และ ฮ.นกฮูก":
pass
#คำถามที่ 2
menu:
b "พยัญชนะในภาษาอังกฤษตัว \"aew\" เมื่อออกเสียง ผสมกัน
ในภาษาไทยจะเท่ากับสระตัวอะไร ?"
"สระ เ-" :
$ score_heart2 -= 1
ifscore_heart2 <= 0:
$ score_heart2 = 0
pass
"สระ แ-ว ":
$ score_num +=1
$ score_heart2 += 1
pass
"สระ แ- ":
$ score_heart2 -= 1
ifscore_heart2 <= 0:
$ score_heart2 = 0
pass
#คำถามที่ 3 (คำถามสุดท้าย)
menu:
b "พยัญชนะในภาษาอังกฤษตัว \"oei\" เมื่อออกเสียง ผสมกัน
ในภาษาไทยจะเท่ากับสระตัวอะไร ?"
"สระ ไ- ":
$ score_heart2 -= 1
ifscore_heart2 <= 0:
$ score_heart2 = 0
pass
"สระ เ-า":
$ score_heart2 -= 1
ifscore_heart2 <= 0:
$ score_heart2 = 0
pass
"สระ เ-ย":
$ score_num +=1
$ score_heart2 += 1
pass
#------------------------------------------------------------------------------
#คำถามที่ 1--------เก็บคะแนนของ....ปกิณกะ-----------
menu:
b "พยัญชนะในภาษาอังกฤษตัว \"ph\" เมื่อออกเสียง ผสมกัน
ในภาษาไทยจะเท่ากับพยัญชนะตัวอะไร ?"
"ออกเสียงเป็นตัว ช.ช้าง":
pass
"ออกเสียงเป็นตัว ฟ.ฟัน":
$ score_num +=1
$ score_heart3 += 1
pass
"ออกเสียงเป็นตัว พ.พาน และ ฮ.นกฮูก":
pass
#คำถามที่ 2
menu:
b "พยัญชนะในภาษาอังกฤษตัว \"aew\" เมื่อออกเสียง ผสมกัน
ในภาษาไทยจะเท่ากับสระตัวอะไร ?"
"สระ เ-" :
$ score_heart3 -= 1
ifscore_heart3 <= 0:
$ score_heart3 = 0
pass
"สระ แ-ว ":
$ score_num +=1
$ score_heart3 += 1
pass
"สระ แ- ":
$ score_heart3 -= 1
ifscore_heart3 <= 0:
$ score_heart3 = 0
pass
#คำถามที่ 3 (คำถามสุดท้าย)
menu:
b "พยัญชนะในภาษาอังกฤษตัว \"oei\" เมื่อออกเสียง ผสมกัน
ในภาษาไทยจะเท่ากับสระตัวอะไร ?"
"สระ ไ- ":
$ score_heart3 -= 1
ifscore_heart3 <= 0:
$ score_heart3 = 0
jump score
"สระ เ-า":
$ score_heart3 -= 1
ifscore_heart3 <= 0:
$ score_heart3 = 0
jump score
"สระ เ-ย":
$ score_num +=1
$ score_heart3 += 1
jump score
#------------สรุปผล...ว่าได้จะให้จบแบบไหน----(ตัวอย่างแบบย่อ...แล้วแต่จะนำโค๊ดไปประยุกช์ค่ะ)---------#
label score:
hide kawii01
show group_charactor with dissolve
b "คุณได้ คะแนน!!!"
if score_num <= 0:
#End lose
b "คุณควรพยายามให้มากกว่านี้!"
jump end_lose
if score_num <= 3:
#End normal
b "อย่างน้อยคุณก็มีความสามารถพอใช้!"
jump end_normal
if score_num <= 6:
#End happy
b "คุณเป็นคนเก่งทีเดียว! "
jump end_happy
if score_num <= 9:
#End perfect!!!
$ ccg = 'happy'
b "คุณนี่สุดยอดจริงๆ! "
jump end_perfect
return
</font>ทดสอบรันโปรแกรมโดยการตอบคำถามไปเรื่อยๆ แล้วคอยดูว่าคะแนนของตัวละครที่หน้า score: เพิ่มตามด้วยไหม
***************************************
บทความโดย นุ้ก
ขอจบบทความแค่เพียงเท่านี้ แล้วพบกันใหม่บทความหน้าค่ะ ^^
(ขอสงวนสิทธิ์อนุญาตให้เผยแพร่เฉพาะในเว็บ www.graphicfufu.comเท่านั้น)
หน้า:
[1]