(อาจารย์สุธิรา) ตัวสีส้ม ๆ ตัวสีส้มเปิดขึ้นมา กด ctrl + B ก่อน 1 ครั้ง เพื่อเช็กว่าตอนนี้ทุกคนมี background ที่มีภาพพื้นหลังอยู่แล้วนะคะ ใครยังไม่มีหน้าต่าง พื้นที่การทำงานของตัวเอง ที่มีรูป background ยกมือนะคะ เดี๋ยวไปต่อไม่ได้ เพราะสิ่งที่เราจะทำต่อไป ก็คือเราจะเอาเกมของเราเข้ามานะคะ แล้วจะทำให้มันเคลื่อนไหว ของใครยังไม่ขึ้น ขึ้นหมดทุกคนแล้วยังคะ new version cancel ไป ทำไมหน้าต่างนี้มันไม่ยอมให้ย่อลง ทำไม PowerPoint ย่อลงไม่ได้ละ เราต้องการพื้นที่ Wonder ก็ได้ โอเคนะคะ สิ่งแรก เด็ก ๆ ไปดูไฟล์ของเราใน Drive C โฟลเดอร์เรา ยังไม่ได้โหลดภาพเหรอ จำได้ไหมครับ ตัวเกมที่จะใช้ ทำไมมันย่อสไลด์ PowerPoint ตัวนี้ลงไม่ได้ ปิดก็ไม่ได้ขอปิดก่อน คือ จแป๊บหนึ่ง จำได้ไหมคะ ที่บอกให้ค้น ไปSprite Sheet อ่ะ คือเราต้องการภาพที่มันมีลักษณะของภาพที่มีหลาย ๆ ภาพนะ คือภาพการเคลื่อนไหวต่อเนื่องกัน คือ เด็ก ๆ จะต้องเลือกตัวการ์ตูนหรือตัวเกมที่เราจะทำให้เขาเคลื่อนไหว เราจะไม่มาเสียเวลาวาดเอง ก็เลยจะให้ค้นจากเน็ตนะ ก็ต้องเลือกใช้ฟรี ดาวน์โหลดด้วยนะคะ เพื่อจะได้ไม่ติดปัญหาลิขสิทธิ์ ต้องพิมพ์คำว่า "ฟรีดาวน์โหลด" เสมอเวลาค้นนะ แล้วก็ตามด้วยคำว่า Speite Sheet s-p-r-i-t-e sprite แล้วก็ชีส s.h.e. นะคะ แล้วก็กดค้นหาลักษณะภาพสไปซี่ ก็คือจะมีภาพวันหลังแล้วก็มีภาพที่เหมือนเขาอน่ะ มีรูป อื่น ๆ ลื่อนไหวได้มีรูปอื่น ๆ ที่เห็นไหมคะ เสื้อผ้าอะไรเขาก็เหมือนกันอย่างนี้นะคะ เพราะเราต้องการวัตถุของเราเนี่ยไอ้ตัวเกมเราเนี่ย ให้มันเคลื่อนไหวนะคะ ใครหาได้แล้ว ให้โหลดแล้วเอาไปใส่ไว้ใน ตอนนี้โหลดมาแล้วนะคะ จะเอาภาพนี้ รอแป๊บหนึ่ง ใครยังไม่โหลดโหลดเลยนะคะ คือ ให้มันมีตัวหลาย ๆ ตัว อย่างน้อย อย่างน้อยมีภาพตัวเกมนี่ สัก 4 ตัวเป็นอย่างน้อยเนาะ มีมากกว่านั้นก็ได้นะคะ โฟลเดอร์ที่เราดาวน์โหลดนะคะ เดี๋ยวจะ move ไปไว้ที่ Drive C ของเรานะคะ เอาไปไว้ที่เราเก็บโปรแกรมที่เราเขียนเกมไว้น่ะ นึกออกนะ เดี๋ยวจะ Extrack แล้วนะคะ Extrac all เอาแค่ นี่ ๆ ๆ เดี๋ยวจะเลือกเฉพาะที่เขาเป็นขอเอาเป็นเดินนะคะ ขอเป็นรูปเดินก่อนแล้วกัน ทดลองให้ดูก่อนนะคะ วันนี้มีหลายตัวหน่อย เอาถึงหมายเลข 12 นี่นะยะ เราจะต้องมีรูปตัวเกมเราอยู่ในโฟลเดอร์อย่างนี้นะคะ โฟลเดอร์ชื่อ เกมที่เราสร้างน่ะค่ะ ให้สังเกตว่าเรามีไฟล์ sublime อยู่ตรงไหน เราต้องมีรูปอยู่ตรงนั้นแหละ มันจะได้หากันเจอนะคะ เด็ก ๆ ก่อนอื่นเด็ก ๆ เปิดโฟลเดอร์ตัวเองขึ้นมาไว้ด้วย เดี๋ยวจะไปเดินเช็กว่ามีรูปอันนี้กันหรือยัง เลือกสัก 1 ตัวนะ เลือกตัวเกมสัก 1 ตัว ดูนะคะ คำค้นที่ใช้ ดูคำที่ใช้ค้น เห็นไหม บนหน้าสไลด์นี่ free download sprite sheet นะคะ ให้คนด้วยคำนี้แล้ว เพราะถ้าคนด้วยคำว่า sprite sheet มันจะได้ภาพที่บอกว่ามีหลาย ๆ ตัวค่ะ ที่เขาทำไว้แล้วน่ะ ในโฟลเดอร์เด็ก ๆ ทุกคน เมื่อกี้ไปตรวจแล้วนะคะ มีมีตัวเกมที่เราจะเอามาลงแล้ว ไปไหนล่ะ อยู่ไหนเอ่ย อยู่ไหนเอ่ย อยู่ไหนเอ่ย อันดับแรกอันดับที่ 1เหมือนเดิมลองวางก่อนเพราะเราต้องรู้ว่าเราจะเอาไอ้ตัวนี้เข้าไปวางในฉากเราได้ไหม ใช่ไหม เพราะฉะนั้นนะคะ คำสั่งยังเป็นคำสั่งเดิมอยู่นะ ก็คือคำสั่งที่จะ นี่ ๆ ๆ เอารูปมาใส่นี่นะคะ แต่เราจะต้องประกาศตัวแปรใหม่ ตอนนี้ไปที่บรรทัดตำแหน่งที่ 14 บรรทัดที่ 14 ก่อน เด็ก ๆ เลื่อนลงมาประมาณบรรทัดที่ 14 มี background มีอะไรแล้วนะ เรากำหนดหน้าจอเกมได้แล้ว สิ่งที่เราจะทำต่อมา ใส่แฮชแท็กนะคะ หรือเครื่องหมายชาร์ปก่อน แล้วก็บอกว่าเราจะเอาตัวเกมเข้ามาแล้ว็เลย ใส่ # ไว้ ตรงส่วนนี้จะเป็นส่วนที่เราจะนำตัวเกมเข้ามานะคะ นำเข้าเกม นำเข้าตัวเกมใส่แฮชแท็กไว้ แล้วก็กด Enter ลงไป 2 ที เว้น 2 บรรทัด เราจะอยู่ที่บรรทัดที่ 15 จะได้เช็กง่าย ๆ เราไปตามบรรทัดก่อนตอนนี้ ก่อนอื่น เหมือนเดิมนะคะ รูปแบบจะคล้าย ๆ กับตัวนี้นะคะ ก็คือให้ pagame มันไปโหลดภาพตัวเกมเรามา ก่อนอื่นก็คือเราต้องมากำหนดตัวแปรก่อน ตัวแปรเราสมมุติเมื่อกี้ให้เด็ก ๆ ดูที่อะไรดูที่ตัวละครของเรามันเป็นตัวอะไรไม่ออกไม่รู้ เช่น ตัวนี้เป็นแมวเท่านั้นชื่อตัวแปร ก็คือตัวอะไรคะ cat ภาษาอังกฤษ ของใครเป็นตัวอะไรบ้าง ใครเป็นนก ไหนใครเป็นรูปนกยกมือขึ้น มีใครมีรูปนกไหมคะ ไม่มีหรือ เออ ยังว่าเห็นอยู่ กุ้งก็ตั้งชื่อตัวแปร bird ลยลูกออกไหมเอาชื่อตัวเกมเราอ่ะมาเป็นตัวแปรเลยเราจะได้รู้ว่าไอ้ตัวนี้คือตัวนกของเราเพราะฉะนั้นใครที่วาดรูปเกมตัวเองเป็นรูปสัตว์ชนิดไหน นึกออกนะคะ ให้ใช้ชื่อตามตัวสัตว์ชนิดนั้น หรือตัวเกมชนิดนั้น เหมือนของแม่แมว เพราะฉะนั้นตัวเกมแม่ก็จะชื่อ cat ก่อน boy ก็ได้ ใช้บอยก็ได้ เด็กผู้ชายลูกเป็นเด็กผู้ชาย boy หรือ girก็ได้ของไม่เป็นรูปอะไรครับ หมาก็ dog น้องใครใครไม่รู้ชื่อสัตว์ภาษาอังกฤษค้นโดยใช้อะไร Google แปลภาษานะคะ ช่วย ประกาศตัวแปรแล้วตาม ด้วยเครื่องหมายเท่ากับเสมอ เห็นไหมคะ ตรงชื่อตัวแปรน่ะ ชื่อนี่ ก็คือให้เราดูรูปตัวเกมของเรามันเป็นสัตว์อะไร เราก็ตั้งชื่อตามนั้น อย่ามาพิมพ์ตามแม่นะ ของแม่เป็นตัวแมวไงแม่ก็เลยใช้ cat ถ้าของเด็ก ๆ เป็นห Dog พากย์ไทยเป็นนกกับเบิร์ดใครเป็นOK องุ่นเป็นตัวอะไร อ๋อ หมา ก็ Dog ดูต่อนะคะ คำสั่งต่อมา เหมือนเดิมพิมพ์ p ก่อนกดตัว P 1 ครั้ง แล้วเลือก Pygame กด enter เกมอะไร .image load เราจะใช้คำสั่งนี้นะคะ . image โหลดกดลงไปกดไอแล้วก็เลือก image ไม่ออกเนาะแย่กว่านี้นะคะ image กด enter กด . อีก 1 ครั้ง GmailMinecraft เลือกโหลดใส่วงเล็บ เพราะรูปแบบเขาคือ ให้ Pygame มันไปโหลดรูปไหมคะ ตรงนี้เนาะก็คือชื่อชื่อลูกเด็ก ๆ ดูจากไหน เหมือนเดิมนะคะ เช็กชื่อภาพของเรา สังเกตดูชื่อดี ๆ มันมีหลายตัว แล้วมันมีวงเล็บ 1 พิมพ์ให้เหมือน ถ้ากลัวพิมพ์ผิดทำยังไงคะ กับพี่ให้ไหมวิธีการเพื่อจะไม่ให้พิมพ์ผิดนะเด็ก ๆ คิดขวาที่รูปเราเนี่ยแล้วเลือก Properties เห็นไหมคะ ก๊อบจากตรงนี้เลย จะได้พิมพ์ไม่ผิดนะ ชื่อมันก็จะเหมือนกันมันจะได้หาเจอไม่อย่างนั้น เดี๋ยวมันหาไม่เจอ ไม่ต้องไปพิมพ์เองน่ะไม่ออกไม่รู้ให้เด็ก ๆ ทำให้ดูใหม่นะเราคลิกที่รูปที่เราจะใช้ 1 ครั้งแล้วคลิกเมาส์ขวานะ ไอ้ตรงเนี้ยพี่มิ้วนิ้วกลางเราอ่ะเมาส์ด้วยนิ้วกลางอยู่ 1 ครั้ง แล้วเลือก Properties นามสกุลด้วย เห็นไหม อย่าลืมดูนามสกุลด้วยว่ามันเป็น PNG เพราะ นั้นก๊อบชื่อจะได้พิมพ์ไม่ผิดนะมันจะเว้นวรรคอะไรมันก็จะเหมือนกันเลยกด copy Ctrl Cเสร็จแล้วก็เอามาวางวงเล็บหายไปไหนแล้วเนื่องจากเป็นชื่อ อย่าลืมนะคะ ถ้าเป็นชื่อรูปต้องใส่เครื่องหมายอะไรคะ Single หรือ Double quote ก็คือเครื่องหมายคำพูดอย่างนี้นะคะ ทีเดียวก็ได้ไหนล่ะ ขีดเดียวหรือ 2 ขีดก็ได้ นี่คือ Single quote นะคะ นี่คือ Double quote เครื่องหมายคำพูดแบบอันเดียวกับ 2 อันน่ะนะคะ กด ctrl + v วางไฟล์นั้นเห็นไหมคะ แล้วตามด้วยนามสกุล เวลาระบุนามสกุลลูกก็คือต้องใส่ . ก่อน . แล้วก็ถ้าใครจำไม่ได้ก็ย้อนกลับไปดู ชื่ออะไรนะคะ properties เหมือนเดิมนะคะ นามสกุลเป็น PNG เราก็ใส่ PNG ลงไป . แล้วก็ตามด้วยนามสกุลเขา เห็นไหมคะ เอารูปเข้ามาแล้ว อย่าลืมเรียกใช้รูป ตอนนี้เราเอารูปเข้ามาแล้วนะคะ เราจะรู้ได้อย่างไรว่าเอารูปเข้ามา เราก็ต้องไปเรียกใช้เลือกรูปนั้นมานะคะ วันนี้ในบรรทัดนี้ คือ คำสั่งpygame.image load ก็คือให้ไปโหลดภาพที่เราจะใช้ ดูนะ ดูไฟล์ชิ้อแดี ๆ นะมันมีเว้นวรรคอะไรนะเอาตังค์มันเลยพี่เบาะCopy เอาจะได้พิมพ์ไม่ผิดแล้วอย่างไร ให้เราเข้ามาในตำแหน่งรูปของเกมเรา screen blit นี่ ใส่รูปใช่ไหมต่อมาที่เราจะใส่คำสั่งเดียวกันเลยแต่เปลี่ยนจาก pic มี เป็นเมียเนี่ยวันนี้แฟนเราจะเรียกตัวแปรนี้มาแคปมานะคะ ยังคะ ให้เด็ก ๆ เข้ามาที่บรรทัดที่ต่อจากที่เราเรียกใช้ Background screen blit bgpic นคือ background Pictures เราเนี่ยดูนะคะ กด Enter เพื่อให้เคอร์เซอร์มันอยู่บอกแล้วว่าอย่ากดเป็นอยากกดแป้น Space Bar ถ้าเห็นจุด ๆ เดี๋ยวมันขึ้น Error นะเด็ก ๆ เด็ก ๆ ไปท้ายบรรทัด ของคำสั่งที่เราจะเริ่มเขียน แล้วกด enter มีไหม เห็นไหมคะ มันจะตัด โครงสร้างมันจะจัดเปียกมาให้เราก็จะลงไปตำแหน่งเดิม กด F 1 ครั้ง แล้วเลือก screen เหมือนเดิม blit หมือนเดิม blit นะคะ เลือกเอานะไม่ต้องพิมพ์จะได้ไม่ผิดใส่วงเล็บตรงนี้ก็คือชื่อชื่อตัวนี้นะคะ เราก็ต้องเรียกใช้ cat นะ ของแม่เรียก cat เด็ก ๆ เป็นตัวอะไรแปลของเด็ก ๆ มันออกเนาะใครเป็น boy ก็เรียก boy ใครเป็นด็อกเตอร์เรียก Dogใครเป็นเบิร์ดก็เรียกเบิร์ดนะคะ เวลาเอามาเราจับระบุตำแหน่งให้มันแล้วที่นี้ดูดี ๆ ตำแหน่งจอ เริ่มต้น คือนึกออกนะ มันมีการที่เรียกว่าแกน x กับแกน Y นะคะ 0 คือ ตำแหน่งข้างบน แล้วมันจะลงมาข้างล่างอย่างนี้ ไม่เชื่อเดี๋ยวลองดูนะคะ ถ้ายังไม่เปลี่ยนตำแหน่ง เด็ก ๆ ลองดูก็ได้เอาเหมือนเดิมเลย เอาเหมือนเหมือนคำสั่งแรกเลย นี่ เอาเหมือนตำแหน่งนี้เลยนะ เด็ก ๆ ลองดูนะ cat ปุ๊บ ใส่โคลอน แล้วก็ใส่ตำแหน่ง 00 เหมือนตัวแรกเลยนะ ให้ดูเลย ว่าตำแหน่งมันเริ่มจากไหน ใครพิมพ์คำสั่งนี้เสร็จแล้วกดอะไรคะ เมื่อเราต้องการทดสอบโปรแกรม หรือรันโปรแกรม ก็คือกดปุ่ม ctrl b นะคะ เห็นไหมเราใส่ 00 ตำแหน่งน้องแมวหมดลอยอยู่บนท้องฟ้า เราอยากให้มันลงมา ให้เราดูอะไรคะ ดูแนวของภาพ background เรา ด้วยนะ ก็คือน้องแมวควรจะมายืนอยู่ตรงนี่ พื้นดินนี้พอดี เพราะฉะนั้น เราจะต้องเลื่อน 0 0 0 ตัวแรกคือ 0 ในแนว เขาเรียกว่าอะไรล่ะ แนวตั้งคอลัมน์ นึกออกนะ แล้วตัวที่สองก็คือแมวที่เป็นแถวก็คือบรรทัดตอนนั้นเราจะต้องเพิ่มจำนวนบรรทัดน้องแมวก็ตัวใหญ่ไปด้วยใช้ ทรานฟอร์มลดไซซ์ลงหน่อยก็ได้นะคะเด็ก ๆ โหลดมาแล้วตัวมันใหญ่เนี่ย ใช้ตัวนี้ก็ได้นะลด แต่ถ้าไม่ใช้ตัวนี้ลด นึกออกนะ เดี๋ยว เดี๋ยวค่อยไปแช่การลดขนาดไซซ์สอนไปแล้วนะ เดี๋ยวค่อยไปแก้ทีหลังก็ได้ เรามาเปลี่ยนตำแหน่งเดี๋ยวจะเพิ่มสักเพิ่มจำนวนบรรทัดนะคะ ที่ 250 ดูจากอะไร 1. อันดับแรก เด็ก ๆ เช็กจากนี่ได้ เช็กจากตัว screen เรา สวัสดีเราเห็นไหมคะ ตำแหน่งบรรทัดแบ่งคอลัมน์สูงสุดก็คือ 1,600 บรรทัดสูงสุดคือ 800 ตอนนี้นี่ เอาบรรทัดที่ 250 กด ctrl + B ดู ว่าน้องแมวเราเลื่อนลงมาหรือยัง ได้พอดีเลยใช่ไหมคะ น้องแมวอยู่บนพื้นดินพอดี บางคนเลื่อนลงไปเยอะ ให้นึกถึงนะ ไม่ใช่ว่าเราจะเอาลงมาจนสุดไอ้นี่ ถูกไหมคะ บางทีมันก็ไม่จำเป็นต้องลงมาจนสุด ฉากเสมอไป ให้เราดูระดับภาพ พื้นที่ของภาพเราด้วยนะ ไหน กดหรือยัง control + B หรือยังกดปุ่มนี้ยัง เดี๋ยว error ไม่ขึ้นหรอ error นี่ทำไมถึงError name error บรรทัดที่เท่าไหร ลาสัก8ไปดูที่ไหนทำไมตัวนี้เออเร่ออาดูบรรทัดนี้นะกุ้งกุ้งกุ้งดูบรรทัดนี้เด้อ หายไปไหน บรรทัดนี้หายไปไหน run ture หายไปไหน หายไปไหน 1 บรรทัด เนี่ยก่อนหน้าข้างบนข้างบนอันนี้ถูกแล้วขึ้นไปไม่ ๆ ไม่ต้อง][ ลบ ขึ้นมาอีกบรรทัดหนึ่ง แล้วก็ enter enter = แล้วก็กด Ctrl+B เออมันใหญ่ใช่ไหม เดี๋ยวเดี๋ยวค่อย จำได้ไหม ที่บอกว่า ไหนล่ะ นี่ ใช้ ใช้อะไรนะ ใช้โปรแกรม paint อยู่ไหน P P กด P P-a กดตัว Pตัว i p-a-i paint OKไปที่เมนู file Open ไหน ตัวไหน ตัวนี้ใช่ไหม เลือก เดี๋ยว ๆ select all ก่อน แล้วก็เลือกตรงนี้ลดลง 50 50 OK เอาอีกเ อาอีก50 อีก ย่อนะ ลดแล้ว ทีนี้ ctrl กด Ctrl+B เดี๋ยว ๆ อันนี้หรือเปล่า ชื่อชื่อตัวเดียวกันเปล่า ชื่ออะไร นก2 open ใช่ไหม นี่ก่อน นี่ก่อนลูก Cancel ต้องต้อง select ก่อน เลือกทั้งหมดก่อนแล้วค่อยมาเลือก อันทีหนึ่ง อีกทีหนึ่ง 50 เหมือนเดิม โอเค Ctrl+B ใหม่ Ctrl+B ทีนี้ ในกรณีของกุ้งเต้นนี่ วิธีการ มันจะมีตัวนี้ เราทำ... เห็นไหม ถ้าอย่างนี้ ถ้าบางคนเอารูปเข้ามานะคะ เด็ก ๆ ดูนะคะ บางคนเอารูปเข้ามาแล้วมันมีกรอบสีขาว ๆ นั่นก็คือมันมี Background มาดูวิธีเอา background ออกจากรูปเรา จด มีกระดาษจดไหมคะ จดไว้ ทุกคนดู เดี๋ยวจะมาสอนวิธีเอาภาพพี่มี background ออกนะคะ ภาพที่มี background เช่น หาตัวอย่างก่อนนะ ไม่แน่ใจตัวนี้มีเปล่า เดี๋ยวขอลองเปิดดูก่อนนะ นี่นะคะ บางทีรูปที่เอามานี่ มันมีไอ้พื้นหลังขาว ๆ อย่างนี้ ชื่ออะไร ไทเกอร์ เดี๋ยวลองดูนะเดี๋ยวขอลองเอา Tiger เข้ามาดูก่อนนะ แป๊บนึงนะคะเด็ก ๆ เดี๋ยวเทสต์ให้ดู ดูนะคะ ถ้ารูปใครที่มีพื้นหลัง เดี๋ยวให้ดู เดี๋ยให้ดู เหมือนของกุ้งเต้นนี่ ภาพเขามีพื้นหลังสีขาวนะ ดู ถ้าอย่างนี้นะคะ มันจะมี background ข้างหลัง ดูดี ๆ นะ เดี๋ยวเทสต์ให้ดูนะคะ นี่ เมื่อไหร่ที่ใครเอาภาพที่เลือกมาใช้แล้วมันมีอย่างนี้ มีสีขาว ๆ ล้อมกรอบนี่ เนี่ยนั่นก็คือภาพนี้มันมี background วิธีด้วยนะคะ เด็ก ๆ จดไว้เพราะHot อย่าลืมว่าเด็ก ๆ บางคนมีหลายรูปในหวังนะเพราะน้ำต้องไปเอาออกเองทุกรูปแบบนี้จะสอนให้เอาออกแค่ 1 รูป ให้ไปที่เว็บไซต์ ให้เด็ก ๆ เปิด Google นะคะ แล้วพิมพ์คำว่า "bg" B G แล้วก็ตามด้วยคำว่า "remover" นี่นะคะ ใช้ Google แล้วพิมพ์คำว่า "BG remover" ตัวนี้นะคะเด็ก ๆ นี่ ให้ค้นคำว่า BG แล้วก็ตามด้วย r-e-m-o-v-e-r ก็คือมันจะเป็นเว็บสำหรับเอาภาพที่มี เอาพื้นหลังที่อยู่ในรูปเราออกนะคะ มันก็เลยมีชื่อว่า BG remover นะคะ เห็นไหมคะ ให้เด็ก ๆ เข้าเว็บนี้เลย removebg นี่นะคะ คลิกเข้าไปเลย นี่ ที่มันขึ้นว่า remove background from Image คลิกเข้าไปเลยนะคะ แล้วที่ตัวนี้ Upload Image ก็คือให้เราคลิกที่ Upload Image แล้วเราก็ไปเปิดไฟล์รูปภาพที่เรามีตัว background น่ะ นะคะอยู่ ตัวอย่างของเรา ก็คือ Tiger 2 เลือกภาพนั้ น แล้วคิด Open นี่ ถ้า background ออกแล้ว ข้างหลังมันจะเป็นตารางสีเทา ๆ อย่างนี้นี่ หมายถึง เอาออกแล้วนะคะ เด็ก ๆ ก็กด download ไฟล์มันก็จะมาอยู่ที่ Download เรานะ ก็อีกขั้นตอนหนึ่ง ก็คือแก้ชื่อน่ะค่ะ เด็ก ๆ ก็ก๊อบไปวางไว้ในไม่ได้เราในโฟลเดอร์เราอ่ะค่ะ นี่นะ โฟลเดอร์ที่เราสร้างเกมไว้นี่ ชื่อมันยาวใช่ไหมคะ เราก็ทำการตัด เดี๋ยวนะ มันให้ rename Windows 11 นี่ มันทำไมไม่ขึ้น rename ให้ ถ้าไม่ขึ้น เราก็เปิดโปรแกรม paint ก็ได้ เพราะ save มาแล้ว Open with paint ให้เรา save as นะ save as เป็นรูปหลักเรานี่ เดี๋ยวกด Ctrl+B ดูใหม่นะคะ ตัวนี้จะปิดนะ อันเดิมมันเหมือนเดิม ภาพเดิมมี background นะคะ เมื่อกี้เราเปลี่ยนแล้วลอ Ctrl+B ใหม่ ไม่แก้ผมน่ะ ไหนละนี่ มันคือไม่ให้ remane any time sperinency เวอร์ชันนี้นี่ แปลงยากจริง โอเคนะคะ เดี๋ยวค่อยไปแก้เอานะ ก็คือชื่อมันก็จะเปลี่ยนตามไปด้วยนะ เดี๋ยวเราจะต้องไปต่อนะคะ เด็ก ๆ อาจเราได้รูปแล้ว สิ่งที่จะทำต่อไป ก็คือไอ้ตัวฉากนี่นะคะ คือ ทำให้ฉากมันเคลื่อ ซึ่งก็คือในสไลด์นี้ของเรานั่นเอง PowerPoint ผมอยู่ไหน มาดูนะคะ คำสั่งที่จะทำให้ฉาก เมื่อมีตัวละครเข้ามาแล้วนี่ นั่นก็คือถ้าตัวละครเดิน ความจริงและตัวละครไม่เดิน เราใช้ให้ฉากมันเคลื่อนเองนะคะ เปิดผิด อันนี้สไลด์คนละอันนะ โทษที โทษที สิ่งที่เราจะทำต่อมานะคะ มาแล้ว นำเข้าmelloเวโลซิตี้ to Backgroundมาดูไอ้คำว่า velo City นี่ มันหมายความว่ายอย่างไรนะคะ แปลว่า ความเร็ว ก็คือทำให้ background มัน ใส่ความเร็วให้ background นั่นเองนะคะ วิธีการ ตอนนี้เด็ก ๆ จะมาที่ตำแหน่งของ ที่ต่อจาก background นะ เรานำเข้า background แล้ว ต่อไป เราก็จะประกาศตัวแปรให้กับ ก็คือเริ่มจากกำหนดเงื่อนไขให้ background เรานั่นเองนะคะ ไปยังตำแหน่งที่ ก่อนนำเข้าเกมนะ นะคะ แล้วก็ใส่ # ไปว่า เป็นภาษาไทยแล้วกัน จะได้เข้าใจง่าย จัดการนะคะ เราจะจัดการ ตรงส่วนนี้เป็นส่วนของจัดการกับฉากเกม เด็ก ๆ ฉ ฉิ่ง อยู่ไหน บ่ได้พิมพ์โดน จัดการในส่วนของฉากเกมของเรานั่นเอง ฉ ฉิ่ง อยู่ไหน ใครรู้ ฉ ฉิ่ง อยู่ไหน บอกเราทีเราหาไม่เจออาจจะจัดการขาดนะคะ เราจะมาทำการจัดการในส่วนของฉากก่อน อันดับแรก ก็คือสร้างตัวแปรนะคะ มันจะมี BGx เราจะมีชื่อตัวแปร 3 ตัวนะคะ รอบแรก bgx ก็คือตำแหน่งของ Background ในแกน 0 bty ตำแหน่งของ background ในแกน Y แล้วก็BG Vivoloma City ก็คือกำหนดความเร็วให้ background ก็คือค่าเริ่มต้นของแต่พวกนี้คือศูนย์ทั้งหมด เราก็เริ่มประกาศตัวแปรแรกก่อน สร้างตัวแปรตัวที่ 1 bg ขอโทษค่ะ ตัวแปรแรกนะคะ ใช้ชื่อว่าBGx ซึ่งหมายถึงตำแหน่งของbackground ในแกน X เพราะเวลาเราจะเอารูปไปนี่ เราต้องระบุขอบเขตของรูปนั้นนะ นึกออกนะ กำหนดค่าเริ่มต้นSpace Bar 1 ครั้ง กดเครื่องหมายเท่ากับ 0 Bgx แล้วก็ต้องมี y d g yเท่ากับศูนย์เหมือนกันตัวที่ 3 บอกแล้ว ชื่อ BG แล้วก็ v e l o ขึ้นมาจาก Velo City นะคะ เลยจะยาวไปถ้าเริ่มต้นเหมือนกันค่ะ ก็คือค่าเริ่มต้นของฉากเรานี่ เราจะให้เริ่มที่ตำแหน่งที่ 0 ตำแหน่งในแกน x เริ่มที่ 0 แกน Y เริ่มที่ 0 แล้วก็ความเร็วก็เริ่มที่ 0 เสมอนะคะ ประกาศตัวแปรนี้และกำหนดค่าเริ่มต้นให้มันเป็น 0 ทั้ง 3 ตัวแปร ตอนนี้เด็ก ๆ จะต้องมีตัวแปรเพิ่มขึ้นมา 3 ตัว เพื่อจัดการฉาก นะคะ bgx bgy แล้วก็ BG velo สิ่งที่เราจะทำต่อมา ให้ดูนะคะ การใช้งานและความหมายของคีย์ คือความเร็วของตัวเกมนี่ มันขึ้นอยู่กับเหมือนเรากดคีย์ คีย์ในที่นี้ก็คือแป้นแป้นพิมพ์นะคะ คำสั่งให้เด็กดูที่คำสั่งเขาพาย game.apkunderscore นี่ หมายถึงปุ่มปุ่มเนี้ยมันจะหมายถึงเป็นปุ่มให้กระโดดใช่ไหมคะ ก็คือขึ้นขึ้นกระโดดขึ้นตื่นเรียกได้ 2 ตัวจะใช้ k up หรือ K Space ก็ได้ 2 ตัวนี้นะคะ เราจะใช้ ถ้าใครเคยเล่นเกมผ่าน ผ่านคอมพิวเตอร์นี้ นึกออกนะ ปุ่มที่ใช้กดละเนาะเวลากระโดดเกมมันให้กด Space Bar ใช่ไหมลูกแล้วบางทีมันให้กดลูกศรชี้ขึ้นน่ะ นึกออกนะ เพราะฉะนั้นมันก็เลยไม่ใช่มันล่ะคือไอ้ตัวคำสั่ง ใน Library pygame เรามันก็เลยใช้ 2,000 นี้ ก็คือ k f กับ A Space เนี่ยเพื่อเป็นตัวกำหนดว่าถ้ากดปุ่มนี้มันจะหมายถึงการที่ตัวเกมมันกระโดด นึกออกะคะ ทีนี้ แต่ถ้าเราต้องการให้มันไปทางซ้ายคำสั่งนั้น K_LEFT เกมต้องใส่อยู่แล้วทุกครั้งนึงออกนอกตัวคำสั่งแล้วตามด้วยตัวเขียว K มาจากทีไม่ต้องพิมพ์เต็มเขาก็เลยยอดเลยแค่เคนะคะ นักการ The Rapper ดาวดาวก็คือลง คพี่กดลงไหมคะีย์ แล้ว right ก็คือตามลักษณะลูกศร นึกออกนะคะ บนล่างซ้ายขวา มันจะมีทิศทางเคลื่อนไปตามลักษณะลูกศร ทีนี้ เมื่อเราได้ประกาศตัวแปรแล้ว ซึ่งต่อมาก็คือเราจะมากำหนดเงื่อนไขนะคะ เพราะฉากมันจะเคลื่อน ก็คือนั่นหมายความว่า เกม เกมมันเดินไป เดินจากฉากนี่ โดยปกติเกมมันเดินก็คือเดินจากเราเอาตัวเกมวางไว้ทั้งซ้ายไหมคะ มันก็จะเดินจากซ้ายไปทางขวาเพราะนั้นวัดที่เราจะให้มันเคลื่อนก็คือเป็นลูกศรที่จะให้มันไปทางขวาก็คือ K right เงื่อนไขก็จะเอามาไว้ที่ ทีนี้เราจะมากำหนดเงื่อนไขเพิ่มนะคะ จะอยู่ต่อจากตัวนี้เลยนะครับ ตัวนี้เลย ไปที่ที่เรามี loop เห็นไหม นี่นะคะ for Event มี if ที่ 1 ใช่ไหมมันจะอยู่ตรงที่ไปไหนแล้ว เป็น if ที่ 2 ที่ต่อจากเงื่อนไขแรกนะ ดูตำแหน่งดี ๆ นะคะ นี่คือ if ที่ 2 ใช่ไหมเด็ก ๆ ใส่ if เข้าไปนะคะเด็ก ๆ กด i ปุ๊บ ให้เลือก if condition เพื่อให้มันขึ้นโครงสร้างอย่างนี้นะอะไรนะคะ อย่าไปกด I F ให้กด I แล้วเลือก if conditionจะ ได้ขึ้นโครงสร้างของไฟล์เกมขึ้นมาอย่างนี้นะคะ เราจะมากำหนดเงื่อนไข เพื่อให้ฉากเราอ่ะมันทำงานนั่นเอง นะ loop กับ event มันจะอยู่ด้วยกันใช่ไหมคะ กำหนดช่วงเวลาและเหตุการณ์สิ่งที่จะต้องทำใช้คำสั่งเสร็จ คำสั่งแรกก็คืออีเว้นดอทคอมเราจะเลือกใช้เหตุการณ์ที่เกี่ยวกับgmail.com = = นะคะ ถ้า ๆ ๆ ๆ ถ้า Event ก็คือเหตุการณ์ กด e แล้วคลิกที่ Event .t ที่เราเลือก P y p e Type วันนี้เราจะมากำหนดเงื่อนไขนะคะ ในการทำ lopp ซ้ำนะคะ ทวนซ้ำนะคะ เด็ก ๆ if กด อีปุ๊บ Event ขึ้นมากด enter นะคะ แล้วก็ตามด้วยตัว t t y p e Type ถ้าใช้ if จำไว้นะคะ เครื่องหมายเท่ากับใน if จะต้องมี 2 ครั้ง อย่างนี้ถึงจะถูก บอกเท่ากับไม่ได้หมายความว่าใส่เข้ากับครั้งเดียวน ะ ถ้าเป็น If = ในอีกจะต้องใส่ 2 ครั้งอ่ะขายเกมส์ PC ก่อนแล้วเลือกไฟล์เกมเลือกอะไรนะใส่ . แล้วก็ตามด้วย คีย์อะไรคีย์แรก K_DOWN นะคะ พี่ดาK_DOWN คำสั่งครีมดาวตัวนี้หมายถึงเมื่อมีการกดมันโดนกดขี่ดาวในตัวนี้หมายถึงปุ่มมีการกดปุ่มเกิดขึ้นณปุ่มกดก็คือปุ่ม K_RIGHT นะคะ pygame.K ใหญ่นะคะ คำว่าคีย์ดาวนี้เป็นคีย์ตัวใหญ่ k e y พิมพ์ด้วยตัวใหญ่นะลูก D O W N ตัวนี้ หมายถึง ถ้ามีการกดที่ปุ่ม K_DOWN ในที่นี้ปุ่มมันโดนกดนะคะ ลักษณะก็คือปุ่มปุ่มโดนกดแต่เรายังไม่ได้บอกว่าเป็นปุ่มอะไร ใส่อะไรคะ เสร็จเสร็จประโยคของ if จะต้องใส่ : เสมอนะคะ แล้วมาที่ pass ลบ pass ออก โครงสร้างมันนพ คำสั่งต่อมาที่เราจะใช้ก็คือใส่ if อีกครั้งนึงนะคะ เพราะต้องการระบุว่าคีย์ที่เราจะใช้กดน่ะ คือคีย์อะไร กด i แล้วเลือก id กด e แล้วเลือก Event Event .key = = = นะคะ ก็คือ if แรกบอกว่าเมื่อเหตุการณ์ที่เกิดขึ้น ก็คือเงียบเมื่อมีการกดปุ่มที่ 2 บอกว่ากลุ่มที่โดนกดคีย์ที่โดนกดนี่ จะต้องเป็นคีย์ที่ชื่อว่าพิมพ์ pygame นะคะ และเลือกไฟล์เกม K Kอันเดอร์สกอร์likeสังเกตคำสั่งตรงนี้นะคะ ดูดี ๆ นะได้ไหมคะ จะใช้ตัวใหญ่นะคะK_RIGHT ก็เป็นตัวใหญ่ใช้ตัวใหญ่เสมอนะคะ ที่เกี่ยวกับคีย์นะลูก กดด้วยตัวพิมพ์ใหญ่ทั้งหมดนะคะ RIGTH pygamr เกม Doไม่ใช่ผลบอลไม่ใช่คอมม่าตัดนะคะ ดรK Liteอธิบายนะคะ ก็คือถ้ามีเหตุการณ์พิมพ์ พิมพ์กดขึ้นก็คือมีการกดปุ่มเกมใชไหมคะ pygame K_DOWN ฟรีดาวน์ถ้ามันมีการกดปุ่มเนี่ยแล้วไอ้ปุ่มเนี้ยจะต้องเป็นปุ่มอะไรนะลูกศรที่ไปทางขวานะคะ ถ้ามีการกดปุ่มลูกศรที่ไปทางขวาปุ๊บ อย่าลืมนะคะ ทุกครั้งที่จบประโยคของ if เราจะต้องใส่โคลอนเสมอนะคะ พอกด Enter เด็ก ๆ สังเกตเห็นแถบมันจะปรับให้อัตโนมัติ เพราะฉะนั้น เวลาพิมพ์ Code ดูด้วยนะคะ ใช้ sublime นี่ สิ่งที่เราจะทำต่อมา ก็คือเลือกเรียกตัวแปรความเร็วเพราะเราต้องการรู้ว่าไอ้ฉานี่นะคะ แป้นพิมพ์ BG แล้วเลือก velo นะ ไปหาที่คำว่า velo เพราะเราจะค่าความเร็วมันเริ่มที่ศูนย์เพราะฉะนั้นพอมีการกดปุ่ม Push เราจะให้ความเร็วของฉากมันเพิ่มขึ้นจาก 0 เพิ่มเป็นเท่าไร อ่ะอย่าเพิ่งเพิ่มเยอะ บางทีเพิ่มเยอะมากก็จะลองเพิ่มที่ 5 ก่อน เท่ากับ 5 ส่วนต่อมานะคะ เราจะมาทำให้มันแสดงผล มือไปไวกว่า ไหนล่ะ นะคะ กด Enter แล้วดูตำแหน่งนะคะ เด็ก ๆ ดูตำแหน่งดี ๆ นะ ฃมันจะอยู่ตรงกับ for เห็นไหมคะ เพราะฉะนั้น เด็ก ๆ จะต้องดูนะคะ ตำแหน่ง for คือตรงนี้ ลงมากด backspace ย้อนหลังไป 1ละพอก็คืออีกแป๊บนึง2 ครั้ง กด back space ย้อนไปจะอยู่ตรงกับตำแหน่งกรีนฟิลด์นี่ โอเคไหม เรียกใช้ตัวแปรที่ชื่อว่า bgx นะคะ เพราะมันเคลื่อนไปทางขวา ตำแหน่งของ แกนก็คือแกน x แกน ก็คือเป็น Column ไม่ได้อยู่ในแนวคอลัมน์ เพราะฉะนั้นต้องเลือกตัวแปรที่เป็นแกน bgx เท่ากับ เท่ากับ - = ใช้เครื่องหมาย -= นะคะ แล้วก็ BG Velo ใส่เครื่องหมายลบก่อน ลบเท่ากับB G B โลมาใช้ วันนี้ยังไม่ทันนะคะ มันยังไม่จบ โค้ดมันยังไม่จบ ยาวหน่อยเพราะว่ามันขึ้นซึ่งระบุว่าถ้าเกิดเหตุการณ์อย่างนี้แล้วกดปุ่มนี้สิ่งที่จะทำก็คือให้แสดงไอ้ background ที่มันเคลื่อนให้ background มันเคลื่อนนะคะ แต่ตอนนี้เรายังไม่ได้สั่งให้แสดงกำหนด มัน ทีนี้ตรงส่วนที่จะแสดง ก็คือตัวนี้ screen blit background เรา Color เราไม่ใช้แล้วนะคะ เดี๋ยวจะลบออกกดกดลบทิ้งได้เลยเด็ก ๆ ตัวนี้เราไม่ใช้แล้ว เช่นเดียวกัน ตัวแปรก็ลบออกเลยนะคะ BG Color เราไม่ใช้เพราะเราใช้อะไรคะ ใช้แบล็คกราวที่เป็นรูปภาพไปแล้วลบซะพี่จะได้ลดลง ลบ 2 ตัวนะ ลบ background Color เรียกใช้ background Color ลบออก ทีนี้ตำแหน่งที่จะมาเปลี่ยนนะคะ ก็คือเปลี่ยนจาก 00 นี่ ไปเรียกใช้ตัวแปร แกน x Bgx นะ MB และเลือก dgsก็นั่นก็คือB B G Y เห็นไหมคะ แต่สิ่งที่อยู่ในวงเล็บจะเปลี่ยนเป็นไม่ใช่วงเล็บเล็กย่างนี้นะคะ เด็ก ๆ ดู เปลี่ยนเป็นอะไรล่ะ วงเล็บที่เป็นสี่เหลี่ยมน่ะ แทน ไม่ใช่ไม่ใช่ปีกกานะ ก็ไม่ใช่กดยังไงกดธรรมดาอย่างนี้นะคะ เป็นตัวนี้นะลูกเป็นสี่เหลี่ยมอย่างนี้นะ ต่างกันนะ ไม่ใช่ไม่ใช่วงเล็บอย่างนี้ นึกออกนะ วงเล็บที่เป็นรูปสี่เหลี่ยมอย่างนี้ เห็นไหมเด็ก ๆ เห็นไหมอยู่ตรงตำแหน่งปุ่ม ปุ่มที่อยู่ตรงจากแถวตัวเลขลงมาน่ะ อยู่ตรงตัว ฐ ฐาน บ ใบไม้ กับ ล ลิงไหมคะ นะคะ เปลี่ยนนะคะ เปลี่ยนเป็นวงเล็บที่เป็นรูปสี่เหลี่ยมนะคะ เพราะเราเราเรียกใช้ตัวแปร แทนกำหนดค่า โอเคนะคะ ส่วนต่อไป ต้องมากำหนดต่อให้ไอ้ตัว ตัวฉากมันไหลไปเรื่อย ๆ เพราะเมื่อกี้เมื่อกี้มันแค่กด 1 ครั้ง มันก็จะเคลื่อนไป 1 ครั้ง แล้วก็ไหมคือตัวนี้นะคะ กำหนดเงื่อนไขให้ Background เคลื่อนไหวไม่สิ้นสุด นี่ เขาบอกเคลื่อนไหวไม่สิ้นสุดนะคะ เด็ก ๆ ไปที่ตำแหน่งของ ต่อจากนี่นะ ดูตำแหน่ง if นะคะ ตำแหน่ง if จะอยู่ตรงกับเลื่อนเข้าไปจาก2 if แรก 1 อันนะคะ ดูดี ๆ นะคะ มี 2 Ep แรกใช่ไหมเลื่อนไปครั้งที่ 1ตำแหน่งที่ 2 ไม่ใช่อยู่ตรงกับตำแหน่งนี้แล้วก็เลือก if condition เหมือนเดิมนะคะ นี่นะคะ จะอยู่ตรงตำแหน่งนี้นะคะ ดูตำแหน่งดี ๆ นะ เพราะพากย์ไทยวางตำแหน่งโครงสร้างมันไม่ถูกนี่ นึกออกเนาเจ้าน้องอีฟมันจะงงนะมันจะบอกถ่ายตรงไหนเนี่ยทำไมมันใส่ตรงนี้มันไม่ใช่มันไม่ใช่จะบอกเรานะ คำสั่งเงื่อนไขแรกนะคะ if ตัวแปรที่ชื่อว่า bgs bgs ค่ะ กำหนดค่าให้ Bgx = = ลบคอลัมน์เราอะนะ เห็นไหม 1,600 ครึ่งนึงของ 1,600 ก็คือ 800 -800 หาร 2 ว่าอย่างนั้นเถอะ ค่า bgx นี่นะคะ มันเท่ากับ - 800 เมื่อไหร่ บอกแล้วถ้าเป็นคำสั่งอีฟอย่าลืมปิดด้วยโคลอนเสมอ มาที่ pass กด delete delete Pass ออกนะคะ คำสั่งต่อมากำหนดให้ P x = 0 ในเงื่อนไขเป็นอย่างนี้ยังงงนะเด็ก ๆ นะ เพราะมันเป็นเงื่อนไขไง มันคืนค่ากลับไปกลับมาอย่างนี้นะคะ สิ่งที่เราจะต้องทำต่อมา ก็คือไปเรียกใช้ตัวนี้นะคะ เหมือนเดิม ต่อจากบรรทัดที่เราเรียก background ไอ้นี่แล้วนะคะ กด s เพื่อเลือก screen คำสั่งสกรีนนะคะ เรียกใช้ฉากนี้บิวกด B เลือก Buildใส่วงเล็บ แล้วใส่ เรียกใช้ bgpic เหมือนเดิม ตัวแปรมีกี่ bgpic นะคะ ก็คือรูป background เราใส่โคลอนไม่ใช่สิโคลอนนะ แล้วก็ตามด้วยวงเล็บสี่เหลี่ยมนะคะเด็ก ๆ เผลอกดไอ้นี่ทุกทีเลย วงเล็บสี่เหลี่ยมไม่ต้องกด Shift ท่องไว้ท่องไว้ พิมพบีแล้วเลือก bgs ค่ะ ถ้าของ BTS ให้เพิ่มเข้าไปบวกเข้าไป 800 ใส่เครื่องหมายบวก แล้วก็ใส่ตัวเลข 800 ลงไป อยากเรียก bgy มาใช้งาน BG เลือก y เลือก B G Yตอนนี้เราจะมีโค้ดเพิ่มมาอีก 2-3 บรรทัดนะคะเด็ก ๆ เอาลองกด ctrl B ดูอาจจะขึ้น Error ก็ได้ กด Control b ก่อย ctrl แล้วก็ B แล้วกดแป้นดู จะได้ไหม เห็นอะไรไหมเ ห็นไหมตัวฉากน่ะ มันเลื่อนใช่ไหม คือ รอยต่อฉากอาจจะไม่เนียน ก็คือตำแหน่งที่เราไปตัดมันน่ะค่ะ -800 อะไรอย่างนีเ ดี๋ยวจะลองตัดที่มันไม่ใช่ - 800 ดู เดี๋ยวขอลองนะคะ ขอลองเป็น - 1,000 ขอเปลี่ยน ขอเปลี่ยนตัวเลข นี่เห็นไหม ตำแหน่งที่ภาพมันตัดมันไม่ต่อใช่ไหม เพราะฉะนั้นเ ราก็เลือกตำแหน่งที่ตัด เท่ากับอะไรคะ แกน x เรา กันเองเราคือเท่าไหร่ 1,600 เราคือ 1,600 เพราะฉะนั้น ตรงนี้เราก็ต้องเข้ามันนั่นแหละ มันจะได้เนียน ๆรอยตัดมันจะได้เนียน ๆ นึกออกไหม เอาใหม่นะ Control Bใหม่แป้นเหนื่อยไหมมันเริ่มใหม่ไปนะคะ มันจะมีเว้นนิดนึงเพราะฉะนั้นเราควรจะเพิ่มเพิ่มตำแหน่งตรงนี้เข้าไป นี่ เห็นไหมคะ รอยต่อมันไม่เนียนเนาะ เพราะฉะนั้นส่งตำแหน่งปัดหน้าจะเป็น 1599 แล้วก็ไอ้นี่ลบที่ 1600 อาจจะสลับนะคะ 1600 ให้เด็ก ๆ ดูที่อะไร ดูที่ ตัว screen ของตัวเอง อันนี้ไม่หรอกเนาะค่าตัวเองเท่าไหร่ดูดี ๆ นะคะ เทียบกับตอนนี้เอาลูกลบอันนั้นแล้วเพิ่มอันนี้ป่ะ 1599ลองได้มันลองได้ นี่ เห็นไหม มันมีรอยต่อนิดหนึ่งนี่ เราจะต้องทำให้มันพอดีกันเด๊ะ ฉะนั้นไอ้นี่ก็ต้องเริ่ม 1599 เหมือนกันไหม นี่ ๆ เห็นไหม รอยตัดหายไปแล้ว มันมีมีอะไรล่ะ มันมี มันมีส่วนขาดส่วนเกินนิด ๆ หน่อย ๆ นะคะ เราเคลียร์เราก็ต้องทวนอย่างนี้แหละนะคะ เรายืมภาพเขามาใช้ไงมันก็เลยไม่เป๊ะ เคลื่อนที่เร็วหรือเคลื่อนช้าขึ้นอยู่กับเลขตัวนี้นะคะ เลข ไอ้ 5 ไอ้ 6 ไแ้ 10 นี่ จะให้ดู น้องวิ่งเป็นจรวดเลยใส่ 10 เข้าไป ก็คือถ้าเป็นวิ่งเราอาจจะเพิ่มความเร็วได้ เห็นหรือเปล่า ใครไม่เคลื่อนยกมือ อันดับแรกเช็ก เช็กโค้ดดิงเราก่อนนะคะ สิ่งที่เด็ก ๆ จะต้องมี เงื่อนไขแรก ดูบรรทัดนี้ใน loop จาก faultเราเพิ่มเงื่อนไขในการกดแป้นใช่ไหมเอาไป 2ทั้งหมดกี่อัน123ตามเงื่อนไขนี้จะต้องมี จากของข้าพเจ้าเป็นเดิมข้าพเจ้าว่าลดลงมากหน้าเหมือนเดิมนะครับ BG Velo นี่ คือความเร็วของการเคลื่อนที่จากเรานั่นเองนะคะ เด็ก ๆ ตำแหน่งค่าตัวนี้บอกแล้วว่าให้เด็ก ๆ ดูที่คำสั่ง ตัวแปรที่ชื่อ screen ของเรานี่ ที่เราเซฟไว้เราเไว้เท่าไหร่เด็ก ๆ บอกแล้วนะคะ ถ้าอะไรขึ้น Error อันดับแรกดูที่บรรทัดที่มัน Error นะ สังเกตนะคะ ตำแหน่งที่ผิด ถ้าใช้ sublime บรรทัดมันจะบอก นี่ ดูตรงนี้เขาผิดนี่ เด็ก ๆ เวลา บอกและเวลาเวลาเราทำไมไอ้นี่ บางคนมาทีหลังแล้วไม่ทัน พอมาดู if มันอยู่ตรงตำแหน่งนี้ เด็ก ๆ จะชอบไปใช้วิธีกด Space Bar เอากด Space Bar เดี๋ยวดูนะคะ Control B ดูตำแหน่ง Error มันจะชี้ เลย บรรทัด แล้วให้เด็ก ๆ ดูตรงข้อความนะลูก นี่ ถ้ามันขึ้นว่า นี่ tab error ถ้าขึ้น tab Error ให้เด็ก ๆ เช็กตำแหน่งตรงนี้เลยนะคะ ถ้ามันขึ้นจุด ๆ อย่างนี้แสดงว่าเด็ก ๆ ไปกด Space Bar ไม่ได้กด Tab ได้ เห็นไหม ตำแหน่งบรรทัดมันจะบอกชัดเจนเลยว่าอยู่ตำแหน่งไหนสิ่งที่ผิดคืออะไร โปรแกรม sub lime มันจะแจ้ง Error บอกตำแหน่งบรรทัดบอกสาเหตุที่ Error เสมอ ให้ดูตรงนี้ด้วยประกอบกันนะคะ เราก็ต้องกด delete ลบออกแล้วก็กดแท็กไปให้ตำแหน่งมันตรงแค่นั้นเองแล้วก็กด Ctrl+B ใหม่ แล้วเจอได้นะคะ เออดี ๆ นะคะ ของใครยังไม่ออกอีกใครยังไม่สามารถเดินได้ ไม่หอนสิ ดูบรรทัดที่ Error คือ LINE 33 LINE 33 ตรงตำแหน่ง Error บอกว่า name error ยังไม่ได้ประกาศตัวแปรนี้หรือ BGY นี่ มันไม่รู้จัก เพราะฉะนั้นต้องย้อนขึ้นไปดูที่ตำแหน่งที่ นั่น เห็นไหม ประกาศตัวแปรปซ้ำ ชื่อตัวแปรบอกแล้วว่าตัวแปรจะมีชื่อได้แค่ 1 นะคะ ชื่อมันยังไม่ซ้ำ กด ดูตำแหน่งตัดต่อรูปด้วย เห็นไหม มันตัดไม่เนียนนี่ ก็ต้องนึกออกนะ ให้มาเช็กว่าอาจจะเริ่มหยุดไม่ได้ แสดงว่ามันลืมคีย์นี้เปล่า screen blit นี่ไง เดี๋ยว ๆ pic + 800ลบ 805ขายเกมEvent Gas K_DOWN K_RIGHT ไม่ขึ้น error เสียด้วย ไม่ได้ ไม่เป็นไร ไม่ได้ไม่เป็นไร ให้เช็กตรงนี้แค่นั้นพอเช็คว่าดูรูปนะตำแหน่งรูปให้เขากด Ctrl+B ใหม่ Ctrl+B เห็นไหม ตำแหน่งที่ปักรูป ดูยังไงดูตรงนี้ที่เปลี่ยนน่ะเห็นไหมน ี่แม่บอกว่าองค์ฟิล์มตัวเองตั้งไว้เท่าไร เพราะฉะนั้น ตรงนี้ ตรงนี้แก้เลข ตรงนี้ไหม ใช่ไหมรูปมันสูงสุดก็คือความกว้างมันสูงสุด 1,200 ลองแก้ แก้เป็น 12 Ctrl+B ใหม่ กดเลื่อน แล้วทีนี้ตำแหน่งนี้ เห็นไหม ถ้าเราตัดตรงนี้ มันมาตรงนี้เราอาจจะตัดให้มันเกินนี่มาอีกสักหน่อยหนึ่ง ลองเพิ่มจาก 800 เป็น 1000 สิ ลองเพิ่ม Ctrl+B ใหม่ นี่ นะ ก็คือให้ให้นึกถึงว่า 1000 มันเยอะไป 900 900 อยากได้ใบไม้ให้เขาลองปรับลดไอ้ค่าตรงนี้ ก็คือให้รอยต่อของรูปมันดูเนียนน่ะลูุก ไม่ใช่ตัดแล้วต้นไม้ขาดครึ่งภูเขาขาดครึ่งอาจจะมาเริ่มที่ภูเขาก็ได้อะไรอย่างนี้นะคะ เวลาเวลาตัดตำแหน่งรูปนึกออกนะ เหมือนที่บอกอ่ะค่ะ นึงเช็กรายเช็คตำแหน่งความกว้างของทีมเราเนาะถ้าถ้าตรงนี้เราจะตัดตรงนี้ที่เท่าไร ลองใส่เข้าไปดูนะคะ แล้วก็มาเช็กตำแหน่งตรงนี้นะคะ ตำแหน่งที่จะตัดน่ะ ตัดภาพนะคะ ทีนี้ บางคนนะคะ ทำภาพไม่สมดุลพี่ถามตัวเองเกมมันตัวใหญ่ชื่อ เหมือนให้นึกถึงอ่ะเพราะเอาเกมเข้าไปอยู่ในฉาก ตัวเกมปาเข้าไปครึ่งฉากแล้ว พอใส่ความเร็วเข้าไป นึกออกไหม 5 วินาที 5 วินาที แต่เช้าแล้วก็เกมมันยาวมันก็เดี๋ยวหาให้พ่อนั้นให้เขาไปขยายขยายพื้นที่ฉากค่ะ เพราะตัวเลขเราปรับค่าได้นะคะ เห็นไหม อย่างแม่ใช้ฉากยาวเลยนะคะ อันนี้ เห็นไหม มันก็ไปได้เรื่อย ๆ ความเร็วใช่ไหมคะ คือ ขนาดตัวของเจ้าเกมเรากับฉากเรามันก็ควรจะสอดคล้องและให้เด็ก ๆ ดูการตัดภาพด้วยเห็นไหมไม่ออกมาลูกถ้ามันตัดไม่สวยนี่ เราอาจจะเลือกตัดค่านี้ออกไป นึกออกนะคะ ให้ดูให้มันแมตช์กันด้วยให้มันเนียนให้ภาพเนียน ๆ คือ เหมือนเพียงภาพนี้มันมีจุดเด่น คือ ไอ้ต้นไม้ใหญ่น่ะ พอตัดไปมันมันเลยไม่เนียน นึกออกไะ ไม่เป็นไรบอกถ้าเราเอามา Test โปรแกรมเราเฉย ๆ นะคะ คือเวลาเราไปทำเกมจริง ๆ เนี่ยฉากเราก็ควรจะวาดเอง เพราะเราจะรู้ว่าไอ้ฉากต่อไปเพื่อจะให้มันเคลื่อนนี่ ลักษณะของของต้นไม้มันจะควรจะเป็นไซซ์เท่า ๆ กันและจัดวางตำแหน่งเท่า ๆ กัน การต่อฉากมันก็จะไปต่อต่อกัน ตอนนี้เราไปยืมเขามาเพราะฉะนั้น หมดขวดหิวเนี่ยต้องเป็นโขดหินมาต่อใช่ไหม มันกลายเป็นไม่ต่อกันน่ะ มันไม่ต่อเนื่องอ่ะค่ะ ภาพมันไม่ต่อเนื่อง นึกออกนะ อยากให้รู้ไว้ว่ามันคือหลักการในการทำนะคะ ยังไม่เสร็จนะ นี่พึ่งขึ้นแค่ให้ฉากมาเคลื่อนเองนะคะ เดี๋ยวสัปดาห์นี้เราจะพอแค่นี้ก่อน เพราะบางคนยังมีพื้นหลังนะ ยังมี background ต้องไปเอาออก บางคนตัวเกมตัว Big เริ่มเพิ่มเลยนึกออกเนาะลดไซส์เกมลงไม่นึกถึงความสมดุลนะลูกอย่าเหมือนแมวแล้วแม่ก็ยังใหญ่อยู่แม่ก็ต้องลดลงเนาะ ต้นไม้กับแมวตัวเท่ากันใช่ไหม มันก็ไม่ใช่ไหมคะ นะคะ นะคะ เราก็ต้องปรับสมดุลของภาพ ของเกมมันสอดคล้องกันด้วยนะคะ เพราะฉะนั้น บางฉากมันตัดแล้วมันไม่เนียน เราอาจจะหาฉากมาเปลี่ยนก็ได้นะเด็ก ๆ ไม่ต้องหาฉากที่มันมันเป็นในระนาบหรือแนวเดียวกัน แล้วไม่มี พอเอามวางแล้วไม่เห็นรอยต่อชัดเจน เหมือนอย่างนี้มันระนาบเดียวกันก็จริงแต่มันมีหลักคือต้นไม้ใหญ่ที่มันมาเพิ่มกับก้อนหินนี่ มันไม่ต่อเนื่องบางทีเราอาจจะตัดภาพเฉพาะตรงนี้ก็ได้ก็ เพื่อให้มันเห็นอันนี้พื้นมันก็เป็นแนวเดียวกันมันก็จะดูบอกกันก็ได้แล้วอาจจะต้องไปถ้าพี่เอามาใช้ประกอบสักเล็กน้อยด้วยนะคะ เพราะตัวนี้ ตัวเกมมันจะไม่นิ่ง ๆ อย่างนี้ เพราะเมื่อกี้เรา เราไปownload Sprite มาแล้ว ทีนี้เราจะให้เห็นว่าไอ้ตัวเกมอ่ะมันมีท่าทางการเดินจริง ๆ ซึ่งจะไปในสัปดาห์หน้าเพราะฉะนั้นในสัปดาห์นี้อย่าท้ายชั่วโมงรูปไทยที่ยังมี Background ไซซ์ตัวเกมเรายังใหญ่เด็ก ๆ จะต้องปรับขนาดให้มันเท่ากันให้หมดทุกตัวก่อนนะลูกนึกออนะ เช่นเหมือนเหมือนนกของเจ้ากุ้งเต้นมันใหญ่ กุ้งเต้นทำนกไม่ใหญ่ใช่ไหม กุ้งเต้นต้องไปตัดไซซ์ตัวอื่นด้วยไม่ใช่ป่ะแค่ตัวเดียวเข้าใจนะคะ มันจะมีตัวที่ 1 ตัวที่ 2 ตัวที่ 3 ใช่ไหม Collection กุ้งเต้นจะต้องปรับตัวอื่น ๆ ให้มันได้ขนาดเท่ากับไอ้ตัวแรกไม่อย่างนั้นให้นึกถึง เวลาเราให้แกมันเคลื่อนไหว เดี๋ยวมันจะกลายเป็นตัวเล็กตัวใหญ่ตัวเล็กตัวใหญ่ นึกออกไหม เพราะเราปรับรูปไม่เท่ากันไงลูกนึกออกไหมถ้ามันมาต่อต่อกันใช่ไหม มันจะกลายเป็น เดี๋ยวตอนนี้ตัวเล็ก ทำไมกระโดดมาทำไมมันตัวใหญ่ เราไม่ใช่อย่างนั้นเป็นตัวเล็กแล้วก็เป็นตัวใหญ่อันนี้คือเกมเราจะไม่เห็นว่าจับตัวเนี้ยแล้วมันวิ่งมันเดินไม่เห็นการเคลื่อนไหวของมันก่อนนะคะ ถ้าทำไอ้เอฟเฟกต์ที่ว่าตัวเล็กตัวใหญ่นั่นก็คือหมายถึงว่าเราต้องการจับตัวเล็กเราก็ต้องเพิ่มไซส์ให้เป็นตัวใหญ่นะทำอย่างไร เหมือนมาริโอ้นะ พี่ที่พอกินกินอะไรเข้าไปแล้วตัวใหญ่ขึ้นเข้าใจเนาะถ้าอย่างนั้นน่ะ ไม่ใช้เทคนิคที่บอกว่าภาพเล็กกลายเป็นภาพใหญ่แต่ตอนนี้เราจะให้เห็นว่าไอ้ภาพนี้ไอ้ตัวนี้มันเคลื่อนเคลื่อนไหวโดยการเดินหรือการวิ่งหรือ อะไรก็แล้วแต่เนี่ย ตัวเท่าเนี้ยมันเดินไปยังไงมันวิ่งไปยังไงให้เห็นมุมมองนี้ก่อน เพราะฉะนั้น สัปดาห์นี้เด็ก ๆ จะต้องเคลียร์ลูกที่จะใช้ให้เรียบร้อยซะก่อนนะคะ เพราะสัปดาห์หน้า คือ ก็จะพาเรียกใช้รูปในกลุ่มนี้ทุกรูปเลย จะเรียกอย่างไร เราจะสร้าง เขาเรียกว่าสร้างฟังก์ชัน เพื่อให้มันมาเรียกใช้ไอ้รูปที่เรามีเยอะ ๆ นี่นะคะ ไม่อย่างนั้น เราต้องมาเขียนไงไม่บอกมีลูกเยอะ ๆ ซึ่งมันไม่ใช่วิธีการเขียนโปรแกรมโปรแกรมมันจะต้องลดขั้นตอนการคีย์เพื่อเรียกใช้ลูกเมื่อคืนเราจะเรียกใช้มันแค่ครั้งเดียวแล้วเราอาจจะสร้างมันเป็นฟังก์ชันเพื่อไปเรียกใช้ในครั้งหน้าได้อีกนะคะ โอเคนะคะ สัปดาห์นี้เราจะพอแค่นี้นะคะ อันดับแรกอย่าลืมไปแก้รูป ใครมีพื้นหลังให้ออก ใครรูปตัวการ์ตูนใหญ่อยู่ ลดไซซ์ให้มันเท่ากันปรับไฟมันเท่ากันทุกตัวนะคะ เราจะใช้ทั้งเซตเลยนะทั้งเซตที่อยู่ในในตัวนี้เราอ่ะในโฟลเดอร์เรา นึกออกไหมลูก มี 12 รูปเราก็ต้องแก้ทั้ง 12 ลูกนะคะ ให้มันไปในแนวทางเดียวกัน เพราะวิธีการแก้มันก็ทำซ้ำเหมือนเดิม เพียงแต่เปลี่ยนแก้ไปทีละรูป แค่นั้นเองนะคะ โอเคนะคะ อย่างนั้น สัปดาห์นี้พอแค่นี้ สวัสดีค่ะ ทุกคนทำออกได้หมดแล้วนะคะ อย่าลืม save ไว้ก่อน ปิดได้เลย ปิดได้เลย ว่าอย่างไร ว่าอย่างไร จะถามหรือเปล่า