เอาล่ะครับเพื่อความต่อเนื่องในการศึกษาผมก็จะรีบๆสอนต่อละกันครับสำหรับเนื้อหาในตอนที่ 2 ที่ผมจะหยิบยกขึ้นมานั้นก็จะเกี่ยวข้องกับเรื่อง


- การใช้ตัวแปรเบื้องต้น (python)
- กรอบคำพูด (Character)
เห็นว่าหัวข้อน้อยๆอย่างงี้ก็เห่อะยุ่งยากพอดูเลยล่ะ

การใช้ตัวแปรเบื้องต้น(Python)
python แปลตรงตัว หมายถึง งูใหญ่ , งูเหลือม , อนาคอนด้า ฯลฯ หรืออีกความหมายหนึ่งหมายถึง การสิงสู่ ,การเข้าสิง
python ตามความหมายของในที่นี้นั้นก็คือกำหนดเรียกใช้งานภาษา Python ครับซึ่งมันก็จะรวมไปถึงเรื่องที่เกี่ยวของกับตัวแปรด้วยครับ
ตัวแปรนั้นเปรียบเสมือนแฟ้มที่คอยทำหน้าที่เก็บข้อมูลต่างๆที่จำเป็นต่อการทำงานของโปรแกรมเอาไว้ โดยปกติแล้วเราจะนิยมประกาศค่าตัวแปรไว้ในส่วน init ครับ การประกาศค่าตัวแปรpythonใน Ren’py นั้นแบ่งการใช้งานได้ 2 ลักษณะคือ

1 .) ประกาศค่าบรรทัดเดียว การเรียกใช้งานก็แสนจะง่ายจนน่าตกใจครับ

“$” name “=” ค่าตัวแปร 

ตัวอย่าง
$ e = 30
$ d = “hello”



ส่วนเวลาที่เราจะตั้งชื่อตัวแปรมันยังไงก็ได้นะครับขออย่างเดียวว่าอย่าไปตั้งซ้ำกับ keyword ของมันก็พอครับ
keyword ของภาษานี้มีดังนี้ครับ
http://www.renpy.org/wiki/renpy/doc/reference/The_Ren%27Py_Language#head-a34a0457ffbdae8847e5808b40f058ab85619167

2 .) แบบหลายบรรทัด การทำงานในรูปแบบนี้ค่อนข้างแปลกๆไปหน่อย คือเป็นการประกาศทีละหลายบรรทัดไปเลย มันจะเป็นตัวที่ทำหน้าที่ mark ให้โปรแกรมรู้ว่าตำแหน่งนี้เป็นส่วนของการประกาศ function หรือ ใช้ประกาศค่า array และการเรียกใช้งานเกี่ยวกับ UI Function การเรียกใช้งานก็แสนจะง่ายจนน่าตกใจกว่าอันแรกอีกครับ

“python :”
ตัวอย่าง
python :
    e = 30
    d = “hello”
    q = true


ตัวแปรที่มีการประกาศอยู่ภายใต้คำสั่ง python ไม่ต้องใส่ “$” ที่หน้าตัวแปรนะครับ แล้วอย่าลืมล่นย่อหน้าเข้ามา 4 ครั้งด้วยนะครับ

ปล.อันที่จริงแล้วคำสั่งนี้เป็นคำสังที่ไว้สำหรับพิมพ์ code ภาษา python ลงไปใน renpy อ่ะนะซึ่งสามารถที่จะเขียนไว้ตรงไหนในส่วนของโปรแกรมก็ได้ เพียงแต่ว่าตอนนี้ผมขออธิบายเฉพาะในส่วนของการประกาศตัวแปรเท่านั้นก่อนละกัน เอาล่ะไหนๆก็พูดถึงเรื่องตัวแปรแล้วก็จะขอแถมตัวแปรอีกชนิดนึงก็แล้วกันนั่นก็คือ
Array เป็นตัวแปรที่มีคุณสมบัติในการเก็บค่าได้หลายค่าภายในตัวเดียวกัน เหมือนกับตู้ใส่แฟ้มเอกสาร 
หลักการใช้งาน 

$ name “=” “[” ค่าต่างๆ1 , ค่าต่างๆ2 , ... “]”
ตัวอย่าง
$ exam = [1,2,3,4,5,6]


หากเวลาเราต้องการเรียกใช้งานตัวแปร array ก็เพียงแค่ ประกาศตามนี้

$ name[ตัวเลข]
ตัวอย่าง
$ exam[0]      ---> 
ค่าของตัวแปรตัวนี้ตือ 1
$ exam[1]      ---> ค่าของตัวแปรตัวนี้ตือ 2


หากเราประกาศค่าภายใต้คำสั่ง python เราไม่ต้องใส่ $ ที่หน้าตัวแปรนะครับ
ตัวเลขในที่นี้หมายถึงลำดับช่องของอเรย์ที่เราต้องการ(เราสามารถใส่เป็นค่าตัวแปรแทนตัวเลขก็ได้นะครับถ้าหากว่าค่าตัวแปรเป็นชนิดตัวเลข int)


ต่อมาก็จะเป็นการนำค่าตัวแปรมาแสดงในเฟรมคำพูด

ข้อความ %(ตัวแปร)s”
ตัวอย่าง
 

$ exam = [1,2,3,4,5,6]

$ first = exam[0]
$ name = “vashiya”


สวัสดีคุณ %(name)s”
ตัวเลขในตำแหน่งแรกของคุณคือ %(first)d”


ข้อสังเกต จากตัวอย่างข้างต้นเราจะเห็นว่าค่าตัวแปรภายในวงเล็นนั้นไม่จำเป็นต้องใส่ $
อีกทั้งเรายังไม่สามารถนำค่าตัวแปรที่เป็นชนิด Array มาใส่ลงในข้อความได้โดยตรง แต่เราต้องทำการฝากค่าผ่านตัวแปรตัวอื่นแล้วนำมาแสดงผลลงในข้อความอีกทีหนึ่งครับ (ในที่นี้ปมตั้งชื่อตัวแปรนั้นว่า first ครับ)
จะเห็นว่าเราจะต้องมี “%( )s” ครอบตัวแปรที่เราต้องการแสดงไว้เท่านี้เราก็สามารถแสดงค่าต่างๆออกมาได้แล้ว โดยที่ตัวอักษรข้างหลังวงเล็บนั้นจะเป็นตัวที่กำหนดว่าตัวแปรที่ต้องการแสดงออกมานั้นเป็นตัวแปรชนิดไหน

“%( )s” จะแสดงตัวแปรที่เป็นค่า string(ตัวอักษรต่างๆ)
“%( )d”
จะแสดงตัวแปรที่เป็นค่า int (ค่าตัวเลขต่างๆ)
“%( )f”
จะแสดงตัวแปรที่เป็นค่า ทศนิยม


ที่ยกมาคือตัวที่ใช้บ่อยที่สุดยังมีรูปแบบอื่นๆอีกลองหาดูละกัน http://www.python.org/doc/2.3.5/lib/typesseq-strings.html

หลังจากที่เราเกริ่นเกี่ยวกับการ output ค่ากันมาบ้างแล้ว ต่อไปเราจะมาพูดเกี่ยวกับการ input ค่ากันบ้างนะครับ
หากว่าเราต้องการใส่ตัวอักษรอะไรให้เกมส์เหมือนกับตอนที่เราป้อนชื่อตัวเราเองลงไปในตอนเริ่มเกมส์ทั่วไปน่ะแหล่ะครับ
มีการประกาศใช้งานดังนี้ครับ

$ ชื่อตัวแปร = renpy.input(‘ข้อความ)
ตัวอย่าง
$ name = renpy.input(‘กรุณาพิมพ์ชื่อของคุณ’)

 

บรรทัดนี้จะเป็นการเก็บค่าจากที่เราพิมพ์ไปใส่ลงในตัวแปรที่เรากำหนดครับ 
โอเค ทีนี้มันก็จะขึ้นข้อความให้คุณกรอกข้อมูลลงไป แต่เอ๊ะ.......ไหงมันไม่ยักกะมีภาษาไทยขึ้นมาเลยแฮะ........
มันคืออะไรกันแน่เนี่ยะ...........ใจเย็นๆครับกำลังจะอธิบายในหัข้อถัดไป

สำหรับส่วนในการแสดงส่วน input นี้ให้เป็นภาษาไทยนั้นให้เราทำการเปลี่ยน font ให้เป็น font ที่รองรับภาษาไทยได้ ประมาณบรรทัดที่ 150 ในไฟล์ option.rpy

style.default.font = " angsa.ttf " <------ เคยอธิบายไปแล้วในเรื่องการปรับแต่งค่าก่อนการสร้างเกมส์ อย่าลืมลบ # ออกก่อนล่ะ


โดยที่เราจะต้องทำการ Copy File font ภาษาไทยของเรามาลงใน Folder game ของเราก่อนนะครับทีนี้เนี่ยะมันก็จะสามารถแสดงผลภาษาไทยได้ทั้ง Inputและ Output เลยล่ะ

กรอบคำพูด 
สำหรับหัวข้อนี้จะมีฟังก์ชันที่สำคัญอยู่ตัวนึงนั้นก็ คือ ฟังก์ชัน Character โดยปกติแล้วต้องประกาศในส่วน init เท่านั้น สำหรับรูปแบบการใช้งานเบื้องต้นนั้นประกาศดังนี้

Character ( name , Keyword Arguments1 , Keyword Arguments2 , ... )



name หมายถึง ชื่อของตัวละครหากไม่ต้องการจะแสดงชื่อให้พิมพ์ None ซะ โดยปกติไม่สามารถพิมพ์ภาษาไทยได้ หากต้องการให้พิมพ์ภาษาไทยได้ต้องแก้ไขดังนี้

$ name = file(config.gamedir + "/ชื่อไฟล์ที่เก็บชื่อตัวละครไว้.txt ").read().decode("utf-8") <------เพิ่มคำสั่งบรรทัดนี้ลงไป
$ a = Character(name, color="#c8ffc8", what_font="ชื่อของ font ภาษาไทย", font="ชื่อของ font ภาษาไทย") <----- จากนั้นก็ประกาศค่าตามปกติ



หนึ่ง ชื่อก็หนึ่งไฟล์ไปเลยนะครับไม่ต้องงก ตอนที่ save ไฟล์ .txt ให้ save เป็นชนิด UTF-8 ด้วย <----- (ตรงนี้สำคัญมากๆ)

Keyword Arguments หมายถึง option ต่างๆที่เราจะกำหนดลงไปมีมากมายหลายตัวจะขอยกมาแค่ตัวที่พบบ่อยๆละกัน

color = "#c8ffc8" <--- สีชื่อของตัวละคร
what_color="#000" <----- กำหนดสีของtext
what_font="angsananew" <----- กำหนด font ของ text ในเฟรม
font = "angsananew" <----- กำหนด font ของชื่อตัวละคร
who_prefix = “ตัวอักษร” <----- กำหนดให้ตัวอักษรที่เราตั้งไว้นำหน้าชื่อตัวละครเสมอ
who_suffix = “ตัวอักษร” <----- กำหนดให้ตัวอักษรที่เราตั้งไว้ตามหลังชื่อตัวละครเสมอ
what_prefix = “ตัวอักษร” <----- กำหนดให้ตัวอักษรที่เราตั้งไว้นำหน้าข้อความเสมอ
what_suffix = “ตัวอักษร” <----- กำหนดให้ตัวอักษรที่เราตั้งไว้ตามหลังข้อความเสมอ
window_left_margin = 200 <----- กำหนดให้เฟรมอยู่ห่างจากจอด้านซ้ายไปกี่พิกเซล
window_right_margin = 200 <----- กำหนดให้เฟรมอยู่ห่างจากจอด้านขวาไปกี่พิกเซล
window_xmargin=20 <----- กำหนดให้เฟรมอยู่ห่างจากจอด้านซ้ายและขวาไปกี่พิกเซล
window_ymargin=30 <----- กำหนดให้เฟรมอยู่ห่างจากจอด้านบนและล่างไปกี่พิกเซล
window_yfill=True <----- กำหนดให้เฟรมมีขนาดใหญ่เต็มจอ
window_yminimum = 300 <----- กำหนดความสูงของเฟรม
what_underline = True <----- กำหนดให้ขีดเส้นใต้ใต้ข้อความเสมอ
show_two_window = True <----- กำหนดให้แยกชื่อตัวละครกับเฟรมคำพูดออกมาอยู่คนละเฟรม
show_side_image = “ชื่อภาพ” <----- กำหนดรูปไว้ในกรอบคำพูด โดยปกติแล้วมักจะประกาศรวมอยู่กับฟังก์ชัน image สามารถเรียกใช้งานได้ดังนี้

show_side_image = image(“ชื่อภาพ”, ypos=380, xpos=100) โดยที่
ypos = 380 <----- ตำแหน่งของภาพที่จะแสดงในแกน y
xpos = 100 <----- ตำแหน่งของภาพที่จะแสดงในแกน x

ctc = “ ชื่อภาพ “ <----- รูปภาพท้ายข้อความเวลาจะขึ้นข้อความใหม่(สามารถใช้ร่วมกับ ฟังก์ชัน animetion ได้ ซึ่งจะขอกล่าวในบทถัดไป)
ctc_position = "nestled" / "fixed" <----- “nestled” รูปภาพท้ายข้อความจะขึ้นอยู่ที่ท้ายข้อความ ในขณะที่ “fixed” จะทำให้ภาพไปอยู่ที่มุมขวาล่างของกรอบข้อความเสมอ
window_background = None <------ ไม่ต้องการให้มีเฟรมคำพูด
show_say_vbox_properties = dict( xalign=0.5 , yalign=0.5) <----- กำหนดให้ตัวหนังสือทั้งหมดอยู่ห่างจากเฟรมด้านซ้าย(x) และเฟรมด้านบน(y) ตามที่เรากำหนด 

ที่เหลือสามารถอ่านเพิ่มเติมได้ในนี้ครับ http://www.renpy.org/wiki/renpy/doc/reference/Properties_and_Styles


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

               สำหรับวิธีการในเวอร์ชั่นใหม่นั้นเราก็จะประกาศเพียงแค่


               $ a = Character("ชื่อภาษาไทย", color="#c8ffc8", what_font="ชื่อ font ภาษาไทยของคำพูดตัวละครนั้น.ttf", font="ชื่อ font ภาษาไทยของชื่อตัวละคร.ttf") 

               ตัวอย่าง
               
$ e = Character("ไอรีน",color="#c8ffc8",font="angsa.ttf",
what_font="angsa.ttf" ) 

               # เวลาจะใช้งานก็ประกาศแล้วเขียนภาษาไทยตามปกติเลย
               
e "ภาษาไทย"


               เท่านี้ก็สามาเราเรียกใช้ภาษาไทยได้หมดแล้วครับ ที่เหลือก็เพียงแค่ Copy ไฟล์ Font ภาษา                  ไทยมาไว้ใน Folder Game ของเราก่อนเท่านั้นเองครับ
 

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

รูปวาดยามว่าง ภาค1

posted on 21 Apr 2011 15:15 by vashiya  in CG, Drawing
 โอ้.....แหม.....แหม...แหม....ไม่คิดไม่ฝันเหมือนกันว่าจะได้มีโอกาสเอาภาพจากในกระดาษวาดเล่นมามาลงให้คนอื่นดู   ซึ่งแต่ว่าจริงๆแล้วเมื่อหลายวันก่อนดันไปเอ่ยปากรับคำไปว่ามีบางภาพในกระดาษวาดเล่นที่จะนำมาให้ชมกัน ถึงจะบอกว่าเป็นกระดาษวาดเล่นก็เห่อะแต่จริงๆแล้วมันก็คือกระดาษทดธรรมดานี่แหล่ะ พอกลับถึงบ้านก็โยนๆไว้บนโต๊ะ จนลืมไปแล้วว่ามันเก็บอยู่ไหน กว่าจะหาเจอก็นานโขเพราะห้องตรูรก   บางภาพพอมีเวลาก็ตัดเส้นให้บางภาพขี้เกียจก็เอามาทั้งอย่างงั้นแหล่ะ  เอาวะในเมื่อจะโชว์แล้วก็เป็นไงเป็นกัน เตรียมตับกันไว้ให้ดีละกันเกิดอะไรขึ้นตรูไม่รู้ด้วยนะ
มาเริ่มกันที่ภาพแรกกันเลย ภาพนี้กะว่าจะวาดเพื่อ HBD ตาหมึกแดงอ่ะนะแต่พอวาดไปได้สักหน่อยปรากฏว่ามีงานด่วนเข้ามา กว่าจะสะสางงานเสร็จ   อ้าว......เลยเวลาไปแล้วรึนี่ แต่ในเมื่อเอาออกมาในที่สาธารณะแล้วคงไม่สามารถเอ่ยคำใดกับภาพนี้ได้นอกจากคำว่า
HBD ย้อนหลังว่ะตาหมึก 555555..........
 
สำหรับในภาพต่อมานั้น เป็นภาพสุดยอดสร้างสรรค์ตระการตาพร้อมนักแสดงใจดีและใจถึงจาก ชาวคาระ ซึ่งเคยทำให้หลายท่านได้อุ่นตับกันมาบ้างแล้ว
 
 
จริงๆแล้วภาพนี้ผมก็มีที่มาและแรงบันดาลใจนะครับ  มันมาจากคลิ๊ปโคตรเสื่อมนี่แหล่ะ ปวดตับยิ่งนัก
ต่อมาก็จะเป็นภาพที่ผมได้เคยสัญญากับคนในคาระ ไว้ซึ่งก็อันนี้แหล่ะที่หากันไม่เจอเพราะไม่รู้ว่าโยนเอาไว้ไหนกว่าจะหาเจอก็ตั้งหลายวัน วันนี้ก็เลยเอามาตัดเส้นซักหน่อย จะว่าไปเป็นภาพที่น่ารักสุดแล้วมั้งภาพนี้
ซะเมื่อไหร่
 
หลังจากนั้นก็ตามมาด้วยภาพนี้ จริงๆแล้วภาพนี้มาก่อนภาพด้านบนอีกอ่ะนะแต่ว่าไหงมันช่างสอดคล้องกันอย่างน่าตกใจจริงๆ (หรือจะเรียกว่าเดจาวูดีนะ)
เอาล่ะเป็นอันจบหมดแล้วสำหรับภาพเสื่อมๆที่วาดยามว่าง.......   ในช่วงนี้จริงๆแล้วยังมีอีกเยอะแต่เป็นภาพขีดๆดูแล้วมั่วๆน่ะ
อะไรนะขอภาพล้างตางั้นเรอะ  ผมมันไม่ใช่คนใจดีอะไรขนาดนั้นหรอกนะไปหาดูที่อื่นเห่อะ......
เดี๋ยว...เดี๋ยว...เดี๋ยว....อย่าเทน้ำมันแล้วจุดไฟใน Blog ผมนะ
OK OK OK ครับเดี๋ยวจัดให้.........
ภาพนี้ผมไม่แน่ในว่ามันเป็น 18+ รึเปล่านะแต่ผมคิดว่ามันก็ไม่น่าจะถึงขนาดนนั้นอ่ะนะ สำหรับภาพนี้คงไม่ต้องตอบก็คงรู้อ่ะนะว่าใคร............
ย้าก........ ช่วงนี้วันหยุดยาวมีเวลาว่างเยอะต้องรีบๆอัพให้หมดเร็ว  เนื้อหาในบทนี้นั้นจะเข้าสู่การศึกษาภาษานี้อย่างจริงจังซะทีอาจจะต้องทำการแยกย่อยเป็นหลายๆส่วนหน่อยเพราะว่าเนื้อหาในส่วนนี้มันมีมากมายมหาศาลจริงๆกว่าจะแปลหมดคงอีกนานดังนั้นผมก็จะค่อยๆแปลมาลงไปเป็นส่วนๆมาละกันครับ ซึ่งเนื้อหาในบทนี้ก็จะเน้นหนักไปทางคำสั่งที่เกี่ยวกับ

- label
- jump
- call
- init
- image


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

- คำสั่ง ตัวนี้ยังไงก็ต้องเขียนลงไปในคำสั้งด้วย (ไม่เขียนลงไปมีเคือง 5555)
- (คำอธิบาย)? ตัวหนี้หมายถึง option ของคำสั่งนี้อ่ะครับคือว่าจะใส่หรือว่าไม่ใส่ลงไปในคำสั่งนี้ก็ได้
- name ชื่อที่คุณต้องการที่จะตั้ง(อยากจะตั้งอะไรก็ตั้ง)

• label
ผมคงจำเป็นที่จะต้องขึ้นในส่วนนี้ก่อนนะครับเพราะว่านี่ก็เป็นอีกส่วนที่สำคัญที่สุดก่อนที่จะเริ่มต้น เขียนเหมือนกันเพราะหากเราไม่มีความรู้ความเข้าใจในส่วนนี้แล้วละก็เราก็มิอาจจะเขียนเกมส์ได้เลย 
คำว่า label แปลตรงตัวหมายถึง ฉลาก,ป้าย,ตรา แต่ในทาง programming มันเปรียบเสมือนท่า เดินรถ , ป้ายรถเมล์ , สถานี อะไรประมาณนี้แหล่ะ กล่าวคือมันจะเป็นตัวที่ mark ตำแหน่งของบรรทัดในหน้าprogram ที่เราได้เขียนไว้(คล้ายๆกับจุด save ในเกมส์ rpg ทั่วไปน่ะแหล่ะ)เห็นว่าอย่างงี้ มันมีประโยชน์มากมายยิ่งนัก โดยหลักการทำงานของโปรแกรมทั่วไปนั้นมันจะอ่านโค๊ดที่เราเขียนจากบนลงล่าง หมายความว่าหากมันอ่านบรรทัดไหนไปแล้วมันไม่ย้อนกลับไปอ่านใหม่หรอก(นอกจากว่าตำแหน่งนั้นจะเป็น loop, function หรือ header)หรือว่าอยากจะกระโดดข้ามบรรทัดไหนไปดื้อๆก็ไม่ได้เช่นกัน(นอกจากคำสั่งเกี่ยวกับทางเลือก)
การเรียกใช้งาน label นั้นก็ง่ายแสนง่ายเพียงแค่คุณเลือกบรรทัดที่ถูกใจจากนั้นพิมพ์คำสั่งนี้ลงไป

“label” name “:”
ตัวอย่าง label mark :


แต่ว่าแน่นอนครับการใช้ label นั้นมันก็เป็นเพียงแค่การ mark บรรทัดที่ต้องการไว้เท่านั้นจะต้องมีการเรียกใช้งานบางคำสั่งด้วยจึงจะสามารถกลับไปยังตำแหน่งที่เรา mark ไว้ได้คำสั่งที่พบเห็นก็จะมีอยู่ 2 ตัวครับ คือ คำสั่ง jump และ call

• jump คำสั่งนี้จะทำการย้อนการอ่านโค๊ดไปยังตำแหน่ง label ที่เราได้กำหนดมาไว้แล้ว ลักษณะการใช้งาน
“jump” name
ตัวอย่าง jump mark


• call เหมือนกับคำสั่ง jump ทุกอย่างดีกว่าตรงที่สามารถเรียกข้ามไฟล์ได้แต่จะต้องตั้งชื่อของคำสั่งนี้ไว้ด้วยว่าชื่ออะไรเพื่อที่จะได้กลับมาถูกไฟล์หากเราทำงานที่ไฟล์นั้นเสร็จแล้ว ลักษณะการใช้งาน
“call” name (from ชื่อของคำสั่ง call (ตั้งเอง))?
ตัวอย่าง
call target from name_of_this_position


• Init เปรียบเสมือนส่วน header ของโปรแกรมจะเป็นส่วนที่ต้องมีไว้เพื่อประกาศค่าของตัวแปรและคำสั่งนี้ต้องอยู่ตำแหน่งบนสุดของหน้าโปรแกรมเสมอ ลักษณะการใช้งาน
“init” (number)? “:”
ตัวอย่าง init -1 :

number ในที่นี้หมายถึงค่าลำดับความสำคัญในการที่จะให้โปรแกรมอ่านส่วนนี้ก่อน(priority number) ค่ายิ่งน้อยก็ต้องอ่านก่อน ติดลบได้

• image เอาล่ะครับสำหรับคำสั่งแรกในหมวดนี้นั้นทางเราก็ขอเสนอ 

- image เราจะต้องประกาศค่าตัวแปรนี้ไว้ไว้ในส่วน init: ของโปรแกรมเท่านั้น ลักษณะการใช้งานของ คำสั่งนี้สามารถเขียนออกมาได้ดังนี้
"image" ชื่อของ backgroundหรือชื่อของตัวละคร = ที่อยู่ของรูปที่เราเก็บเอาไว้โดยปกติจะใช่เป็น .jpgหรือ.png“
ตัวอย่าง
image ex_bg = "exbg.png" 


เมื่อเราทำการประกาศค่าแล้วก็ถึงเวลาที่จะต้องเรียกใช้งานมันสักที (การประกาศค่ามันเป็นเพียงแค่การสร้างนามบัตรโปรแกรมนั้นรู้จักกับตัวแปรที่เราสร้างขึ้นมาเท่านั้นเอง)

- show คำสั่งนี้จะเป็นตัวที่เรียกให้ตัวละครที่เราประกาศไว้แล้วนั้นแสดงขึ้นมากลางหน้าจอ ลักษณะการใช้งานของ คำสั่งนี้สามารถเขียนออกมาได้ดังนี้ 
"Show” ชื่อของตัวละครที่เราได้ประกาศไว้ในตัวแปร image (at left / center / right)?
ตัวอย่าง
Show pic at left

- scene เป็นคำสั่งที่เรียกให้backgroundที่เราประกาศไว้แล้วนั้นแสดงขึ้นมา ลักษณะการใช้งานของ คำสั่งนี้สามารถเขียนออกมาได้ดังนี้
"Scene" ชื่อของ background ที่เราได้ประกาศไว้ในตัวแปร image
ตัวอย่าง
Scene ex_bg

- with dissolve คำว่า dissolve แปลตรงตัวหมายถึง ละลาย,จางหาย เมื่อนำคำสั่งนี้ไปต่อหลังคำสั่ง show หรือ scene มันจะทำให้เมื่อตัดฉากขึ้นหน้าใหม่หรือเปลี่ยนภาพตัวละครใหม่ตัวละครเก่าจะค่อยๆจางหายไป ลักษณะการใช้งาน
 
“Show” ชื่อของตัวละครที่เราได้ประกาศไว้ในตัวแปร image (at left / center / right)? “with dissolve”
ตัวอย่าง
show pic at right with dissolve


“scene”
ชื่อของตัวละครที่เราได้ประกาศไว้ในตัวแปร image “with dissolve”
ตัวอย่าง
scene ex_bg with dissolve


อันที่จริงแล้วคำสั่งที่เกี่ยวกับ with ยังมีอีกมากแต่จะขอกล่าวในบทถัดๆออกไปอีกก็แล้วกันครับ

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


· กลุ่มคำสั่งที่เกี่ยวกับการจัดการกรอบคำพูด

style.window.background = Frame("frame.png", 12, 12) เป็นการกำหนดค่าของกรอบคำพูดโดยใช้ฟังก์ชัน Frame เป็นตัวกำหนด. ฟังก์ชัน Frame นั้นจะมีพารามิเตอร์อยู่ 3 ตัวคือ 

ตัวที่1. จะเป็นตัวที่กำหนดรูป Background ของกรอบคำพูดว่าเป็นรูปไหนในที่นี้จะกำหนดให้ใช้รูปที่ชื่อว่า frame.png หากคุณต้องการที่จะใช้รูปอื่นก็สามารถเปลี่ยนชื่อตามที่คุณต้องการได้นะจ๊ะ 

ส่วนตัวที่2และ3 จะเป็นตัวที่จะกำหนดขนาดของกรอบ โดยที่ตัวที่ 2 จะกำหนดความหนาทางด้านซ้ายและขวาของกรอบคำพูดและตัวที่ 3 จะกำหนดความหนาทางด้านบนและล่างของกรอบคำพูด(กำหนดไว้ตามทีมันให้มาดีที่สุตแต่จะปรับแต่งเองก็อีกเรื่องนึง)




style.window.left_margin = 6 กำหนดตำแหน่งความห่างทางซ้ายระหว่างขอบwindowกับกรอบคำพูด

style.window.right_margin = 6 กำหนดตำแหน่งความห่างทางขวาระหว่างขอบwindowกับกรอบคำพูด

style.window.top_margin = 6 กำหนดตำแหน่งความห่างทางด้านบนระหว่างขอบwindowกับกรอบคำพูด

style.window.bottom_margin = 6 กำหนดตำแหน่งความห่างทางด้านล่างระหว่างขอบwindowกับกรอบคำพูด

style.window.left_padding = 6 กำหนดตำแหน่งความห่างทางซ้ายระหว่างกรอบคำพูดกับข้อความในกรอบคำพูด

style.window.right_padding = 6 กำหนดตำแหน่งความห่างทางขวาระหว่างกรอบคำพูดกับข้อความในกรอบคำพูด

style.window.top_padding = 6 กำหนดตำแหน่งความห่างทางด้านบนระหว่างกรอบคำพูดกับข้อความในกรอบคำพูด 

style.window.bottom_padding = 6 กำหนดตำแหน่งความห่างทางด้านล่างระหว่างกรอบคำพูดกับข้อความในกรอบคำพูด

style.window.yminimum = 250 กำหนดความสูงของกรอบคำพูด จากตัวอย่างจะกำหนดให้ความสูงของกรอบคำพูดอยู่ที่ 250 พิกเซล (เราจะเรียกใช้คำสั่งนี้หรือไม่ก็ได้)



· กลุ่มของคำสั่งที่เกี่ยวกับการกำหนดตำแหน่งการวางของหน้าจอ Menu ตอนไตเติ้ลเกมส์ 

คุณสามารถเลือกใช้ได้ 2 แบบ คือ 

1. แบบที่จะต้องเขียนเองในส่วนนี้นั้นคุณจำเป็นที่จะต้องไปเขียนเพิ่มเติมกันเอาเองนะครับโดยที่ จะต้องเพิ่มไว้ตรงท้ายนอกวงเล็บ ” ) ”ของฟังก์ชัน theme.roundrect ซึ่งเราได้เคยกล่าวไว้แล้วจากครั้งก่อน (อันที่จริงแล้วเราจะวางไว้ตรงไหนก็ได้อ่ะนะแต่ผมว่าวางไว้ตรงนี้มันมองเห็นง่ายดีไม่มั่วด้วยล่ะ เหอ...เหอ...เหอ...) 

style.mm_menu_window.yanchor = 0 กำหนดแกนYโดยใช้ตำแหน่งกึ่งกลางเมนูเป็นหลัก
style.mm_menu_window.ypos = 0.05 กำหนดแกนYโดยใช้มุมบนซ้ายเป็นหลัก
style.mm_menu_window.xanchor = 0 กำหนดแกนXโดยใช้ตำแหน่งกึ่งกลางเมนูเป็นหลัก
style.mm_menu_window.xpos = 0.05 กำหนดแกนXโดยใช้มุมบนซ้ายเป็นหลัก 

2. แก้ไขจากตัวโค๊ดที่มีให้อยู่แล้ว ดังรูป

style.mm_menu_frame.xpos = 0.5 กำหนดแกนXโดยใช้มุมบนซ้ายเป็นหลัก 
style.mm_menu_frame.xanchor = 0.5 กำหนดแกนXโดยใช้ตำแหน่งกึ่งกลางเมนูเป็นหลัก
style.mm_menu_frame.ypos = 0.75 กำหนดแกนYโดยใช้มุมบนซ้ายเป็นหลัก
style.mm_menu_frame.yanchor = 0.5 กำหนดแกนYโดยใช้ตำแหน่งกึ่งกลางเมนูเป็นหลัก





ปล. ทั้ง 2 คำสั่งนี้ทำงานเหมือนกันแล้วแต่ว่าใครอยากจะเรียกใช้ตัวไหนละกัน หากเรากำหนดเอา 2 ค่านี้ไว้พร้อมกัน เช่น 
style.mm_menu_frame.xpos = 40 style.mm_menu_frame.xanchor = 100

ผลที่ได้ออกมาก็คือมุมซ้ายบนของ Menu จะไปหรากฎอยู่บนแนวแกน x ที่ -60เนื่องจากจะเกิดการหักล้างค่ากันนั่นเองโดยมีสูตรการคิดดังนี้ 

ตำแหน่งแกนXหรือyบนมุมซ้ายบนที่แสดงจริงๆ = ตำแหน่งแกนxหรือyที่มุมซ้ายบน - ตำแหน่งแกนxหรือyในตำแหน่งกึ่งกลางเมนูเป็นหลัก 

ค่าของตัวเลขที่เราจะต้องกำหนดในส่วนนี้สามารถกำหนดได้ 2 แบบคือ ถ้ากำหนดเป็นตัวเลขจำนวนเต็มมันจะกำหนดค่าตำแหน่งที่แสดงผลออกมาเป็นหน่วยพิกเซล แต่ถ้าใส่เป็นค่าทศนิยมมันจะแสดงผลตำแหน่งออกมาเป็นหน่วย นิ้ว (int) 

· กลุ่มคำสั่งที่กำหนด Font และขนาดของตัวอักษร(ถ้าคิดจะเปิดใช้งานคำสั่งนี้ต้องเปิดใช้งานพร้อมกันทั้งคู่นะจ๊ะ)

style.default.font = "DejaVuSans.ttf" กำหนดชนิดของ Font ที่จะใช้งาน
fontstyle.default.size = 30 กำหนดขนาดของตัวอักษร 



· ต่อมาก็จะเป็นส่วนของการกำหนดค่าเกี่ยวกับเสียง
config.has_sound = True/ False อนุญาตให้ใช้
sound effectsconfig.has_music = True/ False อนุญาตให้ใช้เพลงประกอบ
config.has_voice = True/ False อนุญาตให้ใช้เสียงต่างๆ เช่นเสียงพูด
style.button.activate_sound = "click.wav" เสียงปุ่มกดทั่วไป
style.imagemap.activate_sound = "click.wav" เสียงปุ่มกดของimage map(รูปภาพที่กดได้)
config.enter_sound = "click.wav" เสียงปุ่มกดตอนเข้าเกมส์ 
config.exit_sound = "click.wav" เสียงปุ่มกดตอนออกจากเกมส์
config.sample_sound = "click.wav" เสียงปุ่มกดเพื่อทดลองเสียงในส่วน option
optionconfig.main_menu_music = "main_menu_theme.ogg" เพลงไตเติ้ลตอนหน้า menu เกมส์ 




Tip เล็กน้อย สำหรับการกำหนดค่า 

ในบางครั้งเมื่อเราทำการลบ เครื่องหมาย # ออกไปเพื่อที่จะทำการกำหนดค่านั้น เมื่อลบไปแล้วจึงทำการรันเกมส์ใหม่แต่ไหง มันขึ้นว่า “ SyntaxError: invalid syntax (line XXX) ” ได้ล่ะนี่ คุณอาจจะนึกในใจว่า อีตาคนสอนมันมั่ว หรือว่าโปรแกรมมันยังไม่สมบูรณ์กันแน่วะ (5555ผมได้ยินนะ) ใจเย็นๆครับอับดุนแก้ได้(5555) เนื่องจากว่ารูปแบบของไวยากรณ์ภาษานี้อาจจะออกบ๊องๆหน่อย คือว่าเมื่อคุณทำการลบเครื่องหมาย # ออกแล้วให้คุณทำการล่นย่อหน้าเข้ามา ก็คือล่นย่อหน้าเข้ามาให้อยู่ในคอลัมน์ที่9เท่านั้นเองน่ะครับ เท่านี้เองการปรับแต่งค่าของพวกคุณก็ผ่านฉลุยไม่มีคำเตือน Error โผล่ขึ้นมาให้คุณหงุดหงิดใจอีกต่อไป............
 
 
 
 ต่อมาก็จะเป็นส่วนของการกำหนดลิ๊งค์ไปยัง Help File 
config.help = "README.html" ก็ไม่มีอะไรมากแต่เราก็สามารถกำหนดเป็นไฟล์อะไรก็ได้นอกเหนือจาก .html จากที่กำหนดให้ในตอนแรก เช่น .txt หรือ .pdf ก็ได้ (ส่วนปุ่มที่กดไปยัง Help file นั้นก็อยู่ที่หน้า Menu เกมส์เราเลยนะ)
 
 
 
ถัดจาก Help file ก็จะเป็นการกำหนดค่าในส่วนของ Transitions หรือ การตัดฉากนั่นเองซึ่งก็จะมีการกำหนดค่าต่างๆดังนี้
 
config.enter_transition = None รูปแบบ(ประมาณว่าเอฟเฟ็กน่ะแหล่ะ)ในการตัดฉากจากหน้าจอเกมส์เข้าสู่หน้าจอ Menu ภายในเกมส์ถ้าไม่มี(None) ก็แสดงว่าเข้าสู่ Menu ภายในเกมส์เลย ไม่มีอะไรที่วุบวับวืบวาบหวือหวา...... เป็นต้น 
config.exit_transition = None เหมือนกับข้างบนแต่เป็นเอฟเฟ็กตอนออกจากหน้าจอ Menu ภายในเกมส์เกมส์
 
config.intra_transition = None เป็นเอฟเฟ็กในการตัดฉากเข้าสู่ส่วนต่างๆของ Menu ภายในเกมส์
 
config.main_game_transition = None เป็นเอฟเฟ็กการตัดฉากเข้าสู่หน้า Option จากหน้า Menu หลัก
 
config.game_main_transition = None เป็นเอฟเฟ็กการตัดฉากเมื่อออกจากตัวเกมส์มาสู่หน้าเมนูหลัก
 
config.end_splash_transition = None เป็นเอฟเฟ็กการตักฉากเมื่อเริ่มต้นเข้าสู่ฉาก Menu เกมส์
 
config.end_game_transition = None เป็นเอฟเฟ็กการตัดฉากเข้าสู่ Main Menu หลังจากจบเกมส์แล้ว
 
config.after_load_transition = None เป็นเอฟเฟ็กการตัดฉากในในตอนที่โหลดเกมส์เข้าสู่ตัวเกมส์
 
config.window_show_transition = None เป็นเอฟเฟ็กในการปรากฏกรอบคำพูดขึ้นมา (คำสั้งในการสั่งให้กรอบรูปปรากฏขึ้นมาใช้ window show นะครับ)
config.window_hide_transition = None เป็นเอฟเฟ็กการตักฉากซ่อนกรอบคำพูดออกไปจากหน้าจอครับ (คำสั่งในการซ่อนกรอบรูปใช้ คำสั่ง window hide ครับ)
 
 
 
 
 
ต่อมาก็จะมาในส่วนของการตั้งค่าอื่นๆนอกเหนือจากนี้นะครับเรามาดูกันว่ามันมีอะไรกันบ้าง
config.save_directory = "xxxx" ตรงนี้ไม่ต้องไปแก้ไขอะไรโปรแกรมมันตั้งค่าให้ตั้งกะต้นแล้วซึ่งมันก็คือการกำหนด Save file ครับ  ในบทความนี้ผมจะยังไม่ขอลงลึกในส่วนนี้ก่อนละกันครับแล้วจะทำการอธิบายให้อีกทีในบทถัดๆไป
config.default.fullscreen = true/false เป็น true ถ้าต้องการให้เริ่มต้นมาแล้วแสดงหน้าจอเกมส์แบบเต็มจอในขณะที่ เป็น False จะเป็นการแสดงหน้าจอเกมส์เป็นกรอบ window ตามขนาดที่เราได้กำหนดไว่ในข้างต้น
 
config.default_text_cps = 0 เป็นการกำหนดความเร็วเริ่มต้นในการขึ้นของตัวหนังสือ ซึ่งความเร็วนั้นก็จะมีไปตั้งแต่ 1 - 150 (เรียงตามลำดับจากน้อยไปมาก) ในขณะที่ค่า 0 นั้นจะเป็นการไม่แสดงถึงความเร็วในการขึ้นของตัวหนังสือ (หลังจากตั้งค่าตัวนี้แล้วเราจำเป็นที่จะต้องไปเคลียค่าเก่าที่ตั้งไว่ก่อนโดยการไปกดปุ่ม Delete Persistent ที่หน้าต่างหลักของ Renpy เพื่อเคลียค่าก่อน แล้วค่อยลองเปิดขึ้นมารันใหม่อีกทีนึง) 
 
เอาล่ะก็จบลงไปแล้วสำหรับบทแรกของเรา.....หลังจากที่ท่านทั้งหลายได้ลองอ่านบทความนี้แล้วหลายท่านก็คงนึกอยู่ในใจว่ายังไม่เห็นจะมีการใส่ภาพหรืออะไรลงไปเลย ใจเย็นๆครับพี่น้องบทแรกที่ผมจะกล่าวนำก็คือการกำหนดค่าต่างๆก่อนที่จะสร้างเกมส์ครับ ประมาณว่า การ Config ค่าอะไรประมาณนั้นแหล่ะ ครั้งต่อไปในบทหลังๆก็จะเป็นการแนะนำในการใช้งานคำสั่งต่างๆที่จำเป็นในการสร้างเกมส์ครับ แล้วพบกันใหม่ในครั้งต่อไปครับบ๊ายบาย.........อ๊า.......

          COUNTER