--- title: การเขียนโปรแกรมคอมพิวเตอร์ ปี 1 subtitle: date: วันอังคารที่ 15 กุมภาพันธ์ 2565 เวลา 13.00 น. --- (ข้อความสดจากระบบถอดความเสียงพูดทางไกล) (พี่อี๊ด) สวัสดีค่ะ สวัสดีค่ะ ได้ยินเสียงค่ะ ได้ยินเสียงล่ามไหมคะ ได้ยินเสียงล่ามไหมคะ ล่ามพูดอยู่ค่ะ ค่ะ พูดอยู่ค่ะ ได้ยินไหมคะ เสียงไปไหมคะ นะครับ ให้เรียบร้อย ผู้ชายก็ใส่เนคไทเลยนะครับ เดี๋ยวใครไปบ้างจะส่งรายชื่อให้นะ เฉพาะพวกเรานี่ล่ะ ส่วนใครที่ไม่ได้ไปไม่ต้องเสียใจนะ ทำไม่เอาหนูไปด้วย อย่างตี๋สั้นผมอยากไป ที่นั่งมันเต็มแล้วนะครับ ส่วนวันที่ 7 มีนาคม นะครับ 7 มีนาคม จะไปขอนแก่น จะไปโรงเรียนเอ็มนะครับ จะกลับไปโรงเรียนเอ็ม จะกลับไปคุยกับ ผอ. ว่าจะอย่างไรนะครับ ไม่แน่อาจจะเอาเอ็มว่างอยู่น่ะ เดี๋ยวจะขอคุยกับโรงเรียนตาบอก ว่าจะอย่างไร ไปด้วยไหมมุก ไม่ต้องไปหรอก 2 ที่แล้ว เพราะว่ารู้สึกว่าเขาจะปิดแล้วนะครับ วันที่ 7 มีนาคม ก็ประมาณนี้นะครับ ก็เมื่อเช้าเพิ่งคุยกับทีมงาน TTRS ทางล่ามออนไลน์ว่าปีการศึกษาหน้าจะอย่างไรนะครับ เราจะยังเห็นพี่การ์ตูนอยู่ไหม พี่อี๊ดอยู่ไยังเห็นอยู่ไหมนะครับ ยังเหมือนเดิมนะครับ เรายังเจอกันเหมือนเดิม ซึ่งปีหน้าก็จะฝากถึงพี่การ์ตูนด้วยว่ารุ่นที่ 5 นะครับ รุ่นที่ 5 นะครับ ก็จะมา เรารับ 10 ก็จะใช้ระบบล่ามออนไลน์ไปเรื่อย ๆ นะครับ จะไม่ให้เราใช้นะครับ ซึ่งเขาก็ยังให้ใช้ตลอดนะครับ ถ้าเรายังมีนักศึกษาอยู่ ก็อาจารย์พ่อ อาจารย์แม่ก็ยังดูแลพวกเราต่อไป อะไรที่ในเวลาถ้าใครหิวข้าวก็บอกนะ บอก ไม่ใช้ว่าให้คนเดียว ไม่ใช่หรอกครับ บอกได้ มุกอยากกินอะไรอย่างนี้นะครับ อยากกินสเต็กจระเข้ ใช่ไหมหมูแพงต้องกินจระเข้แทนนะครับ ก็เดี๋ยวว่าง ๆ เราค่อยว่ากันนะครับ ค่อยว่ากันอีกที ให้ COVID มันซา ๆ ลงนิดหนึ่ง ส่วนที่อาจารย์พ่อรับปากว่าจะพาพวกเราไปดูนอกสถานที่ ปรากฏว่าติดต่อไปแล้วเขาบอกว่า อาจารย์ ผมไม่ได้กลัวอาจารย์นะครับ อาจารย์บอกว่าผมไม่ได้กลัวคุณ แต่เขาไม่ให้เข้าจังหวัดนะครับ ผอ. นคติดต่อไปแล้วเขาบอกอาจารย์เขาไม่อยากเสี่ยงเราไม่อยากเสี่ยง เขาก็กลัวเรา เราก็กลัวเขา นครพนมบ้านแฝดนะ เห็นว่าวิ่งหนักใช่ไหมแฝด แฝดอยู่หรือเปล่าแฝด เห็นไหม แถวบ้าน แถวบ้านแฝดก็เยอะใช่ไหม COVID เห็นแถวนาว่า นาแก ไปไม่ได้เลยใช่ไหม เยอะนะครับ ก็จะคุยกันเรื่อย ๆ แบบนี้นะครับ อย่างไรโยโกะ ไม่ได้ไอ้นั่นนะ โยโกะเป็นอย่างไรบ้าง ก็ระวังตัว จะไปไหนมาไหนนะครับ ถ้าไปก็ให้บอก ให้แจ้งกันนะครับ ก็เป็นห่วงพวกเราทุกคนนะครับ เดี๋ยวอย่างไรก็จะไปไหนมาไหน อาจารย์พ่อบกันอาจารย์แม่ก็จะสื่อสารเราผ่านกลุ่มไลน์ของพวกเรานะครับ ส่วนใครมีอะไรจะปรึกษาก็ LINE ส่วนตัวได้ นะครับ เพราะว่าตอนนี้เราต้องช่วยเหลือตัวเองนะครับ ต้องช่วยเหลือตัวเอง ป้องกันตัวเองด้วย ถ้าเกิดมีใครติดมาคนหนึ่ง ห้องเราเรียบร้อยเลย เขาสั่งปิดพวกเราเลยนะครับ เราจะไม่ได้เจอกันเลยนะครับ เป็นเทอมนะครับ ก็ให้ตั้งใจนะครับ เดี๋ยวอย่างไรเพิ่งเจอวิทยากร ก็เดี๋ยวถ้าเกิดหลังจากเรียนจบเทอมจะมีอบรมนะครับ ก่อนปิดเทอมให้นะครับ ก็เรียนกับอาจารย์แม่ต่อเลยครับ (อาจารย์สุธิรา) เปิดโปรแกรมรอเลยนะคะ เปิด Sublime เลย เปิดอะไรไม่ได้ทำไม อัปเดตอยู่หรือ ปล่อยมันไป ก็ใช้เครื่องไอ้ดอมสิ เครื่องข้าง ๆ ว่าง ดูนะคะ สัปดาห์ก่อนน่ะ ที่เราจะเอาอุปสรรคหรือสิ่งกีดขวางมาวางทีนี้เนื่องจากอย่าลืมว่าไอ้ตัวอุปสรรคหรือสิ่งกีดขวางเรามีตั้ง 4 อันใช่หรือเปล่า เราก็เลยจะมาพาเขียนโค้ดอีกแบบหนึ่งนะคะ ก็คือ มาดูหัวข้อกัน หัวข้อที่เราจะเรียนในวันนี้ หัวข้อที่ 1 function for loadding multiple image ก็คือเราจะมาเขียนโค้ดเพื่อไว้ใช้สำหรับ เขียนโค้ดที่เรียกว่าเป็น Function ที่จะเอาไว้โหลดรูปที่มีหลาย ๆ รูป เพราะฉะนั้น เราเขียนโค้ดนี้ เขียนฟังก์ชันนี้ไว้ปุ๊บ แล้วเราจะสามารถเอาไปใช้กับตัวอื่นได้นึกออกนะ ก็เขียนแค่ครั้งเดียวเลย ก็คือเป็นฟังก์ชันใช้ในโปรแกรมอื่น ๆ ได้นะคะ และ 2. เมื่อมีฟังก์ชันแล้วเราก็ทำคลาส จำได้นะ เหมือนตอนที่เราไดโนเสาร์ครั้งแรก เราก็ทำ Class ให้มันอยู่ใช่ไหม เพราะรูปของไดโนเสาร์มันเกิดจากเอาภาพหลาย ๆ ภาพมันต่อกัน เพื่อให้มันมันเคลื่อนไหวได้นะคะ เพราะฉะนั้น ก้อนหินก็เหมือนกันหรือสิ่งกีดขวางที่เราจะเอามาวางเหมือนกัน จะอยู่มันจะเลื่อนไปตามที่เราวิ่งด้วยใช่ไหม เพราะฉะนั้น ก็เลยมาทำ Class ให้มัน หัวข้อที่ 2 คือ class for creating and moving obstacle ก็คือการสร้างคลาสสำหรับไว้สร้างแล้วก็เคลื่อนย้ายสิ่งกีดขวางของเรานั่นเองนะคะ วันนี้โค้ดเยอะ เพราะฉะนั้น ฟังดี ๆ นะ พอเห็นโค้ดน่ะ ถ่ายได้แต่อย่าพิมพ์ก่อน เข้าใจไหม ให้ดูตามที่พิมพ์ใน Sublime เพราะเหมือนมันจะมีบางตัว Sublime มันจะเป็นตัวช่วยใช่ไหมคะ พออาจารย์เปิดโค้ดเด็ก ๆ ก็จะถ่ายโค้ดไว้เสร็จแล้วก็พิมพ์เลยไม่ดูว่าเวลาจริง ๆ จะใช้แล้วจะทำอย่างไรนะ พร้อมหรือยัง พร้อมจะโค้ดหรือยัง ถ้าพร้อมนะคะ ไปกันเลย ไปกันเลยอย่างนั้นน่ะ พร้อมหรือยังเปิด เปิด Sublime ขึ้นมาก่อน ตื่นเต้น ๆ แล้ว เห็นไหม Class มันจะอยู่ตรงนี้ใช่ไหม สร้างไว้ก่อน class dino นะคะ เพราะฉะนั้น เด็ก ๆ เปิดเข้ามาปุ๊บ เจอ Class Dino วรรคไปเสียก่อน 2 บรรทัด 2 ครั้งนะคะ ก็คือพอเราเจอClass Dino เรา เราก็เว้นไว้ 2 Enter ลงไป 2 ครั้งนะคะ นี่ เราจะอยู่ที่บรรทัดที่ 3 กันนะคะ ทีนี้ตัวเดิม ตัวเดิมในครั้งก่อนย้อนกลับไปดู จำได้นะ ไอ้ตัวที่เป็นที่เราจะไปโหลดรูปมาน่ะ โหลดรูปไอ้สิ่งกีดขวางที่ของเด็ก ๆ ไม่ว่าจะเป็นก้อนหินหรือกล่องของขวัญน่ะ ใน Comment ไปเสียเลยปิดไปเลยหรือลบออกก็ได้นะคะ ใช้วิธีลบออกก็ได้ เราจะไม่โหลดจากวิธีนี้ ลบออก Delete ไปเลย อย่างนี้นะคะ ไอ้ตัวที่เกี่ยวข้องกับครั้งก่อนน่ะ ที่เกี่ยวกับสิ่งกีดขวางเราน่ะ ลบออกไปเลยนะคะ ลบไปได้เลย ๆ ไม่อย่างนั้นมันจะต้องเขียนโค้ดเยอะกว่านี้ เราจะพยายามใช้การเขียนให้มันสั้นนะคะ แล้วเอาไปใช้กับตัวอื่นได้ด้วย นะคะ อันดับแรก ก่อนจะสร้างคลาส เราจะมาสร้างฟังก์ชันก่อนนะคะ สร้างเป็นฟังก์ชันก่อนนะ โดย เป็นฟังก์ชันเพื่อจะใช้สำหรับการนำเข้ารูปภาพหลาย ๆ รูป ฟังก์ชันนี้ หมายถึง ครั้งหน้าเราจะเขียนโปรแกรมใหม่แล้วมีรูปที่จะใช้เยอะ ๆ เราก็เอาฟังก์ชันนี้ไปใช้งานได้เลย นึกออกไหม นั่นก็คือวิธีการเขียน 1 ครั้งแล้วใช้ร่วมกันได้นะคะ ให้ดูก่อนนะ ดูโครงสร้างของมันก่อนนะคะ สังเกตว่าจากภาพที่เห็นนี่นะคะ สังเกตว่าทุกครั้งที่เราจะให้เขียนโค้ดนะคะ แม่จะพยายามให้เขียนคอมเมนต์ทุกครั้งเสมอใช่ไหม เพราะอะไร เมื่อเวลาเราเขียนคอมเมนต์ มันก็คือเป็นการบอกว่าส่วนนี้นะคะ เราจะเอามันไว้ใช้งานทำอะไรนะคะ ก็คือบอก บอกตัวคนเขียนเอง จะได้รู้ อ๋อ ตัวส่วนนี้เราสร้างขึ้นมาเพื่อทำเป็นฟังก์ชันนะ ทำเป็นอะไรนะ อย่างนี้นะคะ ทีนี้มาดูตรงส่วนที่เป็นฟังก์ชันนะคะ ถ้าใช้ฟังก์ชัน เขียนฟังก์ชันเฉย ๆ จะประกอบด้วยคำว่า "def" ก็คือ definition ก็คือการประกาศนั่นเองนะคะ การประกาศใช้ฟังก์ชัน แล้วตรงคำว่า "load_spriteหรือชื่อของฟังก์ชันที่เราสร้างขึ้น เรากำหนดเอง ตรงนี้นะคะ ตรงที่บอกว่าโหลด sprite นะคะ ส่วนในวงเล็บ นั่นก็คือไปเรียกใช้ Libary name prefic x = อะไรนี่ นั่นก็คือเราไปเรียกใช้งาน Library Liarby ใน pygame นะคะ ไปเรียกมันก็คือไปเรียกฟังก์ชันที่เขาสร้างไว้น่ะ มาใช้งานนะคะ แล้วส่วนต่อมา อันที่ 2 นี่ image ตัวที่ 2 ต่อจาก def ตัวแปรชื่อ "image" สำหรับไว้ทำอะไรนะคะ มีคอมเมนต์อธิบายไว้ Declear the imgaes ก็คือการประกาศตัวแปรนี่เพื่อเก็บรูปเห็นไหมคะ ก็คือ รูป image = เครื่องหมาย อะไรนะ วงเล็บสี่เหลี่ยมนี่ จะเรียกอะไร ภาษาไทย-ภาษาอังกฤษนี่นะคะ ก้ามปูนี่นะคะ มันจะใช้ก็คือเราประกาศเพื่อให้มันเป็นที่สำหรับเก็บรูปที่เราจะนำมานั่นเองนะคะ เสร็จแล้วเมื่อมันจะเอารูปเข้ามานี่ เราก็เลยจะต้องบอกแล้วรูปมันมีหลายรูปนะ เราก็เลยต้องมาทำ loop เพราะคำสั่ง for for ก็คือการสร้าง Loop ใช่ไหม for i in range เนื่องจากเริ่มที่ 0 เพราะอะไร ค่าเริ่มต้นนะคะ โดยปกตินี่ เวลาคอมพิวเตอร์มันนับ มันนับที่ 0 นึกออกนะ 0, 1, 2, 3 น่ะ มันนับแล้วนะคะ เพราะฉะนั้น ก็เลยต้องเริ่มที่ 0 แล้วก็ตามด้วยคำว่า "Number of image" หมายถึงจำนวนของรูปที่เราจะเอามาใช้นั่นเองนึกออกไหม นะคะ แต่ตรงนี้ยังไม่ใส่ number นะ แค่บอกให้รู้ว่าในส่วนนี้จะเป็นส่วนของรูปนะคะ แล้วก็ทำ pad ให้มันเพราะเราจะต้องไปบอกว่ารูปมันจะเอามาจากไหนใช่ไหม ต้องบอกเส้นทางนะคะ แล้วก็เลยมาเป็นการแปลงแปรงภาพต่าง ๆ เหล่านี้เป็นเงื่อนไขที่จะต้องมีนะคะ พร้อมหรือยัง เดี๋ยวพร้อมแล้วจะพาโค้ดแล้วนะคะ เริ่มที่ Comment ก่อนเลย เปิด Sublime ฟังก์ชันตัวนี้เราจะเอาไว้ก่อน ก่อน Class เพราะว่ามันจะเป็นเพื่อเรียกใช้ทุกอย่างที่อยู่ภายในได้หมดเลยนะคะ ก็เลยจะเอาไว้ก่อน class เพราะฉะนั้น ใส่ Comment ก่อน พิมพ์ Hastag ขอโทษ แล้วก็ แล้วก็ต้องพิมพ์คอมเมนต์เป็นภาษาไทยก็ได้นะคะ สร้างฟังก์ชัน... สร้างฟังก์ชัน รูปภาพ นะคะ เราจะสร้างฟังก์ชันเพื่อจะใช้สำหรับใช้นำเข้า สำหรับใช้ก็ได้ เอาภาษาธรรมดา ๆ จะได้เข้าใจ สำหรับใช้นำรูปภาพนำรูปภาพเข้ามาสำหรับใช้โหลดดีกว่านะ ทับศัพท์ไปเลยนะ รูปอยู่ว่าโหลดของเราแปลว่าอะไรนะคะ สำหรับโหลด ทับศัพท์ไปเลย มันไปเปลี่ยนภาษาไทย เดี๋ยวก่อน สำหรับโหลดรูปภาพหลาย ๆ รูปนะคะ จะได้เข้าใจง่าย ๆ อธิบายด้วยคำภาษาไทย อันดับแรก ก็คือการประกาศตัวแปร d ปุ๊บนะคะ ให้เด็ก ๆ เลือก def function เห็นไหม ทำให้เรารู้ว่าเราจะสร้างฟังก์ชัน ก็คือมาจากคำว่า "definition function นั่นเองนะคะ definish นะคะ เห็นไหมถ้าเลือกอันนี้เด็ก ๆ สังเกตเห็นใช่ไหม มันจะขึ้นส่วนต่าง ๆ ขึ้นมาให้เลยนะคะ ตรงส่วนของตัวที่มี Function รี่ มันก็คือส่วนที่เราจะกำหนดชื่อตัวแปรให้ฟังก์ชัน ของฟังก์ชันนะคะ ส่วนของฟังก์ชันสีเขียว ๆ นี่ หมายถึงชื่อของมันนี่ หมายถึงชื่อ ในที่นี้เราจะใช้ชื่อว่า load_sprites นะคะ sprites ที่มาจาก sprite ชีส ภาพที่เรียง เรียงภาพเข้ามา โหลดแบบการเรียงเข้า นะคะ โหลด sprites นะเด็ก ๆ โหลด sprites sprites เราเติม s มันมีหลายตัวนะคะ เด็ก ๆ จะต้องได้ Function รูปแบบ Function แบบนี้ขึ้นมานะ มาดูในวงเล็บ ในวงเล็บนะคะ เมื่อได้ชื่อ Function แล้วนะคะ ชื่อฟังก์ชันก็คือ load_sprites เติม s นะคะ เพราะเราบอกแล้วว่าฟังก์ชันนี้เราจะใช้สร้างเพื่อการโหลดรูปภาพเข้ามา รูปภาพหลาย ๆ รูปนะคะ ว่าอย่างไร ข้างหลังเสร็จหมดหรือยัง บรรทัดแรกโอเคหรือยังคะ ใครยังไม่เสร็จ มันจะไม่พิมพ์นะ มันจะอะไร มันจะเลือกก่อนแล้วจะขึ้น ตอนนี้ส่วนที่เราจะพิมพ์ตอนนี้ส่วนที่เราจะพิมพ์ต่อไปนะคะ ก็คือส่วนที่อยู่ในวงเล็บนะคะ ก็คือจะกำหนด พิมพ์ image นะคะ image พอ i-m ปุ๊บ สังเกต พิมพ์แค่ i-m ก็ได้ แล้วEnter แล้วก็ตามด้วยเครื่องหมายอันเดอร์สกอร์ name n-a-m-a-n-prefix นะคะ แล้วก็ใส่ comma สังเกตว่าในวงเล็บนี่ส่วนที่เราพิมพ์มันเป็นสีส้มนี่ มันหมายถึงเป็นฟังก์ชันหรือคลาสที่ pygame มันสร้างไว้แล้วนะคะ แล้วเราไปเรียกใช้งานนะคะ image_name_prefix อีกตัวหนึ่ง วรรค ต้องวรรคนะคะ พอใส่คอมม่าแล้วต้องวรรคนะคะ ต้องเคาะด้วยแล้วก็ตามด้วย image อีก เลือกค่ะ เห็นไหม พอพิมพ์ i แล้ว มันไปที่ image้ลย_ อีก ยาวอยู่โค้ดนี้ บอกเลยว่ายาว ตั้งใจนะครับทุกคน โอเค นะคะ image พิมพ์ไปแล้วไม่เป็นไร พิมพ์ เลื่อนมาข้างหน้านะคะ number_of นี่คือเราบอกฟังก์ชันนี้ว่าถ้าจะโหลดรูปมานะคะ ก็คือมันจะไปโหลด image_name_prefix ก็คือไปโหลดชื่อ ไปโหลด number of image ต้องมีการบอกชื่อนะคะ ต้องบอกชื่อ บอกจำนวนของรูปนะคะ บอกอะไรอีก เราจะให้มันบอก size size ก็คือขนาด z-e นะคะ size_x นั่นหมายถึงบอก size ก็คือตำแหน่งของขนาดรูปน่ะค่ะ รูปในแกน x นึกออกนะ size_x โดยกำหนดค่าเริ่มต้น = 0 แล้วก็ใส่ Comma นะคะ มี size_x ก็ต้องมี size_y นึกออกนะ _ ด้วยนะคะ y = 0 เหมือนกัน ก็คือบอกค่าเริ่มต้นให้เริ่มที่ตำแหน่ง x 0 y 0 นั่นเองนะคะ ขนาดก็เริ่มที่ 0,0 บรรทัดต่อมานะคะ เด็ก ๆ จะเห็นตรงส่วนของ ไหนล่ะ ส่วนของ pass นึกออกนะ เรา Delete คำว่า "tuch" ออก ไม่เคลื่อนนะ ตำแหน่งตรงอยู่ให้ตรงนะคะ นึกออกนะ ตำแหน่งจะอยู่ตรงตำแหน่งนี้มันเป็น Tempate เราจะประกาศตัวแปร image นะคะ Enter เลยนะคะ เท่ากับเครื่องหมายสี่เหลี่ยมก้ามปูนะคะ ก็คือตรงนี้เวลาบอกแล้ว Comment น่ะ จะใส่ไว้ข้างบนก็ได้ ไว้ข้างในคือเหมือนเรามีตัวแปรนี่ บางทีอาจจะต้องบอกตัวคนเขียนเอง นึกออกไหม ว่ามันไว้ใช้ทำอะไร ก็จะใส่คอมเมนต์เพิ่มอีกสักครั้งหนึ่งนะคะ บอกว่า ประกาศตัวแปรเพื่อเก็บ เพื่อใช้สัมผัส เก็บรูปภาพนั่นเอง เพราะอะไร เพราะบอกไว้ว่าไอ้ตัวนี้มันจะเป็นแบบลักษณะของ เป็นแบบมันก็จะเป็นแบบที่เป็นปีกกานี่จะเป็นลักษณะ list หรือ tuple ของรูปจะอยู่แนวนี้จังหวะนี้ คือ บอกลักษณะนี้นะคะ ตรงส่วนของการประกาศฟังก์ชันเสร็จแล้ว ต่อมานะคะ เราจะมาสร้าง loop นะคะ วิธีการก็คือให้เด็ก ๆ กด Enter ไป 2 ครั้งเราจะเริ่มที่บรรทัดที่ 2 เราจะไม่พิมพ์ติดบรรทัดที่ 1 นึกออกนะ ให้เห็นว่าเสร็จส่วนของฟังก์ชันไปแล้ว เรามาทำ loop ในฟังก์ชันนี้ loop ที่เราใช้ชื่อว่า for เปลี่ยน เห็นไหมคะ พอขึ้น f ปุ๊บ ให้เลือก for loop คลิกอย่างนี้เลย โอเคไหมเด็ก ๆ จะต้องได้โครงสร้างของ loop for แบบนี้ขึ้นมานะคะ ใครไม่ขึ้นยกมือ ดู ใครถึงตรงนี้หรือยัง แฝดทันไหม ดูวิธีการใส่ for loop ดี ๆ นะคะ พอเราพิมพ์ f ด้วยตัว... พอเห็นคำว่า for ที่มี for loop น่ะ ให้เลือกใช้มันเลยนะคะ พอคลิก 1 ครั้ง โครงสร้างของ for loop มันจะขึ้นมาแบบนี้ for ตัวแปรที่เราจะตั้งชื่อ ก็คือเราใช้ for นี้ก็คือใช้ว่า for_i นะคะ ไม่ใช้ x เราจะใช้ตัวแปร for i เฉย ๆ นะคะ ตรงนี้ range ใช้ range เฉย ๆ in นะคะ in range r-a-n-g-e r-a-n-g-e นะคะ ค่าเริ่มต้นของ i เราจะเริ่มที่ 0 บอกแล้วว่าจะเริ่มที่ 0 นะคะ เวลาให้มันนับให้มันเริ่มที่ 0 ถ้าไม่เริ่ม 0 เริ่ม 1 ก็ได้นะ แต่จะเริ่มที่ 0 นี่ จะให้ดูว่าเริ่มที่ 0 หมายถึงอย่างไร แล้วก็ตรงนี้ number_of_image หมายถึงภาพของภาพนั่นเอง หมายเลขของภาพน่ะ ก็คือสมมติรูปนี้เรามี 10 รูป นึกออกไหม อย่างนี้ เพราะฉะนั้น ไอ้รูปอุปสรรคเราให้ใส่กี่รูปลูก เพราะฉะนั้น เราก็ใส่เป็น 4 นะคะ เอ้ย ไม่ใช่ 4 สมมติว่ายังไม่รู้ ใช้แบบกลาง ๆ ถ้าเอาแบบยังไม่รู้นะคะ เราก็ใส่ จำได้นะ เราประกาศไอ้ตัว number_of_image มาแล้ว แล้วพอขึ้น number_of_image คลิกเพื่อเลือกเพราะเรา นี่ ๆ ตรงฟังก์ชันนี้มันมีแล้วใช่ไหม เห็นไหม ไม่ต้องไปพิมพ์ใหม่ เพราะถ้าพิมพ์ใหม่บางคนพิมพ์ผิดใช่ไหมคะ เรียกใช้สิ่งที่อยู่ในฟังก์ชันที่เราสร้างนี่ ถ้าอันไหนที่มันสร้างไปแล้ว มันจะมีขึ้นมา แค่พิมพ์ nu นี่แล้วเราก็ไปเลือก number_of_image ได้เลย พอตรง path นะ ตรง path เราทำอย่างไรคะ ลบออกใช่ไหม บอกแล้วลบออก ตรงนี้เราจะประกาศตัวแปรนะคะ ชื่อว่า path ประกาศตัวแปรหน่อย t-h pad วรรค แล้วก็ตามด้วยเครื่องหมาย = เราจะเรียกตัวนี้มานะคะ ฟังก์ชันนี้ พิมพ์ i ปุ๊บ แล้วเลือก ไม่ขึ้น im แล้วเลือก image_nameprefix นี่มาใช้ เห็นไหมคะ ตามด้วยเครื่องหมายบวก เครื่องหมาย + ลูก วรรค เครื่องหมายบวก แล้วก็วรรค str str มาจาก String นะคะ สังเกตถ้าเป็นฟ้า ๆ อย่างนี้ มันจะเป็นฟังก์ชัน ฟังก์ชันที่เขาสร้างไว้แล้ว ชื่อ str นะคะ string ในวงเล็บ ใส่วงเล็บเข้าไป เครื่องหมายวงเล็บหายไปไหน เดี๋ยว ๆ นะคะ ข้างในวงเล็บเราจะใส่อะไรลงไป ใส่ i ตัวนี้ i นี่ เริ่มต้นที่ i ก็คือเลือก i แรกนะคะ i ตัวที่ 1 แล้วก็ตามด้วยวรรค เครืองหมายบวกนะคะ แล้วก็ตามด้วยเครื่องหมายคำพูด Single quote หรือ Double quote ก็ได้ .png คือบอกให้รู้ว่าไอ้นี่มันเป็นชื่อของรูป เห็นไหมคะ ที่มีลักษณะเป็นข้อความนะคะ แล้วก็จะต้องลงท้ายด้วยนามสกุล .png นะคะ กด Enter ค่ะ อันนี้เงื่อนไขของ path ได้แล้วนะคะ ต่อไปจะเป็นเงื่อนไขของรูปที่จะเอามาใช้ เราเลือก image นะคะ = py ปุ๊บ เลือก pygame พิมพ์ p-y แล้วให้คลิกเลือก pygame นะคะ .image im . อะไร .load ค่ะ .load นะคะ แล้วก็ใส่เครื่องหมายวงเล็บ คือ โดยปกติถ้าเรียก image_pygame.load นี่ มันจะต้องฃตามด้วยชื่อใช่ไหม แต่ทีนี้ เห็นไหมคะ มันเป็น loop น่ะ มันก็จะวนไปเรียก เรียกตามอะไร ตาม path ที่สร้างไว้เห็นไหม ในวงเล็บนี้ เราใส่คำว่า path เข้าไปแทน ให้เลือกคำว่า "path" ที่เราสร้าง ตัวแปรที่เราสร้าง เห็นไหม ทันไหมคะ เด็ก ๆ ทันไหม ทันอยู่นะคะ ตั้งใจดูนะคะ จะไปช้า ๆ ไม่รีบ ๆ เสร็จแล้วพอเหมือนมันมีค่าน่ะค่ะคือ ตอนโหลดน่ะนึกออกนะ การโหลดมาน่ะ ตรง path เสร็จแล้วพอมาเป็น image น่ะค่ะ ให้มันแปลงค่า ก็เลยใส่ . นะคะ .convert convert นะคะ convert c-o-n-v-e-r-t convert ตามด้วยเครื่องหมาย Underscore alpha a-l-p-h-a นะคะ แล้วก็วงเล็บเปิดวงเล็บปิดนะคะ จบ ก็คือเมื่อไปโหลดภาพนี้ตาม path นี่ ให้โหลดด้วย แปลงมันด้วยนะคะ ทีนี้พอได้ loop แล้ว ให้มากำหนดเงื่อนไขภายใน loop ให้มันก่อนนะคะ ใช้ if ค่ะ เด็ก ๆ สังเกตนะ ใช้วิธีการพอกด Enter น่ะ ตัวโปรแกรมมันจะจัดย่อหน้าให้ใช่ไหม เราพิมพ์ i-f เลือก if condition if condition ที่มีคำว่า "if condition" ข้างหลังอย่างนี้ ตอนนี้เราจะกำหนดเงื่อนไขนะคะ เงื่อนไขนี้เราจะบอกไว้ว่าถ้า ถ้าขนาด ก็คือเราจะไปเรียกใช้ตัวนี้แล้วนะคะ ตัว size_x, size_y ที่เราสร้าง พิมพ์ s ปุ๊บ s-i ปุ๊บ ให้เลือก size_x เห็นไหมคะ ให้มีค่ามากกว่าหรือน้อยกว่าใชไหม 0 นะคะ และ and นะคะ and เลือกจากที่มันขึ้นอย่างนี้นะคะ and นี่คลิกเลือก เป็นคำสั่งที่สร้างแล้วสังเกตสีด้วย ถ้าเป็นคำสั่ง และ si เหมือนเดิม si แล้วเลือกเป็น size_y แทน ใส่เครื่องหมายน้อยกว่า 0 เหมือนกัน มากกว่า 0 น้อยกว่า 0 ใส่เข้าไป โอเคนะคะ บอกเงื่อนไขแล้วนะคะ ว่ามันจะทำงานถ้าขนาดรูปน่ะ นึกออกนะ ตำแหน่งของรูป ขนาดของรูปมันมากกว่า 0 ใช่ไหม เราจะให้ตัวแปร image นะคะ i-m-a-g-e เท่ากับวรรค วรรคก่อน แล้วกดเครื่องหมายเท่ากับ แล้วก็วรรค ตามด้วย p ปุ๊บเลือก pygame นะคะ = pygame . ค่ะ ใส่ . พิมพ์ tr ก่อน ไม่ขึ้น trans transform น่ะ เราจะให้มันแปลงภาพให้ ปรับขนาดภาพ a-n-s-f-o-r-m transform นะคะ เลือก scale ไม่ใช่เลือกสิ พิมพ์ scale ไหม s-c-a-l-e เห็นไหมคะ นะคะ scale แล้วก็ใส่วงเล็บ ในที่นี้ก็คือบอกว่าไฟล์ภาพ ก็คือ image ที่เราสร้างนั่นเอง ก็คือตัวนี้ที่เราไปโหลดมานี่ก็คือตัวนี้มันจะไปเรียกใช้ตัวนี้ image นะคะ แล้วก็ใส่ , ถูกแล้ว comma วรรค แล้วตามด้วยวงเล็บอีก 1 ครั้ง ดูดี ๆ นะคะ อันนี้ ตรง scale นี่มีวงเล็บซ้อนวงเล็บนะเด็ก ๆ ดูดี ๆ สังเกตว่าเมื่อเรามีวงเล็บเปิดเราก็ต้องมีวงเล็บจะต้องครบนะคะ ไม่ใช่เปิดมา 3 อัน พอใส่วงเล็บอันนี้ไอ้นี่หายไม่ใช่นะคะ มันจะผิดมีวงเล็บซ้อนนะคะ ในวงเล็บซ้อนเราใส่อะไร ใส่ size_x ใส่ size_x แล้วก็ใส่ size_y ค่ะ ล้นแล้ว เดี๋ยวลดขนาดลงโอเคเห็นนะ ยังเห็นอยู่ใช่ไหม ดูดี ๆ นะคะ ส่วนใหญ่ ถ้าจะผิด ตรงนี้ล่ะ เมื่อมีวงเล็บซ้อนน่ะ บางทีเด็ก ๆ ไปเผลอลบวงเล็บออกอันหนึ่งน่ะ วงเล็บปิดน่ะ เพราะฉะนั้น สังเกตถ้าเรามีวงเล็บ 2 วงเล็บนี่ เราต้องนับนะคะ มีเปิดก็ต้องมีปิด ถ้าวงเล็บข้างหน้ามี 3 เหมือนสมมติเรามีเพิ่มมาอีกอันหนึ่งนะคะ ถ้าเรามีวงเล็บเพิ่มมาอีกอันหนึ่งอย่างนี้ เด็ก ๆ ก็ต้องมีนะคะ ไม่ใช่ว่าเปิดแล้วปิดไม่ครบนะคะ อันนี้ทำตัวอย่างให้ดูไม่ต้องพิมพ์นะ ตรงส่วนนี้นะคะ ก็คือพอมันไปโหลดรูปเข้ามาปุ๊บนี่ให้มันจัดการกับขนาดรูปภาพน่ะค่ะ ถ้ามันใหญ่มากนะคะ เพราะบางคนยังไม่แปลงรูปนะ อธิบายเลยนะคะ คำสั่ง pygame.transform.scale นี่เป็นคำสั่งสำหรับแปลงภาพที่เราจะโหลดน่ะค่ะ ก็คือให้ลดขนาด ตัว size_x, size_y นี่ ถ้าโดยปกติแบบโหลดเข้ามารูปเดียวแล้วโหลดให้มันลดขนาดนี่ ก็คือบอกขนาดว่าตรงแกนนี้เท่าไร ตรงแกนนี้เท่าไรน่ะค่ะ รูปมันก็จะได้ขนาดตามที่เรากำหนดนะคะ เมื่อได้ส่วนของตัวนี้แล้วนะคะ เดี๋ยวเราจะปิดเงื่อนไขแล้วนะคะ Enter ลงไป แล้วคลิก back space ย้อนหลังไป 1 tap คลิกเครื่องหมาย backspace นะคะ ไม่ใช่กด นี่ จะปิดแล้วนะคะ เราจะปิดเงื่อนไขแล้ว เพราะฉะนั้น ตำแหน่งมันจะตรงกับ if พอดีเห็นไหม im image ค่ะ เลือก image .append append นี่เลย append แล้วใส่วงเล็บ image ใช่ไหมคะ i-m ค่ะ สิ่งที่เราต้องการ คือ image นะคะ เมื่อ... ดูนะคะ มีปิดของ if for for เป็น loop ก็ต้องมีปิดของ for ด้วยเหมือนกัน Enter ลงไป แล้วกด back space เห็นไหมมันจะไปปิดของ for แล้ว ตำแหน่งที่ปิดมันจะตรงกับ for พอดี พิมพ์ return ค่ะ เมื่อหมดออกจาก loop นี่ต้องให้มัน return 8คให้มันคืนค่า เพราะฉะนั้น ต้องใช้คำว่า นะคะ return อะไร return ค่าให้อะไร ให้ image ค่ะ นะคะ ให้ image ของเรา เพื่อให้เห็นเป็นส่วน ๆ ชัด ตรง if แม่ก็จะเว้นนะ จะได้รู้ว่า อ๋อ ตรงนี้เป็นของส่วนนี้ จะดูง่ายกว่า นี่เห็นไหม loop มันจะมาสิ้นสุดเมื่อมาเจอคำว่า "return" เงื่อนไขก็จะมาจนกว่าจะเจอส่วนปิดที่ตรงกับเขาน่ะ ใน if เงื่อนไขก็จะสิ้นสุดตรงนี้นะคะ มันก็จะวนกลับไป กลับไปเอารูปมาแล้วทำซ้ำ ๆ นี่คือส่วนของ อะไรล่ะ ส่วนของการสร้างฟังก์ชันนะคะ สำหรับ สำหรับทำอะไร สำหรับใช้โหลดรูปภาพหลาย ๆ รูปนะคะ ก็คือพอสั่งปุ๊บนี่ มันจะเข้าไปเช็กก่อนเลย เริ่มที่ตำแหน่งที่ 0 จำนวนเท่าไรก็แล้วแต่เริ่มแล้ว path ก็จะบอกเส้นทาง อยู่ตรงนี้นะคะ แล้ว image จะไปโหลดภาพนั้นมาแล้ว convert เรียบร้อยแล้วนะคะ เสร้จแล้วก็วางตำแหน่งให้มัน กำหนดขนาด ก็คือตำแหน่งหรือขนาดนี่ โดยมีเงื่อนไขว่าถ้าขนาดของรูปเป็นเท่านี้ ๆ นะคะ คือ ถ้ามันมากกว่าเห็นไหม ก็ให้ทำการปรับขนาดมันเสีย pygame_transform_scale ปรับขนาดมันสะ แล้วก็ปรับขนาดเรียบร้อย ก็แสดงภาพนั้นออกมา เมื่อถ้ามันตรวจสอบเงื่อนไข ทำถูกปุ๊บ วนลูปปุ๊บ เห็นไหมคะ มันก็จะคืนค่ากับส่งค่ากลับคืนไปเริ่มใหม่แล้วคุณก็ไปเริ่มใหม่ มันก็จะวนซ้ำไปเรื่อย ๆ เห็นไหมคะ เสร็จแล้วในส่วนของ format ถ้า run นี่มันจะไม่เห็นอะไรขึ้น เพราะเรายังไม่เริ่มนะ ไม่เชื่อกด Ctrl + B ถ้าจะเกิด Error นั่นก็คือการประกาศตัวแปรไม่สมบูรณ์ ลองกด Ctrl + B ดูก็ได้ นี่ ถ้าผ่านไม่มี error นี่ แสดงว่าผ่านอยู่นะคะ แต่ แต่รูปยังไม่มา เพราะอะไร เพราะยังไม่ได้เียบรูป แค่บอกเงื่อนไข บอกวิธีการว่าเราจะไปทำการดาวน์โหลดรูปมาใช้นี่ จะเรียกไอ้รูปนี้มาใช้มันอยู่ที่ Class ค่ะ มาดูสไลด์ต่อไป ส่วนของฟังก์ชันที่เราสร้างนี่เพื่อจะไปใช้สำหรับในการโหลดมาใช่ไหม แต่ส่วนของรูปที่จะโผล่มานะคะ จะอยู่ในส่วนที่ 2 ส่วนของ class นั่นเองเห็นไหมคะ เราจะสร้างและเคลื่อนย้าย ไม่ใช่สร้างอย่างเดียวด้วย มันต้องย้ายได้ด้วย ก็คือไอ้รูปภูเขา ไอ้หน้าที่เราเลื่อนเห็นไหม พอเวลาไอ้ตัว Dino เราวิ่ง สิ่งกีดขวางอุปสรรคของเรามันต้องเคลื่อนตามไปด้วยนะคะ Class นี่จะยาว เด็ก ๆ ตรง class นี่บอกเลยนะ ต้องใจเย็น ๆ นะ เพราะมันเยอะ โค้ดมันเยอะหน่อยนะคะ เหมือนเดิม ก็คือพอเวลาเราจะสร้าง Class ใหม่ เราก็ต้องใส่คอมเมนต์เพื่อจะบอกว่า class นี่เอาไว้ทำอะไรใช่ไหมคะ ซึ่งในตัวนี้นะคะ optacle ของเราในเก็คือแม่จะใช้ก้อนหิน ของเด็ก ๆ อุปสรรค สิ่งกีดขวางของเด็ก ๆ เป็นอะไร เด็ก ๆ ็ก็ไม่ต้องใช้ Rock เหมือนกันนึกออกนะ มันจะตามตัวไอ้สิ่งกีดขวางที่เราจะเอามาใช้น่ะ เพราะบางคนเป็นอะไรนะ ของมุกเอาอะไรเป็นสิ่งกีดขวางลูก ถ้านึกไม่ออก เหมือนที่บอกนะ ใช้คำว่า obs ใช่ไหมคะ ที่มาจาก Obstacle ก็ได้ แต่อันนี้เหมือนแม่รู้แล้ว แม่จะใช้ก้อนหินเป็นตัวสิ่งกีดขวางหรืออุปสรรค แม่ก็เลยตั้งชื่อ class ว่า rock เสียเลย แต่ทีนี้ชื่อนี้เด็ก ๆ ไม่ใช่ rock ก็ได้นะคะ ให้นึกถึงสิ่งกีดขวางของตัวเอง นึกออกนะ บางคนเป็นของขวัญนึกออกนะ ก็ให้ตั้งชื่อนั้นก็ได้ แต่อย่าลืมนะคะ กฏของการตั้งชื่อ Class ก็คือตัวแปรนี่ ไม่ใช่ตัวแปร ชื่อของ class นี่ ตัวแรก ตัวอักษรตัวแรกจะต้องเป็นตัวพิมพ์ใหญ่เสมอ สังเกตว่าเห็นไหม ชื่อ Class กับชื่อ Function นี่ใช้ตัวเล็กได้ กับชื่อฟังก์ชัน ฟังก์ชันนี่ ใช้ตัวเล็กได้ เห็นไหม แต่ชื่อ class นี่ห้าม ต้องมีตัวใหญ่ที่ตัวแรก หรือใหญ่ทั้งหมดเลยก็ได้นะคะ โอเคเรามาเริ่มกัน พร้อมจะโค้ดไหม เพราะบอกเลยว่าเฉพาะ class นี่ดูนะคะ ส่วนแรก class name นะคะ ก็คือระบุชื่อของ Class ที่เราจะไว้ใช้งานนี่นะคะ แล้วใน Class นั้นประกิอบฟังก์ชัน มี function init บอกแล้ว init ก็คือฟังก์ชันสำหรับกำหนดค่าต่าง ๆ เบื้องต้นนั่นเองนะคะ ต่อมาฟังก์ชัน get rock ก็คือ ฟังก์ชันสำหรับเอารูปน่ะค่ะ เอารูปมาใช้น่ะ แล้วต่อมาเป็นฟังก์ชันที่ชื่อว่า "update.speed คือ ความจริงมันจะเหมือน background น่ะ ภาพมันไม่ได้เคลื่อน หลอกว่าภาพมันเคลื่อน นึกออกนะ มันก็เลยต้องมีความเร็วของการเคลื่อนที่ของภาพเข้าไปด้วยนะคะ พอมันมีการเคลื่อนเข้าไปนี่ มันก็ต้องอัปเดตมันตลอดนะคะ เสร็จแล้ว ส่วนของฟังก์ชัน draw ก็คือแสดงไอ้ตัวอุปสรรคน่ะ หรือสิ่งกีดขวางขึ้นมานะคะ และฟังก์ชันสุดท้าย ฟังก์ชัน update ในที่นี้ คือ อัปเดตทั้งหมด อัปเดตแต่ละส่วนน่ะ อันนี้จะมีเงื่อนไขเยอะสุดนะคะ ไม่รู้จะถึง update ไหมนะคะ ค่อย ๆ ไปนะคะ เพราะฉะนั้น โค้ดตรงนี้จะค่อนข้างเยอะนะคะ เพราะฉะนั้น ใจเย็น ๆ พร้อมแล้วเริ่มเลยนะคะ เริ่ม Codding กันเลย ไปที่ sublime กลับไปที่ Sublime ตอนนี้เราสร้างฟังก์ชันเสร็จแล้ว ส่วนต่อมาเราจะสร้าง class นะคะ กด Enter จาก return_image เราเสร็จไปแล้ว ตอนนี้เราจะสร้าง Class กด Enter ลงไป 2 ครั้งนะคะ แล้วก็กด Backspace กลับคืนให้มันกลับไปชิด เพราะมันเป็น... เราจะใส่คอมเมนต์ก่อน สร้าง Class สิ่งกีดขวางหรืออุปสรรค เอาสิ่งกีดขวางเลยแล้วกัน ไม่วงเล็บอุปสรรคแล้วนะ ในที่นี้ก็คือก้อนหิน Rock นะคะ ก็คือตัวสิ่งกีดขวางของแม่มันคือ rock น่ะ หรือก้อนหินน่ะ แม่ก็เลยใช้ชื่อนี้นะคะ เพราะฉะนั้น พอเวลาสร้างปุ๊บนะคะ พิมพ์ class ปุ๊บนี่ ให้เด็ก ๆ คลิกที่ Class new class เห็นไหม มันจะสร้างอย่างนี้ขึ้นมาให้ต้องคลิกอย่างนี้นะคะ ดูใหม่นะ พิมพ์ c-l ปุ๊บนี่ เลือก class new class นะคะ ให้มันขึ้น Template ของ class ขึ้นมาแบบนี้นะคะ ในส่วนของ class name นะคะ ชื่อ Class นะคะ ตรงส่วนนี้นะคะ ตรงส่วน class name นี่ ให้เด็ก ๆ นึกถึงสิ่งกีดขวางของตัวเอง เช่น ถ้าใครใช้ก้อนหิน อาจจะใช้คำว่า "Rock" ภาษาอังกฤษนะ ก้อนหิน Rock ก็แปลว่าก้อนหินก็ได้ หรือ stone ก็ได้ ถ้าบอกแล้วถ้าใครนึกชื่อภาษาอังกฤษไม่ออก ใช้ Google แปลช่วยนะคะ ถ้าของใครเป็นขอนไม้ ถ้าของใครเป็นขอนไม้ ก็ใช้ขอนไม้ภาษาไทยแล้วให้ Google มัน ก็ไปก๊อป (ปี้)มา อันนั้นคือชื่อ Class ของเรา จะได้รู้ว่าสิ่งกีดขวางตัวนี้มันหมายถึงอะไรนะคะ ในที่นี้สิ่งกีดขวาง ก็คือ ก้อนหิน อันนี้เราระบุไปเพื่อจะได้รู้นะ หรือว่า rock นั่นเอง ตรงส่วนนี้ค่ะ ของเด็ก ๆ ชื่อมันก็จะเปลี่ยนไปตามชื่อสิ่งกีดขวางเรานะ เพราะฉะนั้น Class name บอกแล้วให้สังเกตที่ เห็นไหมคะ ตรงชื่อแรกนี่ ต้องเป็นตัวพิมพ์ใหญ่เสมอนะคะ class name แม่จะใช้คำว่า "Rock" เด็ก ๆ ใช้ชื่ออะไรเด็ก ๆ ก็เปลี่ยนนะคะ ใน object เราไม่ใส่ มันจะเอาไปสร้างไว้ข้างใน เราลบออกนะคะ บรรทัดนี้มันอธิบายเฉย ๆ มันลบออกได้นะคะ เห็นไหมคะ definition _init นี่ขึ้นมาเลย เป็นส่วนของการกำหนดค่าเบื้องต้นใน class นะคะ Class name ของเราอันนี้ก็คืออะไรคะ rock เห็นไหมคะเลือกเลย เดี๋ยวแป๊บ ขอถ่ายโค้ดบอกแล้วโค้ดมันเยอะ เพื่อให้เห็นบอกแล้วนะคะ เพื่อเราต้องการให้เห็นชัดเจน เราก็จะเว้นสัก 1 บรรทัดตรงฟังก์ชัน init นี่แยกสัดส่วนให้ชัดเจน โอเค นะคะ ตรงส่วน super นะคะ กำหนดค่าตรงนี้เราจะลบออกนะคะ เด็ก ๆ ดูดี ๆ นะคะ ตรงโครงสร้างมันต้องไม่เคลื่อนไปกว่านี้นะ ดูตำแหน่งดี ๆ ด้วยนะ self ที่ 1 นะคะ ตรงตัวนี้นะคะ self ตัวแรกนะคะ ตรงนี้เราจะใส่ตัวแปนชื่อว่า speed จะบอกว่าใส่ชื่อตัวแปร มันน่าจะเป็นใส่ฟังก์ชันนี่ล่ะ ชื่อ speed นะคะ กำหนดให้ความเร็วมันน่าจะเริ่มที่ 5 เราจะกำหนดค่าให้ speed เท่ากับ 5 นะคะ ตรงตัวที่ 2 นะคะ เราจะสร้างตัวแปร rock ค่ะ rock_image ก็คือตัวแปรนี้ก็คือตัวแปรของไอ้รูปก้อนหินเรานี่เองนะคะ บอกให้รู้ว่าตรงนี้มันจะเป็นรูปก้อนหินนะคะ แล้วจะเท่ากับอะไร arg นี่มาจากคำว่า argument นะคะ argument ก็คือส่วนของ event หรือเงื่อนไขต่าง ๆ นี่ เพื่ออธิบายส่วนนี้นะคะ ในที่นี้ ก็คือเราจะไปเรียกใช้ตัวนี้มานะคะ load_sprites เลือก load_sprites เลย จะได้ไม่ผิด ใส่วงเล็บด้วยนะคะ ใส่วงเล็บเข้าไปพอใส่วงเล็บบอกให้รู้ว่าเป็นฟังก์ชัน ฟังก์ชัน load_sprites นะคะ ใส่เครื่องหมายคำพูดค่ะ ในวงเล็บเข้าไปในวงเล็บนะคะ ก็คือเราจะให้มันไปโหลดรูปอะไร รูปก้อนหินของเรานั่นเอง rock ตามด้วยเครื่องหมาย Underscore คือ เนื่องจากรูปมันมีหลายรูปนึกออกนะ ใส่ Underscore ไว้เว้นแต่ไม่ใส่ตัวเลข เพราะอะไร เพราะการใช้ฟังก์ชัน load_sprites มันจะไปวนลูปเพื่อดึงรูปที่ 0, 1, 2, 3 มาใช้นึกออกไหมลูกนะคะ หลังเครื่องหมายคำพูด ที่เรียกโหลดชื่อรูปนะคะ ใส่ , 1 ครั้ง แล้วก็กดวรรค ตรงนี้นะคะ เด็ก ๆ ดูดี ๆ นะคะ ตำแหน่งใน loadไอ้ส่วนที่อยู่ในวงเล็บมันมาจากไหน เห็นไหมคะ image_name_perfix ก็คือ image name เห็นไหม แล้วก็ตามด้วย pefix อะไรก็แล้วแต่เห็นไหม อันนี้คือ image name มันมี 3 เห็นไหม 3, 4, 5 เอ้ย 1, 2, 3, 4 เพราะฉะนั้น number ก็คือจำนวนของเราคือเท่าไรคะ รูปเรามีกี่รูป 4 เพราะฉะนั้น ก็คือหมายเลข 4 เข้าใจนะ , ตัวที่ 2 ค่าของตัวที่ 2 คือ size_x = 0 ในที่นี้ ก็คือตำแหน่งที่เราจะเอา... เรื่องมันยาวนี่ น้ำท่าจะหมดขวด ก็ถึงบอกไง เล่นเกมไงเห็นไหม เห็นง่าย ๆ สนุก ๆ น่ะ คนเขียนโค้ดมันไม่ได้เขียนเสร็จบรรทัดเดียวนะ เข้าใจหรือยัง เพราะฉะนั้น เขาอยากได้เงินก็ต้องแบ่งให้เขา เข้าใจไหม เห็นไหมลูก ใช่ไหมล่ะ เห็นไหมล่ะ เกม 1 เกม กว่าจะทำได้ เขียนโปรแกรมไม่รู้ตั้งกี่บรรทัดนะ นะคะ ดีเทลมันเยอะอยู่นะทำเกมน่ะ ค่าตัวที่ 2 ให้นึกถึงนะ บอกแล้วว่าเวลาใน 1 หน้าจอนี่ ตำแหน่งของรูปที่เราจะไปวางน่ะค่ะ size size เช่น สมมติ สมมติก้อนหินเราจะวางที่ตำแหน่งนี้ นึกออกนะ เช่น สมมติกะไป 300 อยู่ที่ตำแหน่ง 300 อย่างนี้นะ แล้วก็บรรทัดที่ 500 นึกออกไหม นั่นคือ size_x, size_y เพราะฉะนั้น ค่าตรงนี้ size x นะคะ ก้อนหินที่เราจะเอาไปวาง ถ้าใครจะได้หนก่อนตัวเองพากันวางไว้ตรงไหนล่ะ นึกไม่ออกให้ดูตำแหน่งของอะไรนะ ตำแหน่งของน้องไดโนเสาร์ใช่ไหม น้องไดโนเสาร์ เราเอาน้องวางที่ไหน ดูที่ค่าเริ่มต้นของน้องไดโนเสาร์สิ อยู่ไหน dino เดี๋ยวนะแป๊บหนึ่ง คือมันจะไม่เกินอะไรลูก คือมันจะไม่เกินไอ้ตัว... นี่ ทำไมล่ะนี่ แป๊บหนึ่งนะคะ นี่ ๆ ๆ เห็นไหม ไดโนเสาร์มันเริ่มที่... สมมติจากหน้าจอเรานี่นะคะ ว่า 600 500 อะไรก็แล้วแต่ Dino เริ่มวางที่ตำแหน่งที่ 10 ก็จะประมาณนี้ 10 แล้วก็บรรทัดที่ 380 อยู่ตรงนี้ชิดขอบพื้นดินพอดี dino ก็จะอยู่ตรงนี้ เพราะฉะนั้น ก้อนหินอยู่ตรงกับ dino พอดีไหม ไม่ควร เราควรให้มันวิ่งไปสักเท่าไรดี มันน่าจะอยู่ประมาณตรงนี้ บวกเข้าไปอีก เพราะฉะนั้น ไม่อยู่ที่ตำแหน่งที่ 10 แล้ว แน่นอนล่ะ เพิ่มอีกสัก ดูอะไรเป็นหลักด้วย อย่าลืมนะคะ ก็คือดูพื้นที่หน้าจอของเราด้วยใช่ไหม screen_width เรา 800 มันก็ต้องไม่เกิน 800 ล่ะ screen high ไม่เกิน 510 มันต้อง510 ล่ะนะคะ เพราะฉะนั้น แนวของก้อนหินกับแนวเท้าของไดโนเสาร์นี่เท่ากันแน่นอน ของแม่เท่าไรนะ เดี๋ยว ๆ ๆ ตัว dino อยู่ที่ 380 นี่ เพราะฉะนั้น size y แม่นี่จะอยู่ที่ประมาณ 380 แล้วล่ะ จำนวนบรรทัดอยู่ที่ 380 แต่ size_x มันต้องมากกว่า 10 อยู่แล้วนะคะ แม่จะบวกเพิ่มไปอีก 500 เพราะฉะนั้นเป็น 510 กับ380 เห็นไหมคะ ค่ามันจะเท่ากับจำนวนตรงนี้เลย 1, 2, 3, 4 เห็นไหม ฟังก์ชันนี้ เห็นไหม ในฟังก์ชัน load_sprites สิ่งที่อยู่ใน load ตรงกับที่เราใส่เข้าไป นะคะ แต่ต้องดูตามหน้าจอนะ เพราะบางคนตั้งค่าไม่เท่ากันใช่หรือเปล่า เราก็ไปดูที่ตัวเกมเราน่ะ ที่วางไว้ตัวแรกเป็นหลักนะ เราจะรู้เลยว่าตรงบรรทัดนี่มันก็น่าจะวางระดับเดียวกับตัวการ์ตูนเราใช่หรือเปล่า แต่ตรงตำแหน่งแกน x น่ะ แกน x มันจะอยู่ตรงกันพอดีไม่ได้ นะคะ มาดูส่วนต่อไป เพิ่งได้แค่บรรทัดเดียวเอง บรรทัดต่อมานะคะ เราจะต้องบอกต่ออีก มันยังไม่เสร็จ เพราะมันไม่ได้มีแค่รูปเดียวใช่ไหมคะ เราไม่ได้โหลดมาแค่รูปเดียวนะ หลักการ คือ มันจะให้มีรูปเพื่อมาสลับน่ะค่ะ ให้มันเหมือนรูปมันเคลื่อนที่น่ะ รูปมันเคลื่อนไหว แต่ความจริงรูปมันไม่ได้เคลื่อนไหวนะคะ เพราะฉะนั้น เราก็จะเพิ่ม self self ขึ้นมาอีก 1 บรรทัด ไม่อยากให้เด็ก ๆ พิมพ์ผิด ให้เด็ก ๆ copy นะคะ ก๊อปปี้ส่วนนี้ self.rock.image เพราะเราจะใช้เหมือนกันเพียงแต่จะตัวเลขเพิ่มมา กด Ctrl + C แล้วก็กด Crtl + V เพื่อวาง ใส่เครื่องหมาย Underscore ก็คือ 0 เดี๋ยวนะคะ เราจะพิมพ์บรรทัดนี้ได้บรรทัดเดียวเราก็ก๊อบปี้ได้ เราจะมี self.rock image 0 แล้วก็ตามด้วย self นะคะ self แล้วตามด้วย .r-e r-e-c-t นะคะ .rect_ เหมือนกันก็คือ 0 วรรค 1 ครั้ง แล้วกดเครื่องหมายเท่ากับ ตอนนี้นะคะ ตอนนี้บอกว่าไปโหลดภาพนี่ แล้วทีนี้มันจะต้องเหมือนให้มันทำการจัดการกับภาพนี้นะคะ คือ บอกแล้วว่ามันต้องมีอย่างน้อย 2 ภาพเพื่อสลับน่ะ เหมือนก้อนหินมันเคลื่อน นะคะ เพราะฉะนั้น self.rock_image_0 นี่ หมายถึงไอ้ก้อนหินภาพที่ 1 นี่ เท่ากับ = อะไร พิมพ์ self คลิกเลือก self นะคะ .rock ให้เลือก rock.image นะคะ ให้เลือก rock_image ใส่ก้ามปูเข้าไปแล้วก็ใส่ตัวเลข 0 0, 0, 0 เห็นไหม 0 เหมือนกัน เพราะคือบอกแล้วว่าเป็นรูปที่ 0 น่ะ เป็นรูปลำดับที่ 0 น่ะ Colon ค่ะ Colon แล้วก็วรรค ใส่ , แล้วก็วรรค แล้วก็พิมพ์ self อีกเหมือนเดิม s-e-l-f ตามด้วย . นะคะ . เลือก rock_image เหมือนเดิม ใส่ก้ามปูใช่ไหมคะ ก้ามปูแล้วก็ 0 เข้าไป ไม่ใช่ปีกกา ขอโทษ ก้ามปู แล้วก็ 0 . นะคะ ใส่ . .get ค่ะ พิมพ์ ge ge เลือก เลือก get.rect ก็คือเราจะไปใช้ฟังก์ชันที่ชื่อว่า get.rect นะคะ ใส่ฟังก์ชันเข้าไปก็จะเป็น get.rect สังเกตพอเลือกปุ๊บใช้ปุ๊บมันจะต้องเปลี่ยน สีมันจะต้องเปลี่ยนเห็นไหมคะ ดูดี ๆ นะคะ บรรทัดนี้จะยาวหน่อย เดี๋ยวลดขนาดลงให้อีก บรรทัดนี้เริ่มที่ตรงนี้นะคะ self.rock_image_0 แล้วก็ใส่ , แล้วก็วรรค self.rect_0 = = self_rock_image ในก้ามปูนะคะ ก็คือใน list ลำดับที่ 0 นี้มันคือ self.rock_image ที่ get.rect เข้ามา อันที่ 1 เพื่อไม่ให้พิมพ์ผิด เพราะฉะนั้น ก๊อปปี้ค่ะ ก๊อปปี้บรรทัดนี้ ก๊อปฯ เลย ทำแถบเลือกแล้วกด Crtl + C ก็แล้วก็วางแล้วก็ Ctrl + V โอเค ถูกต้อง ตำแหน่งไม่โย้นะคะ ถ้ามันโย้เด็ก ๆ จะต้องกด space bar กลับคืน เปลี่ยนจาก 0 เป็นอะไร 1 เพราะบอกว่าแล้วใช้ 2 ลำดับ 0 แล้วก็ 1 เพราะฉะนั้น 0 เปลี่ยนเป็น 1 ให้หมด จะได้ไม่เกิดปัญหาพิมพ์ผิดเหมือนที่แม่บอก เขียนโค้ดแบบขี้โกง ๆ บ้าง อะไรบ้างนะคะ โอเคไหม เห็นไหม แก้เช็กให้ครบด้วยนะ ไม่ใช่ 1 0 เด้อ แก้ให้มันครบทุกตัวด้วยเด้อ ไม่ใช่อันหนึ่งเป็น 0 อันหนึ่งเป็น 1 ก็คือ rock_image ก็ต้องเป็น 1, 1, 1 ทั้งหมดนะคะ แก้ให้ครบด้วย แก้ให้ครบทุกตัวนะคะ โอเคไหม บรรทัดที่ 2 นี่ไม่น่าจะช้า เพราะแก้แค่ตัวเลขใช่ไหมคะ เพราะฉะนั้น เราจะมาเริ่ม กด Enter เพื่อเว้น 1 บรรทัดนะคะ แล้วก็ Tab ให้มันตรงกับ self ของเรา เราจะมาทำอีกส่วนหนึ่งนะคะ ก็คือส่วนของการวางตำแหน่งนะคะ ใช้ self เหมือนเดิม s-e นะคะ แล้วก็คลิก self ตามด้วย . rect re เลือก rect_0 เพราะเราสร้างไว้แล้วนึกออกนะ ตามด้วย .bottom .bottom กำหนดจุดสูง นึกออกนะ buttom นะคะ กำหนดจุด = g อันนี้เรา... มันจะเป็นชื่อตัวแปรที่เราสร้างไว้นะคะ สร้างไว้สำหรับ GROUND_HEIGHT ก็คือความสูงของคือไอ้รูปจากพื้นน่ะ นะคะ ตรงนี้จะได้เห็นชัดเจนให้เด็ก ๆ พิมพ์ด้วยตัวพิมพ์ใหญ่ทั้งหมด จะได้รู้ เพราะฉะนั้น กด Capelock แล้วก็พิมพ์ G-RU-N-D GROUND แล้วตามด้วย underscore H-I-G-H-T ให้พิมพ์ด้วยตัวพิมพ์ใหญ่ แล้วก็ใส่เครื่อง... แล้วก็วรรค แล้วก็กดเครื่องหมายลบนะคะ - แล้วก็วรรค 11 ก็คือให้มันลบออกจากพื้นน่ะ 11 11 11 Pixel ประมาณนี้นะคะ ทีนี้ มาที่ตัวที่ 2 ตัวที่ 2 นี่ คืออะไร ดูนะคะ self พิมพ์ self เลือก self นะคะ .rect เลือก rect เลือก rect_0 เหมือนเดิม แต่ . เป็น left left ตัวเล็กนะคะ แล้วก็พิมพ์ l-e-f-t left ข้างซ้าย ตัวนี้มากจากไหน ค่าตัวนี้จะใช้เรียกตัวแปรนี้นะคะ จำได้นะ นี่ screen_width ให้เหมือน GROUND_HEIGHT นะคะ เพราะฉะนั้น จะแก้... ไม่แก้ ๆ มันสร้างมาแล้ว ไม่แก้ ไอ้ตัวนั้นมันสร้างมาแล้ว = ตรงตัวนี้ของเด็ก ๆ น่ะ ตัวแปรของเด็ก ๆ ชื่ออะไร นึกถึงนะ เข้าใจไหมคะ ก็คือตัวนี้ เพราะฉะนั้น ถ้าแม่พิมพ์นี่มันจะขึ้นมาเลยเพราะมันสร้างแล้ว s-c นี่ แม่ก็จะเลือก screen_width ที่แม่สร้าง นึกออกนะคะ มันจะตรงกับตัวนี้ ดูดี ๆ นะคะ ตรงกับตัวนี้นี่ ตรงพื้น พื้นฉากเกมเราน่ะ พื้นที่เกมเราน่ะ เพราะฉะนั้น มันมาจากตัวนี้นะคะ มาจากตัวแปร screen_width นะคะ บอกให้ Class นี้มันรู้ว่าภาพที่จะเอามาวางนี่ ตำแหน่งที่ 0 นี่มันเริ่มที่ด้านซ้ายนี่จะมีค่าเท่ากับไอ้ตัว screen_width นี่ ตรงมุมซ้ายน่ะ นะคะ โอเคไหม โอเค อันดับต่อมา Enter เพื่อเว้น 1 บรรทัดนะคะ ก๊อปฯ ลูก ประโยคเดิมแป๊ะ ก๊อบฯ จาก 0 แล้วแก้เป็นอะไรคะ เราใช้รูป 2 รูป 0 กับ 1 นะคะ Copy ค่ะ วาง แล้วแก้จาก 0 เป็น 1 ให้หมด แล้วก็มาแก้ตรง ตรงอันที่ self.rect_1 นี่ ตรงเท่ากับ ค่าของตัวนี้มันจะมาจาก self. นะคะ ..rect_0 เพราะอะไร เพราะรูปที่ 1 กับรูปที่ 2 มันจะอยู่ห่างออกมานึกออกไหม ก็คือหมายถึงพอเราวางภาพที่ 1 เข้าไปแล้ว ภาพที่ 2 มันก็จะนึกออกนะนะคะ เพราะฉะนั้น เมื่อภาพที่ 1 ปรากฏนี่ มันบอกว่าให้บวกเพิ่มขึ้นไป .right ทางขวาเพิ่มทางขวาเพื่อจะวางตำแหน่ง r-i-g-h-t .right + อะไร วรรคแล้วก็ตามด้วยเครื่องหมาย + บวกด้วยจำนวนของ int int มาจาก integer นั่นเอง int ในวงเล็บที่นี้ ก็คือ screen ก็คือมาจากค่าของ screen_width หาร 2 ตรงการวรรคหนึ่งด้วยนะคะ หารด้วย 2 ใส่อะไรเข้ามาเพิ่ม บรรทัดนี้ ใส่ speed ระยะ ความเร็วน่ะ ความเร็วในการไอ้นี่ self พิมพ์ self .speed s ปุ๊บ เลือก speed เลย self ปุ๊บ . self ให้เลือก speed นะคะ เพระาเราจะใส่ speed ให้มัน = speed เลือก speed นะคะ ในส่วนนี้ก็คือเมื่อประกาศตัวแปร rect_0 rect_1 แล้วใช่ไหม ทีนี้ก็ต้องให้มันทำงานสิ ก็คือ self self. เลข 0 นะคะ = สมมติ ๆ ไม่สมมติล่ะ ตั้งค่าให้มันล่ะ กำหนดค่าเริ่มต้นให้มันที่ 240 แล้ว self. เลข 1 = 720 กำหนดค่าเริ่มต้นนะคะ ก็คือตำแหน่งที่จะวางมันนี่ จะประมาณนี้ แต่พอบวกลบอะไรนี่ button_left button อะไรนี่ ิอันนี้ คือ ในส่วนของการกำหนดค่าของ Class Rock เราเสร็จส่วนนี้แล้วนะ อย่าลืมเรายังมีอีกกี่ส่วน ส่วนต่อไป เห็นไหมคะ ส่วนของการวางรูปก้อนหินที่เราสร้างไว้ แล้วก็อัปเดตมันนะคะ แล้วก็วาด แล้วก็แสดงผลมันอีก 3 ฟังก์ชันนะคะ โอเคนะคะ เพราะฉะนั้น เราก็จะถ่ายก่อน ถ่ายก่อน ๆ ไปทำฟังก์ชันต่อนะคะ ฟังก์ชันต่อไป เมื่อกี้กำหนดค่าเบื้องต้นให้มันไปแล้ว part นี้เสร็จ เอ้ย function นี้เสร็จแล้ว Enter เพื่อเว้น 1 บรรทัด Tab เข้าไป 1 จะต้องตรงกับ... เห็นไหมคะ def นี้นะคะ พิมพ์ d เลือก def function เหมือนเดิม เราอาจจะทำฟังก์ชันใหม่แล้ว ฟังก์ชันแรกเสร็จไปแล้ว ฟังก์ชันที่ 2 ตัวนี้เป็นฟังก์ชันที่ 2 นะคะ สำหรับ get_rock ก็คือก้อนหินน่ะค่ะ เอาตัวก้อนหิน รูปก้อนหินของเรานะคะ เราจะใช้ชื่อฟังก์ชันว่า get_rock นะคะ พิมพ์ g-e-t_rock ในวงเล็บเราเรียก self ค่ะ เราเรียก self มาใช้ เห็นไหม ตรง pass นะคะ ลบออก แล้ว enter 1 บรรทัด เราจะมีตัวแปร 2 ตัว ก็คือ current_rock นะคะ ก็คือตำแหน่งของรูปก้อนหินปัจจุบันกับ rock ก็คือรูปก้อนหินถัดไป มันจะเหมือนคือเขาบอกว่ามันจะเหมือนก้อนหินมันเคลื่อนได้ ที่จริงมันตั้งเฉย ๆ นั่นล่ะนะคะ เพราะฉะนั้น เราก็จะมี 2 ตัวแปร ก็คือตัวแปรที่ 1 current ไม่ใช่ current_sprites นะ current เหมือนกัน แต่เป็น current_rock นะคะ วรรค เท่ากับ เท่ากับอะไรนะ current_rock เราก็คือจะเลือก self ใส่ก้ามปูค่ะ ใส่ก้ามปูก่อน แล้วก็พิมพ์ self นะคะ .rock ในที่นี้ให้เลือก rock_image_0 นะคะ เห็นไหม เด็ก ๆ สังเกตมันจะเลื่อนได้นะนี่ ๆ ๆ r ปุ๊บเรามาหา rock_image_0 ของเรานะคะ เห็นไหมคะ นะคะ ใส่ , แล้วก็กดวรรค ก็คือมันมี 2 อัน มันมี 2 อัน มันเริ่มที่ self.rock_image_0 ต้องมีอะไรคะ self. เลือก rock_image_1 นะคะ เพราะฉะนั้น ถ้าสร้างไว้แล้วนี่ มันจะขึ้นมาให้เราเลือกได้เลย ไม่ต้องพิมพ์ใหม่ มันจะไม่ผิดเห็นไหมคะ หลักการใช้ Sublime นะคะ จะเป็นอย่างนี้ ชื่อมันจะไม่ผิดนะคะ ได้ตัวแปรแรกแล้วสำหรับ current_rock ทีนี้สำหรับ พิมพ์ตัวแปรนะคะ ตัวแปร r-o-c-k rock_r-e-c-t rect = เหมือนเดิมค่ะ ปีกกา ก้ามปู ๆ เห็นไหม สังเกตง่าย ๆ ข้างบน self.rock เราก็จะเลือก self_rock ใช่ไหมคะ เพราะฉะนั้น เราก็จะเรียก s-e self. r เลือก เลข 0 แล้วก็ self เหมือนเดิม self.rect 1 เห็นไหมคะ มันจะมาเป็นคู่ rock_0 rectก็ reck_1 เหมือนกัน ถ้าสร้างไม่แล้ว จะพิมพ์ไม่ผิด มันจะขึ้น มันก็จะไม่เกิดปัญหา unfile name อย่างนี้หรือ Name error อย่างนี้นะคะ เห็นไหมคะ มันจะแก้ได้ ๆ พอได้เสร็จมันจะต้องทำการ return ค่านะคะ Return ค่าทุกครั้งนะคะ ใช้คำสั่ง return ค่ะ เลือก return return อะไร returnกับ rock_rect นั่นเอง เลือก current_rock นะคะ กับ rock_rect ที่เราสร้าง พอเรียกมาตำแหน่งมันเหมือนจะเลื่อนแต่มันไม่เลื่อน แต่ความจริงมันไม่เลื่อนก็คือ Return ค่ากลับไปนะคะ มันเหมือนหลอกที่ทำ Background หลักการเดียวกันนะคะ ส่วนของการนำก้อนหินมาแล้ว มาเพิ่มอีกฟังก์ชันหนึ่งนะคะ ฟังก์ชันนี้ชื่อว่า "update_speed สร้างฟังก์ชันใหม่ พิมพ์ d ปุ๊บ เลือก def function ตรง Function name เราจะพิมพ์ตรงชื่อฟังก์ชันเขียว ๆ นี่นะคะ เราจะพิมพ์ว่า update update_speed ค่ะ สร้างไว้แล้ว เราก็ใส่ _ เข้าไป แล้วก็ speed ก็คือ update ให้ความเร็วของ... ให้เหมือนว่าค่าที่มันโดนรูปมันเอาเข้ามาน่ะ มันมีการเปลี่ยนแปลงน่ะ มันต้องมีการอัปเดตนะคะ ในวงเล็บสิ่งที่เราจะมีก็คือ self กับ speed self นะคะ แล้วก็ฟังก์ชัน speed ที่เราสร้าง speed นะคะ 2 ตัว ส่วนของ object ที่ใช้ ก็คือ object ของ self กับ speed นั่นเอง มาเริ่มกันเลย กำหนดค่าให้เลย กำหนด self ก็คือ self.speed ค่ะ self.speed นะคะ = speed นั่นเอง ส่วนที่ 2 เป็น self ของ ของอะไร self.range range นะคะ range ก็คือพิกัด range แล้วตามด้วย _0 ใส่เครื่องหมาย + แล้วก็ = ก็คือให้ความเร็วมันเพิ่มขึ้น += นี่หมายถึงความเร็วมันเพิ่มขึ้นนะคะ = อยู่ไหนล่ะ += 1 ให้เพิ่มทีละ 1 เพิ่ม speed มัน นะคะ ส่วนของ self self.range_1 range_1 ตำแหน่งที่ 1 นี่ ใส่บวกแล้วก็ = เหมือนกัน เพิ่ม 1 เหมือนกัน นะคะ ได้ส่วนของ Update_speed แล้ว นะคะ สำหรับทำการเพิ่มความเร็วน่ะ เพิ่มความเร็วนะคะ มาสร้างฟังก์ชันต่อไปค่ะ ฟังก์ชัน draw โอเคถูกแล้ว ยังเหลืออีก 1 ฟังก์ชัน draw ถูกแล้ว ก็คือฟังก์ชันนี้สำหรับให้มันแสดงไอ้ตัวก้อนหินเรานั่นเองนะคะ พิมพ์ d แล้วเลือก def function เหมือนเดิม ชื่อฟังก์ชันเราจะใช้ว่า draw d-r-a-w Object ที่ใช้ก็คือ self นะคะ s-e ใช้ object เดียวค่ะ ส่วนของ path Enter ลงไปเว้น 1 บรรทัดนะคะ screen.blit ใช้คำสั่ง screen.bilt นะคะ b-l-i-t นี่ ใส่วงเล็บ เรียกใช้ self self.rock_image_0 นะคะ เพราะฉะนั้น เลือกใช้ self_0 นะคะ ิพิมพ์ image ปุ๊บ ให้เลือก rock_image_0 นะคะ แล้วก็ self อีกตัวหนึ่งที่เราจะใช้ ก็คือ self.range_0 ค่ะ . นะคะ r เลือก rect_0 วาด rock ที่ 0 เห็นไหมคะ ให้ทำซ้ำจะได้คล่อง ๆ screen.blit เหมือนเดิม ในวงเล็บเรียกใช้ self.rock_image_1 ค่ะ แล้วก็เรียกใช้ self..rect_1 ค่ะ โอเคไหม นะคะ ก็คือเราวาด 2 รูปใช่ไหมคะ ต้องวาง 2 รูป ก็คือภาพที่ 1 กับ...ก้อนหินก้อนที่ 1 กับก้อนหินก้อนที่ 2 นะคะ โอเคไหม เสร็จแล้วนะ ไปฟังก์ชันสุดท้ายแล้วนะคะ ก็คือฟังก์ชันสุดท้ายที่เราจะทำ ก็คือตัวนี้นะคะ ฟังก์ชัน update นี่ ตัวนี้จะมีเงื่อนไขเพื่อให้มันไป Random ดึงภาพนะคะ ลืมแก้โค้ด โอเค โอเคนะคะ โค้ดต่อ ๆ เดี๋ยวจะไปต่อไม่ได้ เหมือนเดิมค่ะ ประกาศฟังก์ชัน def ฟังก์ชันเหมือนเดิม ชื่อฟังก์ชันที่เราจะใช้ คือ update สังเกตนะครับ เหมือนใน dino มันก็มีอัปเดต แต่อย่าลืมว่ามันอยู่ใน class เพราะเราสร้างไว้ใน class มันจะไม่ทับซ้อนกันนะคะ มันจะเป็นของฟังก์ชันของ Class นี้เท่านั้นนะคะ ใน update object ที่จะใช้นะคะ ใช้ self อย่างเดียว ตัวแรกที่เราจะเรียกใช้ ก็คือ se self. r-e .rec 0 นะคะ .left left วรรค -= ใส่เครื่องหมาย - และเครื่องหมาย = วรรคเรียกใช้ฟังก์ชัน integer int นะคะ แล้วก็ใส่วงเล็บเข้าไป ใน int เราจะเรียกใช้ self_speed มาใช้ค่ะ self self.speed นะคะ ไม่ให้เป็นการเสียเวลา ก๊อปปี้ เปลี่ยนจาก rect_0 เป็น rect_1 โอเคไหม Copy นะคะ แล้วก็วาง แก้ที่เลข 0 เป็น 1 แค่นั้นนะคะ ค่าอื่นเหมือนกัน เพราะฉะนั้น ใช้วิธีการ copy แล้วแก้ตำแหน่งอย่างเดียว ทีนี้เราจะมาใส่เงื่อนไขแล้ว เพื่อตรวจสอบนะคะ if ค่ะ if condition เลือก if condition โอเคนะคะ สิ่งที่จะมือ ก็คือ self พิมพ์ self ก่อน self. อะไร .rect ค่ะ เลือก rect 0 ข้างบนเป็น left เพราะฉะนั้น ก็ต้องเป็น right จะทำเมื่อเป็น right นะคะ มากกว่า 0 มากกว่าแล้วก็วรรค 0 โอเค ในเงื่อนไขนะคะ ตัวนี้มันมีเงื่อนไขซ้อนเยอะ เพราะว่าประกาศตัวแปรชื่อ temp t-e-m-p temp_position p-o-s-i-t-i-o-n = self นะคะ เรียกใช้ self .rect แต่เป็นเลข 1 นะคะ .right ค่ะ right .right นะคะ ทีนี้ให้มันเพิ่มค่าบวก ในเครื่องหมาย + เพิ่มค่าโดยการไป random นะคะ ใช้คำสั่ง random สร้าง Random ขึ้นมา randam.r-a-n-d นะคะ rand อันนี้เราสร้างนะคะ randrange ก็คือพิกัดด้วย ตำแหน่งด้วย r-a-g-e ใส่วงเล็บค่ะ ในวงเล็บนะคะ เราจะมี object 2 ตัว ก็คือ self.range_0 กับ self.rang_1 นั่นเองเรียกใช้ self.ra นะคะ range_0 เราสร้างไว้แล้ว คลิกเลือกไว้เลย self อีกเหมือนกัน .range 1 สร้างไว้แล้วนะ ไม่ต้องพิมพ์นะ สังเกตนะคะ เราสร้างไว้แล้ว เราคลิกเลือกมาใช้ได้เลย ถ้าพิมพ์เดี๋ยวพิมพ์ผิดอีก แล้วก็บอกว่า Unknow แล้วก็จะไม่รู้จักตัวแปรนะคะ เพราะฉะนั้น อย่าพิมพ์นะ เพราะบอกว่าอันไหนสร้างแล้ว เด็ก ๆ พิมพ์ปุ๊บนี่ ใช้วิธีการนี้นะคะ ก็คือสมมติบอก เหมือน range_1พอเราพิมพ์ ra แล้วเราก็มาเลื่อนหา range_1 นะคะ มันจะทำให้เราพิมพ์ชื่อฟังก์ชันหรือตัวแปรที่เราสร้างไว้น่ะไม่ผิด โอเคนะคะ นี่เพิ่งเงื่อนไขที่ 1 เอง ไปที่เงื่อนไขถัดไป เงื่อนไขถัดไปจะอยู่ตรงกับ temp นะคะ ยังไม่เคลื่อนนะคะ ไม่ได้อยู่กับ if แรกนะคะ มันเป็นเงื่อนไขที่อยู่ข้างใน เพราะฉะนั้น กด if เลือก ifcondition ในนี้นะคะ เงื่อนไขนี้นะคะ เราจะให้ตัวแปร temp temp_position เราสร้างไว้แล้ว คลิกเลือก เครื่องหมายมากกว่าน้อยกว่า screen_width SCREEN_WIDTH: ก็คือไม่ให้มันเกินไม่ให้ถ้ามันน้อยกว่านะคะ น้อยกว่าขนาดของหน้าจอที่เรากำหนดในการเล่นเกมนี่ มันก็จะทำงานนะคะ ทำอะไร ให้มันไปทำอะไร เราก็จะให้มัน ตรง pass นะคะ ให้มันเรียกใช้ self .หา rect rect แรกของเราก็คือ 0 ค่ะ rect_0.left นะคะ เท่ากับอะไร = temp_position ไง เท่ากับตัวนี้นะคะ เราก็พิมพ์ te ก็ได้น่าจะขึ้น เลือก temp_position นี่ ๆ เห็นไหม ซ้อนแล้ว มีเงื่อนไขซ้อนข้างใน if if 1 ถ้า ๆ ต่อไปแล้ว ถ้า แล้ว นะคะ ให้อยู่ตรงตำแหน่ง if else นะคะ else e-l-s-e นี่ else นะคะ ใส่ : ไม่ใช่ ; ใน else นะคะ ใน else เรียกใช้ self self.rect_0 ค่ะ rect_0.left ให้มีค่าเท่ากับ... เท่ากับอะไรเอ่ย = SCREEN_WIDนะคะ ให้มันเท่ากับพื้นที่ที่เรากำหนดฉากที่เรากำหนด ฃแล้วก็สร้างตัวแปรเพิ่มนะคะ สร้างตัวแปรให้ตรงกับตำแหน่ง if ค่ะ เราจะปิดเงื่อนไขนี้ เหมือนกัน t-e-m-p_ แต่ไม่ใช่ temp_position แต่เป็น temp_index ตัวแปรชื่อ temp_index วรรค = ตัวแปรชื่อ temp_index ทำการ random ก็คือไปสุ่ม random สร้างไว้แล้วนะคะคลิกเลือก random.randrange ก็สร้างไว้แล้ว เลือกrandนะคะ ใส่วงเล็บ ค่าที่ใส่ก็คือ 0 กับ 5 ค่ะ กำหนดค่าให้ตัวแปร เสร็จแล้วนะคะ เราจะไปเรียกใช้ self .rock เลือก rock_image_0 เห็นไหมคะ เพราะฉะนั้น สร้างไว้แล้วไม่น่าจะเสียเวลาพิมพ์มาก ตามด้วยมีค่าเท่ากับ = นะคะ ไม่ใช่บวก = self.rock rock ในที่นี้เราจะใช้ rock_image นะคะ rock_image ค่ะ rock_image แล้วใส่ก้ามปูเรียกตัวแปร temp_index มาใช้ค่ะ temp_index ก็คือให้มันสุ่มค่ารูปที่อยู่ข้างในน่ะ เราเสร็จ if นี้แล้วนะคะ if นี้เสร็จไปแล้ว การกำหนดตำแหน่งเสร็จแล้ว ต่อมาได้เลข 0 แล้ว มันก็ต้องมี rect_1 นะคะ นะคะ ใช้หลักการ copy เด็ก ๆ เพราะมันคือโค้ดชุดเดียวกันเพียงแต่เราจะแก้ที่ตัวเลขมันนะคะ ก๊อบตั้งแต่ if self โอเคไหม นึกออกนะ เพราะมันเป็น ตัวนี้ คือ ของชุดนี้ใช่ไหม แต่มันเริ่มที่ rect_0 ใช่ไหม เราจะเปลี่ยนเป็น rect_1 นะคะ เพราะฉะนั้น เราจะต้องก๊อปฯ ตั้งแต่ if self_rect_0 temp_index นี่นะคะ กด Crtl + C แล้วก็กด Enter Tab ให้ตรงกับตัวนี้ ตัวนี้นะคะ Tab ให้ตรงกับตัวนี้นะคะ ตำแหน่งน่ะ ขอโทษ ๆ เด็ก ๆ ดูตำแหน่งดี ๆ นะคะ ตัวนี้เสร็จแล้วนะ ตัวเลข 0 นี่ เสร็จแล้ว เสร็จที่ temp_index กด Ctrl + V เห็นไหมคะ ตำแหน่งเดียวกันนะ ตำแหน่งเดียวกัน แต่เปลี่ยนจาก rect_0 เป็นอะไร 1 ค่อย ๆ ดูนะคะ เปลี่ยนตรงไหนบ้าง เมื่อกี้เป็น 0 เปลี่ยนเป็น 1 แล้วจากนี้ เห็นไหมคะ จาก rectให้เปลี่ยนเป็น 0 สลับค่ากัน เข้าใจนะ แล้วก็ตรงนี้เห็นไหมคะ ตรงนี้ไม่เปลี่ยน ตรงนี้ไม่เปลี่ยน มาเปลี่ยนตรงนี้ค่ะ มาเปลี่ยนตรง... นี่เห็นไหม เลข 0 นี่ ตรงนี้เปลี่ยน เปลี่ยนเป็น 1 else else นี่ก็เปลี่ยนตรง else นี่ก็เปลี่ยนเห็นไหมคะ แล้วก็ตรง rock_image_0 ก็เป็น rock_imagเปลี่ยนเหมือนกัน ค่าอื่นเท่ากันนะคะ นี่คือ update คือ อัปเดตค่าโอเคนะคะ เพื่อความชัวร์ หมดแล้วนะคะ เราจะ Ctrl + B เพื่อเช็กโค้ดหน่อยหนึ่ง โอเคไหม ถ้าผ่าน Error จะไม่ขึ้น แต่ไอ้นี่ยังไม่ขึ้น เดี๋ยวเราเอาไว้ต่อสัปดาห์ต่อไป เพิ่ง... เรายังไม่เรียกใช้มันน่ะ เราสร้าง Class แล้วเราไม่เรียกใช้มันนี่มันจะไม่ขึ้นนะ จำได้นะ ให้นึกถึง เหมือน... สร้าง dino ใช่หรือเปล่า สร้าง dino เสร็จแล้วนี่เห็นไหม เราต้องมาเรียกใช้งานตัว dino ด้วย ต้องเรียกใช้ Class มัน ถ้าไม่เรียกมันก็ไม่ขึ้นนะ เรายังไม่ได้เรียกนะ เราค่อยสร้าง ในสัปดาห์หน้า อันดับแรกก็คือ Save ค่ะ อย่าลืม save ใครกด Ctrl + B Error ยกมือ เดี๋ยวไปดูโค้ด ยังมี Error อีกหรือ บอกแล้วให้ค่อย ๆ ดูตามเราไป คือ ถ้าจะผิด 1 ชื่อ ชัวร์เลย นะคะ ถ้าจะผิด ถ้ามันจะผิดน่ะ มันจะผิดที่ชื่อเสียเป็นส่วนใหญ่ ทำตามแล้วดูดี ๆ rock_1 rect ชื่อมันจะขึ้นมาตามนั้นนะ ถ้าทำตามน่ะจะไม่ผิด แต่ถ้าพิมพ์เองจะผิดใช่ไหม สังเกตหลายทีแล้ว ไหนเครื่องใคร Error บ้าง นิว นิว Error ไหม ก็จะประมาณ 40 บรรทัดนะคะ ทั้ง Class ทั้ง Fuction นี่ ไว้บ้างอะไรบ้าง บางคนพิมพ์ไม่ทันนะคะ 1 ชั่วโมงต่อ 10 บรรทัด ถึงได้บอกว่า... เห็นไหม ทำไมถึงบังคับให้พิมพ์ดีดน่ะ มันจะช่วยได้นะคะ จำแป้นได้น่ะ มันก็จะไปได้เร็วขึ้น เดี๋ยวเราไว้ต่อสัปดาห์หน้านะคะ สัปดาห์นี้ ราตรีสวัส ขอบคุณพี่ ๆ ก่อน ขอบคุณพี่การ์ตูนกับพี่อี๊ดนะคะ ที่มาช่วยเป็นล่ามให้เราในวันนี้นะคะ ไว้เจอกันสัปดาห์หน้าค่ะ (พี่อี๊ด) สวัสดีค่ะ (อาจารย์สุธิรา) ความจริงเราจะวันพฤหัสบดี หัวหน้าบอก ขอบคุณ น้อง ๆ ขอบคุณพี่ ๆ นะคะ (พี่อี๊ด) ค่ะ สวัสดีค่ะอาจารย์ (อาจารย์สุธิรา) ค่ะ เซฟเสร็จหรือยัง โอเคแล้วนะ ทีนี้เดี๋ยวไปดู ใครยังโค้ดผิด ๆ ถูก ๆ