การเขียนโปรแกรมด้วย Scratch

วิทยาการคานวณ ช้ันมธั ยมศกึ ษาปีท่ี 1 การเขียนโปรแกรมด้วย Scratch รายวชิ าพืน้ ฐานวิทยาศาสตร์ เทคโนโลยี (วทิ ยาการคานวณ)

จดุ ประสงค์การเรยี นรู้ 1. ใช้โปรแกรม Scratch เบื้องต้น 2. อธบิ ายการทางานทมี่ ีการวนซ้า 3. เขียนโปรแกรมโดยใช้บล็อกคาสั่ง repeat

1 01 รจู้ กั โปรแกรม Scratch โปรแกรม Scratch เป็นโปรแกรมโอเพนซอรส์ (Open-source software) พฒั นาโดยนักวจิ ัยท่หี อ้ งปฏบิ ัตกิ ารส่ือ (MIT Media Lab) สถาบนั เทคโนโลยแี มสซาชูเซตสป์ ระเทศสหรัฐอเมรกิ า Scratch ออกแบบมาใหใ้ ชก้ ับ เด็กอายุ 8-16 ปแี ละเปน็ ทางเลือกที่ดใี นการเขยี นโปรแกรมสาหรับผเู้ ร่มิ ตน้ ปัจจบุ นั Scratch พฒั นาถึงเวอรช์ ัน 3.0 ผใู้ ช้สามารถเขยี นโปรแกรมออนไลน์ หรอื ดาวนโ์ ปลดโปรแกรมมาใชท้ ่ีเครือ่ งคอมพวิ เตอรแ์ บบออฟไลน์ เน่อื งจากโปรแกรม Scratch เปน็ โปรแกรมภาษาเชิงกราฟกิ จึงทาให้ ใชง้ านงา่ ยสามารถสร้างสคริปตห์ รือโปรแกรมท่ีประกอบด้วยบล็อกคาสัง่ ต่าง ๆ มาวางตอ่ กนั เปน็ ลาาดับโดยไมต่ อ้ งกงั วลกบั การพมิ พค์ าสั่งผดิ พลาดหนา้ ต่าง โปรแกรม Scratch ดงั รูปที่ 1.1 รูป 1.1 หนา้ ตา่ งโปรแกรม Scratch

2 เริม่ ต้นกบั โปรแกรม Scratch ในบทน้จี ะแนะนาการใชง้ านโปรแกรม Scratch แบบออฟไลน์ท่ีต้อง ตดิ ตั้งไวท้ ี่เครอ่ื งคอมพิวเตอรห์ ากนักเรยี นยังไมม่ ีโปรแกรมสามารถทาได้โดยเข้า ไปทเี่ วบ็ ไซต์ http://scratch.mit.edu/ แลว้ เลือก Offline Editor ซึ่งจะอยใู่ น ส่วน Support ดา้ นล่างของเวบ็ เพจดังรูป 1.2 รปู 1.2 Offine Editor สาหรบั Scratch 2.0 หลังจากน้นั จะปรากฏหนา้ ตา่ งใหด้ าวน์โหลดดังรปู ที่ 1.3 รูป 1.3 หนา้ ต่างดาวนโ์ หลด Scratch 2.0

3 ขนั้ ตอนการตดิ ตัง้ โปรแกรม ข้นั ตอนท่ี 1 ตดิ ต้งั โปรแกรม Adobe AIR โดยคลิกดาวนโ์ หลดเลอื ก ใหเ้ หมาะสมกบั ระบบปฏบิ ัตกิ ารท่ใี ชซ้ ึ่งจไดไ้ ฟล์ AdobeAIRInstaller.exe หลงั จากนั้นให้ดับเบิลคลิกโฟลเ์ พื่อตดิ ตง้ั โปรแกรม ข้ันตอนที่ 2 ติดต้งั โปรแกรม Scratch โดยคลกิ ดาวนโ์ หลดเลอื กให้ เหมาะสมกับระบบปฏบิ ตั ิการท่ีใช้ซ่ึงจะไดไ้ ฟล์ Scratch-456.0.4.exe หลังจาก น้ันใหค้ บั เบิลคลกิ ไฟลเ์ พ่อื ตดิ ต้ังโปรแกรม (ช่อื ไฟลโ์ ปรแกรม Scratchอาจ แตกต่างกันเน่ืองจาก Scratch จะถูกปรบั ปรงุ ใหท้ ันสมยั อยู่เสมอ) สาหรบั ส่วนที่ 3 Support Materials เปน็ ส่วนของเอกสารให้ ความรู้และตวั อยา่ งโปรแกรม

4 สว่ นประกอบหลกั ของหน้าต่างโปรแกรม Scratch หน้าตา่ งโปรแกรม Scratch ทีป่ รากฏจะมีลกั ษณะคลา้ ยโปรแกรมอน่ื ทม่ี เี มนใู หใ้ ชง้ านและพน้ื ทใี่ นการทางานซง่ึ มสี ว่ นประกอบหลักในการทางาน 3 ส่วนคอื เวทีตวั ละครและสครปิ ตด์ ังรปู 1.4 รปู 1.4 ส่วนประกอบหน้าต่างโปรแกรม Scratch 1. เวที (stage) เปน็ พื้นทสี่ าหรบั แสดงผลลัพธก์ ารทางานเม่อื ต้องการรนั โปรแกรมให้คลกิ ปุม่ ธงเขียวและถา้ ต้องการยกเลิกใหค้ ลิกป่มุ หยดุ นอกจากนนี้ กั เรยี นยังสามารถกาหนดส่วนประกอบต่าง ๆ ของพน้ื หลงั เวทไี ดเ้ ชน่ เลอื กภาพพ้ืนหลงั เลือกเพลงประกอบซึ่งกาหนดไดโ้ ดยคลิก เลือกเคร่ืองมือ มมุ ลา่ งซา้ ยของหน้าตา่ งโปรแกรม

5 2. ตวั ละคร (sprite) ในโปรแกรม Scratch สามารถกาหนดใหม้ ีตัวละครได้ หลายตวั ละครแต่ละตวั จะมีข้อมูลสว่ นตวั ทแี่ ตกต่างกนั เช่น ช่ือ ชุดตวั ละคร ทศิ ทางการเคล่ือนที่ พกิ ัดของตาแหน่ง โดยชุดตัวละครจะหมายถงึ เครอ่ื งแตง่ กาย และทา่ ทาง 3. สคริปต์ (script) เปน็ พนื้ ทที่ ่ีใช้สาหรบั เขียนโปรแกรมดังรูป 1.5 ซ่งึ ประกอบดว้ ย 3.1 บล็อกคาสั่งแต่ละบลอ็ กถูกจดั อยู่ภายในกลมุ่ ที่ทาหน้าท่ีท่ี เกี่ยวขอ้ งกันโดยมที ้งั หมด 10 กลุ่มและถ้าคลิกทกี่ ลุ่มบลอ็ กใดก็จะปรากฏบลอ็ ก คาส่ังภายในกลมุ่ น้ัน 3.2 พนื้ ทเ่ี ขียนโปรแกรมผใู้ ชส้ ามารถลากบล็อกคาส่ังท่ีตอ้ งการมา วางเรยี งตอ่ กันในพืน้ ทเี่ ขยี นโปรแกรม รปู 1.5 สว่ นสคริปต์

6 ตวั อย่างที่ 1 เริ่มตน้ กับ Scratch ด้วยการเขยี นโปรแกรมใหต้ วั ละครแมวเดนิ สรา้ งโปรแกรม Scratch ให้ตัวละครแมวเดนิ มีข้ันตอนดงั นี้ 1) เปิดโปรแกรม Scratch จะปรากฏตัวละคร Sprite1 ที่เปน็ รปู แมว 2) คลิกแท็บ Costumes จะปรากฏชุดตวั ละคร 2 ชุด คอื costume1 และ costume2 ใหส้ งั เกตวา่ ชุดตวั ละครมลี ักษณะทา่ ทางการกา้ วเดินของแมวที่ แตกตา่ งกนั ดังรปู 1.6 รปู 1.6 ชดุ ตัวละคร 3) คลกิ แท็บ Script แลว้ เขียนโปรแกรมโดยลากบลอ็ กคาส่งั วางใน พน้ื ท่เี ขียนโปรแกรมดังน้ี

7 4) รันโปรแกรมโดยคลกิ ปุม่ สงั เกตผลลพั ธท์ ่ีไดจ้ ะเหน็ วา่ แมวมี ลกั ษณะคล้ายการเดิน 1 กา้ วซงึ่ เป็นผลมาจากคาส่ัง move 10 steps หมายถึง สั่งให้ตัวละครเคล่ือนทีไ่ ป 10 หนว่ ย (การเคลอ่ื นที่ 1 หนว่ ยจะเท่ากับการขยบั ไป 1 จดุ บนหน้าจอ) และคาส่งั next costume หมายถึง เปล่ียนเป็นชดุ ตัวละครใน ลาดบั ถดั ไป 5) ปรบั สครปิ ต์ในขอ้ 3) โดยเพ่ิมบล็อกคาส่งั forever วางให้ครอบ คาสง่ั move 10 steps และ next costume 1 234 6) คลกิ ปุ่มธงเขียว แลว้ สงั เกตผลลพั ธ์ทไ่ี ด้จะเห็นวา่ แมวเดนิ ชนขอบ เวทอี ยา่ งไม่สน้ิ สุด

8 02 การท้างานแบบวนซา้ ในการเขยี นโปรแกรมมหี ลายกรณที ่ตี อ้ งมกี ารทางานซ้า ๆกันซึ่งทา ให้ต้องเขยี นคาสั่งชดุ เดยี วกนั ซา้ กนั หลายครั้งเพือ่ ให้การทางานมีประสทิ ธภิ าพ Scratch มคี าส่ังท่ใี ช้ในการทางานแบบวนซา้ ซ่งึ อยู่ในกลุ่มบล็อก Control ดังน้ี 2.1 บลอ็ กคาสง่ั forever เปน็ คาสัง่ ทีก่ าหนดการทางานแบบ วนซา้ ไม่รู้จบ ตัวอย่างเชน่ 2.2 บลอ็ กคาสั่ง repeat เปน็ คาสงั่ ท่กี าหนดการทางานแบบ วนซา้ ตามจานวนรอบท่กี าหนด ตัวอยา่ งเช่น

9 ตัวอยา่ งที่ 2 วาดรูปสเี่ หล่ยี ม แนวคิดในการวาดรปู สเ่ี หลีย่ มคือต้องวาดเสน้ ตรงแลว้ ต้อง เปล่ียนทศิ ทางการวาดเปน็ มมุ 90 องศาซงึ่ ถา้ สังเกตจะเหน็ ว่าส่วนนมี้ ี การทาซา้ 4 รอบ แตก่ ่อนการสง่ั วาดรปู จะต้องมกี ารล้างหนา้ จอภาพ ใหว้ ่างก่อนแล้วจงึ วางปากกา และกาหนดจุดเร่ิมต้นของการวาด จาก แนวคดิ เขยี นรหสั ลาลองได้ดงั นี้ 1. ล้างจอภาพ 2. วางปากกา 3. กาหนดตาแหน่งเริ่มวาดท่พี กิ ดั (0,0) 4. ทางานต่อไปนี้ 4 รอบ 4.1 ลากเส้นตรง 100 หนว่ ย 4.2 หมุนตามเขม็ นาฬกิ า 90 องศา โปรแกรมมดี ังนี้

10 ผลลัพธท์ ่ีได้ คือ จากตัวอยา่ งที่ 2 อธิบายไดว้ ่า 1. บรรทดั ที่ 1 กาหนดจุดเร่ิมตน้ เมือ่ ผใู้ ช้คลิกธงเขียว 2. บรรทดั ท่ี 2 ล้างหน้าจอภาพ 3. บรรทัดที่ 3 วางปากกา 4. บรรทัดท่ี 4 กาหนดตาแหน่งเร่มิ ตน้ ให้ตัวละครอยู่ท่ีกลาง จอภาพซงึ่ คือตาแหนง่ 0,0 5. กาหนดให้ทาคาสง่ั ภายในบล็อกคาสง่ั repeat จานวน 4 รอบคือคาส่งั บรรทดั ที่ 6 เคลือ่ นท่ไี ปตามทศิ ทางของตัวละครเปน็ จานวน 100 หน่วยและบรรทดั ท่ี 7 หมุนตามเขม็ นาฬิกา 90 องศาซง่ึ จะทาให้ได้รปู สีเ่ หลีย่ ม 1 รปู

11 03 ตัวแปร ตัวแปร (Variable) เปน็ ชอ่ื ทีก่ าหนดขนึ้ เพื่อใช้เกบ็ ขอ้ มลู และ เรยี กใชใ้ นการทางานตา่ ง ๆใน Scratch สามารถกาหนดการใชง้ านตวั แปร เช่นเดยี วกบั ภาษาโปรแกรมอืน่ โดยการสรา้ งตัวแปรทาได้โดยคลกิ บลอ็ ก คาสั่ง ทอ่ี ยใู่ นบลอ็ ก Data ซึง่ จะปรากฏหน้าต่าง New Variable ดงั รปู การตงั้ ชอื่ ตวั แปรควรใชช้ ่ือท่ีมีความหมายสอดคลอ้ งกับ ขอ้ มูล เช่น name ใชส้ าหรับเก็บชอ่ื score ใชส้ าหรบั เกบ็ คะแนน และ price ใชส้ าหรับเกบ็ ราคา และการกาหนดขอบเขตการใชง้ านตวั แปร สามารถ กาหนดได้ 2 แบบ ดงั นี้ - For all sprites กาหนดใหท้ กุ ตัวละครสามารถใชต้ วั แปรนี้ได้ - For this sprite only กาหนดใหใ้ ชง้ านตัวแปรนีไ้ ดเ้ ฉพาะกบั ตัว ละครทีส่ ร้างตวั แปรนเี้ ท่านั้น รูป 1.7 หนา้ ตา่ ง New Variable

12 ถ้าตวั แปรเสรจ็ แลว้ จะมบี ล็อกคาสัง่ ปรากฏขึน้ มาอีก 5 บล็อก ในทน่ี จี้ ะยกตัวอยา่ ง เมื่อมมกี ารสรา้ งตวั แปร count ดงั ตาราง บลอ็ กคาส่ัง ทเี่ ก่ยี วกับตัวแปร count ดังตาราง 1 ตัวแปรสามารถเกบ็ ข้อมลู ไดเ้ พียงคา่ เดียว ณ ขณะใดขณะหนึ่ง แตส่ ามารถเปลยี่ นแปลงได้ ผเู้ ขียนโปรแกรมสามารถกาหนดคา่ ตวั แปรจาก ตัวแปรอื่น หรอื ระบุคา่ โดยตรง โดยใช้บลอ็ กคาส่ัง หรอื กาหนดจากการรบั ขอ้ มูลจากผู้ใช้ โดยใช้บลอ็ กคาส่งั ซง่ึ ค่าข้อมลู ทรี่ บั จากผ้ใู ช้จะถกู เกบ็ ไว้ในตัวแปร เสมอ หากต้องการรับขอ้ มูลจากผู้ใชห้ ลายค่า ผู้เขียนโปรแกรมตอ้ งนา คา่ ในตัวแปร ไปเก็บไวใ้ นตวั แปรอนื่ ก่อน แล้วจึงรบั ขอ้ มลู อื่นจาก ผูใ้ ช้ต่อไป

13 สรปุ ทา้ ยบท โปรแกรม Scratch เป็นโปรแกรมเชิงกราฟิกท่ีใช้งานง่าย สามารถเขียนโปรแกรมเพ่ือส่ังให้คอมพิวเตอร์ทางานได้โดยใช้บล็อกคาส่ัง วางต่อกันเป็นลาดับการเขียนโปรแกรมท่ีเก่ียวกับการคานวณต่าง ๆอาจ จาเป็นต้องมีการตรวจสอบเง่ือนไขการทางานหรือการกาหนดให้มีการวน ซ้าซ่ึง Scratch ก็มีบล็อกคาสั่งต่าง ๆให้ใช้งานท่ีครอบคลุมท้ังการทางาน แบบวนซ้าและมีทางเลอื กรวมถงึ มีตวั ดาเนนิ การตา่ ง ๆให้เลือกใช้ตามความ ต้องการไม่ว่าจะเป็นตัวดาเนินการทางคณิตศาสตร์หรือตัวดาเนินการ เปรียบเทียบโดยถ้าต้องการทางานแบบไม่รู้จบสามารถกาหนดได้โดยใช้ บล็อกคาส่ัง forever หรือถ้าต้องการกาหนดจานวนรอบในการทางานจะ ใชบ้ ลอ็ กคาสง่ั repeat นอกจากน้ันยังมีบล็อกคาสั่งสาหรับการทางานที่ต้องการ ตรวจสอบเง่ือนไขเพื่อเลือกทางานอย่างใดอย่างหนึ่งคือคาส่ัง if, if else และบล็อกคาสั่งที่ใช้สาหรับงานท่ีต้องมีการวนรอบและตรวจสอบไปพร้อม กั น ซ่ึ ง ห า ก เ งื่ อ น ไ ข เ ป็ น เ ท็ จ จึ ง จ ะ ท า ง า น ต า ม ท่ี ก า ห น ด น่ั น คื อ ค า สั่ ง repeat until แต่ถ้าต้องการให้มีการวนรอบการทางานไปจนกว่าจะพบว่า เงอื่ นไขเปน็ จริงจะใชบ้ ล็อกคาสัง่ wait until ในการตรวจสอบการทางานได้