ครับต่อไปก็ไม่ต้องพล่ามกันแล้วครับ เราจะลองมา เขียนโปแกรมกับเจ้า RoboMind กันดูนะครับ หากใครยังไม่ทราบว่า บทความนี้เป็นอย่างไรมาอย่างไร ก็ขอให้ กลับไปดู ฝึกการเขียนโปรแกรม ด้วย Robo MIND ซึ่งเป็นตอนแรกของบทความนี้นะครับ สำหรับในส่วนนี้เราจะทำอะไรบ้าง ตามนี้นะครับ

• Load and install RoboMind
• Example progam

Load and install RoboMind

ครับเราก็จะload เจ้า RoboMind มาติดตั้งบนเครื่องของเราเสียก่อนนะครับก่อนที่เราจะสามารถเขียน code กัน ให้ไปตาม link นี้นะครับ http://www.robomind.net/en/download.html ให้เลือก

นะครับเพราะเราใช้ windows กันเป็นส่วนใหญ่ หากท่าน ใด ใช้ operating system ตัวอื่นก็เลือกเอาเลยครับ ตามที่เราใช้

หลักจาก load ลงเครื่องเราแล้ว ก็ double click บน file ที่เรา load มาได้แล้วนะครับ [ น่าจะชื่อ ว่า RobomindSetup2.x.exe อะไรประมาณนี้ ครับ แล้ว ] แล้วก็รอจนกว่ามันจะดำเนินการเสร็จ ก็จะได้โปรแกรม ลงบนเครื่องเราแล้ว ครั้งแรกมันอาจจะ run ขึ้นมาเลย หลังจาก ลงเสร็จแล้ว พร้อมกับโปรแกรม ตัวอย่างสั้น ๆ

เราลองมาพจารณาการใช้งานพร้อมกับ ดูตัวอย่างไปด้วยกันเลยนะครับ

Example progam

Example โปรแกรม ที่แสดงขึ้นมาพร้อมกับการ แสดงหน้าจอ RoboMind นั้นจะอยู่ช่องด้านซ้ายมือ ส่วนขวามือจะเป็นที่แสดง การทำงานของ เจ้า ROBO และโลกของ มันนะครับน่าจะได้ตามรูป นี้

และมี code ดังนี้ครับ

<pre># Draw a square
 paintWhite()
 repeat(4)
 {
     forward(2)
     right()
 }
 stopPainting()

ส่วนข้อความที่อยู่หลัง เครื่องหมาย ‘#’ เราไม่ต้องสนใจก็ได้นะครับ เพราะมันไม่ถูก นำไปหประมวลผลแต่อย่างได้ นอกจากเป็นการเขียน comment ไว้เป้นคำอธิบาย ครับ

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

เป็นเครื่องมือที่ช่วยให้เรา สั่งให้ code ที่เราเขียนทำงาน ครับ เพียงแค่คลิกที่ปุ่มที่ มี icon สีเขียว หากโปรแกรมไม่มีข้อผิดพลาดอะไร เจ้า ROBO มันจะทำงานตามคำสั่ง ทีละคำสั่งจากบนลงล่างครับ ถ้าเรา พิจารณาจาก code ด้านซ้ายมือนะครับ จะเป็นการสั่งให้เจ้า ROBO มันระบายสีเป็น สี่เหลี่ยม แล้วหยุด โดยที่ เคลื่อนที่ เป็น loop  4 รอบ แต่ละรอบ จะเเคลื่อนไปข้างหน้า 2 step แล้วหัน ขวา ทำให้เกิดเป็น สี่เหลี่ยมเกิดขึ้น ลอง run ดูแล้ว พิจาณาว่าได้ตมที่ผมพูดไหว้หรือป่าว ฮิ ฮิ เดี๊ยวจะหาว่าโม้ เพราะผม run ดูแล้ว

สุดท้านมันก็จะมาหยุดตามรูป ครับ

สังเกตุจากเครื่องมือ นอกจากมันจะสั่ง run ได้แล้ว มันก็ยังสามารถที่ สั่งหยุดระหว่างการทำงานได้ หรือหยุดชั่วคราวแล้ว runต่อก็ได้ สุดหท้ายก็สามารถที่จะ เร่งหรือลด speed ของการทำงานได้ด้วย แหม เจ๋งเป๋งเลยว่ามะ

เราสามารถดูตัวอย่างอื่น ๆที่เขามีมาให้ด้วย ก็ไป  คลิกที่ icon ตามรูปอยู่ด้านบนซ้ายนะครับ

แล้วจะได้หน้าต่างสำหรับการเลือก เปิดไฟล์ขึ้นมาครับ ลองเปิดและ run ดูนะครับ แล้วก็ลองดู code มันว่าพอเข้าใจใหม่นะครับ ในตอนสองนี้ผมยังคงไม่พูดถึงเรื่องการเขียน นะครับ แค่ดูว่า โปรแกรมมันทำอะไรได้บ้างอย่างไร ระหว่าง ที่เรา run โปรแกรมตัวอย่างเราก็ ลองดู function อื่น ดูนะครับว่ามีอะไรบ้างคราว ๆ

บนเมนู ด้านบนจะมีกลุ่มของ เมนูหลัก สำคัญอยู่ 2 กลุ่มคือ Edit และ View

    – Edit ใช้สำหรับการจัดการกับ code ตามรูปนะครับ ความสารถก็เหมือน Text Editor ทั่วไป  copy past select  ค้นหาและ วางแทน อะไรพวกเนี๊ยะก็พอมีให้สามารถแก้ไข code ได้ง่ายครับ

   – View ให้สำหรับจัดการกับ หาจอแสดงผลครับ ก็ zoom in , zoom out  กำหนดการแสดง grid การแสดง radar หรือให้ capture screen ก็ OK นะ

มาดูเพิ่มเติมอีกนิดนะครับ ในหน้า Editor มันจะมี line number ใหัเอาให้อ่าน code ง่าย และยังสามารถแสดง error ที่เกิดขึ้นที่ บรรทัดนั้น ๆ ครับ และแสดงได้ด้วยว่ามันมี error อะไร

ก็น่าจะเป็น ภาพทั้งหมดของเจ้า โปรแกรม RoboMind นะครับ เรื่องการเขียนไว้ต่อกันคราวหน้านะครับ เพราะมันยาวเกินไปแล้ว หากต้องการอ่านล่วงหน้าหรือดูการเขียน ก็เชิญท่านไปสัมผัสกับ ตัวอย่างที่เข้าเตรียมไว้ให้เลยนะครับ ตาม linke นี้เลย

- Example scripts

- ส่วน เรื่อง คำสั่งต่าง ๆ หากต้องการอ่านเพิ่มเตอมก็เชิญตาม link นี้เลยครับ http://www.robomind.net/en/docProgrammingStructures.htm

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

s_teerapong2000@yahoo.com

teerapong Sontayaman

สำหรับผมเองบางทีก็ได้มีโอกาส รับเชิญให้ไปสอนการเขียนโปรแกรมให้กับ เด็ก ๆ ซึ่งก็ได้ประสบการณ์ในการสอนเด็ก ๆ มากพอที่จะทราบว่าการสอนเด็ก ๆ นั้น ไม่ใช่เรื่องง่ายเลย โดยเฉพาะสอนการเขียนโปรแกรมด้วยแล้ว คงไม่ต้องบรรยาย

มีสิ่งหนึ่งที่ผมพอสังเกตได้ก็คือ หากเรื่องหรือเนื้อหาที่เรา จัดมาสอนนั้นสนุกสนาน น่าสนใจแล้วละก็จัดการกับ เจ้าพวกลิงได้ชงัดนัก ฉะนั้นแล้ว ครูอาจารย์ทั้งหลาย ทางเลือกหนึ่งที่ท่านสามารถทำได้ และนำไปใช้ได้ ที่ผมมองเห็นก็เจ้า Robo MIND นี่แหละครับ

pictures from http://www.robomind.net

สำหรับเจ้า RoboMind นี้ เป็นโปรแกรมช่วยฝึกการเขียนโปรแกรมแบบ ง่าย ครับเหมาะสำหรับเด็กที่เริ่มฝึกเขียนโปรแกรม ในระดับชั้นปฐมถึงมัธยม นะครับ ก่อนที่เด็กเหล่านี้จะก้าว ไปเขียน programming language อย่างเช่น c หรือ pascal ต่อไป ในระดับที่สูงขึ้น

ลักษณะของโปรแกรมนั้น จะมี Robot ให้เราควบคุมการทำงานมันด้วย การพิมพ์คำสั่ง ทีละคำสั่งต่อเนื่องกันไป เพื่อให้ Robot น้อยเคลื่อนที่ ไปตามทิศทางที่ต้องการ และทำงาน ต่าง ๆ ตามชุดคำสั่งที่มีให้ ครับ  นอกจากนี้ยังมี คำสั่ง ให้ทำซ้ำ  และทดสอบเงื่อนไข เพื่อการเขียนมีความซับซ้อนเพิ่มขึ้นได้อีก

ผมกล่าวมาแค่นี้ ท่านที่กำลังอ่านอยู่ก็คงจะ Bingo แล้วใช่ไหมครับ มันยอดมากจริง ๆเอาละครับ ลองมาดูรายละเอียดกันหน่อย ครับว่าในบทความนี้จะมีอะไรกันบ้าง

• เรื่องของ หน้าตา และเครื่องมือสำหรับการใช้งาน (development environments )
• คำสั่งพื้นฐาน  (Basic instructions)
• โครงสร้างของโปรแกรม (Programming structures)
• ตัวอย่างโปรแกรม ครับ

หน้าตา และเครื่องมือสำหรับการใช้งาน (development environments )

โปรแกรม RoboMind นั้นสิ่งสำคัญก็คือ การเขียนคำสั่งและ ประมวลผลคำสั่ง ที่จะสั่งการ เจ้าหุ่ยน้อย หรือ เจ้า ROBO   หน้าตาโปรแกรมก็ง่ายๆ ครับ

หน้าจอด้านซ้าย จะเป็นหน้าต่างสำหรับการ เขียน code และหน้าจออีกด้านหนึ่งจะแสดงการทำงานของเจ้า ROBO ครับ เมื่อสั่งให้ run โดยการคลิกปุ่ม play โปรแกรมจะตรวจสอบ code ว่าถูกต้องหรือไม่ก่อน แล้วจึงทำงานให้

หน้าจอด้านซ้ายสำหรับการเขียน code นั้นเราเรียกว่า  Text Editor สว่นหน้าจอด้านขวาที่ใช้แสดงการทำงานนั้นเราเรียกมันว่า  Monitor

Text Editor นั้นมีฟังก็ชั้นการทำงานเพิ่มเติมเช่น

• แสดง line number
• แสดง ข้อความ error ที่เกิดขึ้นได้
• สามารถทำ undo change ได้ไม่จำกัด
• มี function ในการค้นหาและ แทนที่ได้ (สามารถใช้ regular expressions ได้ด้วย)
• ในขณะทำงาน จะแสดงหัวลูกสอนที่บรรทัดที่กำลังทำงานอยู่ได้อีกด้วย

Monitor

• เป็นหน้าจอสำหรับ แสดง การทำงานของเจ้า ROBO และ โลกของมัน
• สามารถ pan และ zoom ได้ และยังสามารถทำ screen shot เก็บไว้ได้ด้วย

การ Execute โปรแกรม

ไม่ต้องทำอะไร มากครับ สามารถสั่งให้ code ที่ถูกต้องแล้ว ทำงานได้ด้วย คลิกเดียวครับ

เราแค่จัดการให้ code คำสั่ง ถูกต้อง ถูกลำดับการทำงานที่ ออกแบบไว้ หากมี error ใด โปรแกรมจะแจ้งให้ทราบและสามารถแก้ไขให้ถูกต้องก่อน ที่จำทำงานจริงทั้งหมด

คำสั่งพื้นฐาน Basic instructions

ประกอบด้วยคำสั่งดังนี้ แยกตามกลุ่มคำสั่ง

• คำสั่งเคลื่อนที่ Move
• forward(n) เคลื่อนที่ไปข้างหน้า n steps
• backward(n) ถอยหลังไป n steps
• left() หมุนซ้าย 90 องศา
• right() หมุนขวา 90 องศา
• north(n) หันหัวไปด้านบน ของหน้าจอ และ เคลื่อนที่ไปข้างหน้า n steps
• south(n) หันหัวลงล่าง ของหน้าจอ และ เคลื่อนที่ไปข้างหน้า n steps
• east(n) หันหัวไปข้างขวา ของหน้าจอและ เคลื่อนที่ไปข้างหน้า n steps
• west(n) หันหัวไปข้างซ้าย ของหน้าจอ และเคลื่อนที่ไปข้างหน้า n steps

• คำสั่งระบายสี Paint
• paintWhite() ลากแปรงสีขาว ไปบนพื้น
• paintBlack() ลากแปรงสีดำ ไปบนพื้น
• stopPainting() หยุดลากแปลง และเก็บแปรงสี

• คำสั่งหยิบ Grab
• pickUp()  หยิบ สิงของที่อยู่ด้านหน้า
• putDown() วางสิ่งของที่ถือไว้ลง

• คำสั่งโยนเหรียญ เพื่อเสี่ยงทาย Flop coin
• coinflip() โดยเหรียญเพื่อ เลือกตัวเลือก

• คำสั่งตรวจสอบ หรือ ตรวจการ See
• leftIsObstacle() , frontIsobtacle(), rightIsObstracle()
• leftIsClear(), frontIsClear(), rightIsClear()
• leftIsBeacon(), frontIsBeacon(), rightIsBecan()
• leftIswhite(), frontIsWhite() , rightIsWhite()
• leftIsBlack(), frontIsBlack(), rightIsBlack()

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

http://www.robomind.net/en/demo.html

ตอนต่อไป เราจะไป load โปรแกรมแล้วลองมาเขียนเล่นกันนะครับ

s_teerapong2000@yahoo.com

ช่วงนี้เป็นช่วงที่ผม เรียนเรื่องการเขียนเกมส์ อืม ไม่ได้ความว่าผมจะไปทำเกมส์ขายที่ไหน หรอก ผมทำงานอยู่ในทีมพัฒนาระบบจำลองยุทธ์ และเราก็เล็งเห็นแล้วว่าอีกไม่นาน เทคโนโลยีที่เราใช้กับ ระบบของเรามันกำลังล้าแล้ว เราก็มองหาเทคโนโลยีที่ดีกว่า ใหม่กว่า และยืนยาวกว่า นั่นเอง

พูดแค่นี้ทุกคนก็คงเห็นด้วยเพราะการจะทำระบบอะไรสักอย่าง เงื่อนไขที่ผมกล่าวถือว่าเป็นพื้นฐานแลกที่เราจะมองกัน แล้วค่อยไปพิจาณาเรื่องอื่น ๆ ต่อไป

ครับเอาเป็นว่า ตัวที่ผมสนใจก็คือ XNA
กล่าวโดยย่อนะครับ XNA เป็น Framework ในการพัฒนาเกมส์ที่ผลิตโดย บริษัท Microsoft แน่นอนครับ มันเป็น เทคโนโลยีที่ทำงานบน .NET Framework ซึ่งตัว XNA นั่นประกอบด้วย library และเครื่งมือ ที่จะช่วยให้ผู้พัฒนาเกมส์สามารถทำงานได้รวดเร็ว และสามารถพัฒนาเกมส์ให้สามารถใช้งานได้ บน Windows Xbox 360 รวมถึง Windows Phone 7 ส่วนในรายละเอียดของ XNA ก็ไปอ่านเพิ่มเติมต่อที่นี่ก็แล้วกันนะครับ  http://en.wikipedia.org/wiki/Microsoft_XNA  [ อะไร อะไรก็ wiki นะครับเดี๊ยวนี้ ]

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

ลองมามองในด้านของ การพัฒนาเกมส์กันบ้างครับ
- เกมส์ programming นั้นจะแตกต่างจากการเขียนโปรแกรม windows  ตามที่เราทราบกันนะครับ การเขียน โปรแกรมบนwindows นั้นเป็นเขียนแบบ event driven หมายถึง code ที่เราเขียน จะอยู่ใน event handler ซึ่งจะถูกเรียกใช้ก็ต่อเมื่อ มีเหตุการณ์อะไรสักอย่างเกิดขึ้น กับ control เช่นการ click mouse เป็นต้น ขี้เกียจ
- เกมส์ programming นั้นเป็น real-time ครับ และก็ไม่มีการรอ event เพื่อการทำงาน  การทำงานจะเป็น loop ที่เราเรียกว่า game loop มีการคำนวณ game status มีการตรวจสอบ input ภายใน loop ในแต่ระรอบของการทำงาน เพราะฉะนั้นการทำงาน programmer จะต้องเขียนโปรแกรมเพื่อ ตรวจสอบ และสั่งการภายใน loop นั่นเองครับ
ดังนั้น typical game loop ประกอบด้วย ขั้นตอน ตามที่แสดงรูปด้านล่าง
จะเห็นว่า loop นั้นเกิดขึ้นใน ส่วนสีเหลือง ซึ่งก็จะมีการรับค่า input คำนวณสถานะต่าง ๆ ของเกมส์ ตรวจสอบ กฎเกณฑ์ต่าง ที่เกมส์กำหนด update ค่า แล้วจึง ให้ feedback กลับไป เช่นการแสดงหล หรือเสียงเป็นต้น ทำอย่างนี้ไปเรื่อย ๆ จนกว่าจะออกจากเกมส์
ส่วน วงรอบเกมส์ของ XNA จะเห็นดังภาพ ครับ

อันที่จริง มันก็ไม่ได้ต่างกัน นัก เพียงแต่ XNA ทำ loop ไว้ให้ โดยทีกำหนดว่า ภายใน update() function ผู้พัฒนาต้อง ตรวจสอบ input คำนวณสถานะ และตรวจสอบ กฎ ต่าง ๆ  และการ feedback ต่าง ๆ ให้ทำใน Draw() function
คงพอได้ concept นะครับ

ลองมาดูการ implement กันบ้างนะครับ

ก่อนที่เราจะทำงาน กับ XNA ได้ก็ต้องมีการ ติดตั้งกันเสียก่อนนะครับ สามารถไป download ได้ที่  http://creators.xna.com/en-US/downloads ตรวจสอบให้ดีนะครับ ท่านควรจะ download version ไหน ขึ้นอยู่กับว่าท่านใช้ visual studio version ไหน ครับซึ่งมันก็หมายถึงท่านใช้ framework version ไหนนั่นเอง 2.0 3.5 หรือ 4.0 ท่าก็เลือก XNA ให้เหมาะสมกับท่าน ได้เลย หลังจากติดตั้งแล้ว ก็มาเริ่มกันเลยนะครับ ( ของผมเองใช้  version 4.0 เพราะผมใช้ visual studio 2010 .Net framework version 4.0  code เป็น C# .net นะครับ)

เริ่มด้วยการ Project ใหม่นะครับ แล้วเลือก Windows Game เราจะพบว่า template ได้มีการสร้าง ไฟล์ให้เรา หลายไฟล์ที่สำคัญก็คือ Game1.cs ซึ่งเป็น file ที่มี game loop และก็ยังมี Content folder ซึ่งมีไว้สำหรับเก็บ พวก resources ต่าง ๆเช่น รูป sprite ที่เราจะใช้งานเป็นต้น

การเพิ่ม หรือ เอารูปที่เตรียมไว้มาใส่ ใน content ก็เพียงแต่ click mouse ขวาที่ content แล้วเลือก “Add/Existing item…” แล้วก็วิ่งไปหา Image file ที่ต้องการ (ship3 คลิก ขวาแล้วเลือก save linke as…)  อ่านตรงนี้ให้ เข้าใจนะครับ เมื่อ เพิ่ม image เข้ามาใน content แล้วลอง click รูปแล้วดู properties จะเห็นว่า มี Asset Name ที่เป็นชื่อของ รูปภาพ ชื่อเหล่านี้จะเก็บไว้สำหรับอ้างอิงในการ เรียกใช้ต่อไป ครับ

สิ่งที่เราต้องการทำใน Project นี้ก็คือการ load ภาพแล้วแสดงในหน้าจอนั่นเอง ครับ ดังนั้นเราก็แค่ ใส่ code ลงใน LoadContent() method เพื่อ load รูป และใส่ code ใน UnloadContent() เพื่อ เอาสิ่งที่ load ออกไป เรายังไม่มีการ ทำอะไรใน Update() เพราะว่าเราแค่แสดงรูปเท่านั้น   และเพื่อแสดงภาพเราก็จะใส code ลงใน Draw() method ตามนี้เลย ครับ

เพื่อให้มันสั้น ผม ลบ comment ออกนะครับ code ที่เราเพิ่มจะอยู่ระหว่าง // — our code #1,2,3,4,5 นะครับ

public class Game1 : Microsoft.Xna.Framework.Game
{
 GraphicsDeviceManager graphics;
 SpriteBatch spriteBatch;
 // -- our code #1 --------------------------
 private Texture2D ship;
 private Vector2 ship_pos;
 // -----------------------------------------
 public Game1()
 {
   graphics = new GraphicsDeviceManager(this);
   // -- our code #2------------------------------
   graphics.PreferredBackBufferHeight = 600;
   graphics.PreferredBackBufferWidth = 800;
   Window.Title = "Game Test ver. 1.0 - Teerapong S.";
   // ------------------------------------------
   Content.RootDirectory = "Content";
 }

 protected override void Initialize()
 {
   // TODO: Add your initialization logic here
   base.Initialize();
 }

 protected override void LoadContent()
 {
   // Create a new SpriteBatch, which can be used to draw textures.
   spriteBatch = new SpriteBatch(GraphicsDevice);

   // TODO: use this.Content to load your game content here
   // --- our code #3 ------------------------------------
    ship = Content.Load<Texture2D>("ship3");  // using asset name นะครับ
  // -----------------------------------------------------

 }

 protected override void UnloadContent()
 {
  // TODO: Unload any non ContentManager content here
  // --- our code #4 ------------
   ship.Dispose();     // free resources, and release memory ไม่มีก็ยังได้
  // -----------------------------
 }

 protected override void Update(GameTime gameTime)
 {
  // Allows the game to exit
  if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed)
  this.Exit();

  // TODO: Add your update logic here
  base.Update(gameTime);
 }

 protected override void Draw(GameTime gameTime)
 {
   GraphicsDevice.Clear(Color.CornflowerBlue);

   // TODO: Add your drawing code here
   // --- our code # 5 ------------------------
   spriteBatch.Begin();
   spriteBatch.Draw(ship, ship_pos, Color.White);
   spriteBatch.End();
   // -----------------------------------------
   base.Draw(gameTime);
 }
}

จะเห็นว่าเราประกาศ ตัวแปร 2 ตัว  ship และ ship_pos นะครับ เป็น Texture2D กับ Vector2 จะยังไม่ขอ พูดอะไรเกี่ยว variable type ครับแล้วเรามีการกำหนด ค่าเริ่มต้น ใน constructor นิดหน่อย เป็นการกำหนด ขนาด windows สำหรับแสดงภาพ  our code #2

ต่อมาใน loadContent เราทำการ load resource ชื่อว่า ship3 ตรวจสอบ asset name ของresources ให้ดีนะครับ ไม่จะเป็นต้องตรงกับชื่อไฟล์ก็ได้ ถ้าหากเราไม่ได้มีการแกไขส่วนใหญ่จะต้องกลับชื่อไฟล์

ใน UnloadContent ใส่ไว้เพื่อ unload resource นั่น ๆ นะครับ ผมเข้าใจว่าอาจไม่ต้อง ก็ได้ ปล่อยให้ framework มันจัดการเอง [ ปกติถ้าเรา เขียน c++ หรือ c ต้องกำจัดให้หมด ]

สุดท้ายเรา draw เพื่อแสดงรูป นะครับ

สังเกตว่าการแสดงผลใด ๆ ก็ตามต้อง อยู่ระหว่าง spriteBatch.Begin() และ spriteBatch.End()

ลอง run ดู จะได้รูปเรือ ขนาดเท่าต้นฉบับบ แสดงอยู่ที่ตำแหน่ง x = 400 , y = 300  ( นับจากมุม บนซ้าย x เป็นแนวนอน y เป็น แนวตั้งนะครับ ,มุมบนซ้าย เป็นตำแหน่ง x = 0 , y = 0 )

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

หากต้องการให้มีการเคลื่อนที่จะต้องทำอย่างไร ลองคิดดูครับ …………………………….. ใช้แล้วเปลี่ยน ค่า ship_pos

Ship_pos instance ของ  class Vector2 เป็นซึ่ง coordinate ในระนาบ 2 มิติ มีแค่ค่า x,y เท่านั้น เพราะฉะนั้นการเคลือน ภาพก็ต้องทำการ บวกหรือ ลบ ค่า X หรือ Y นี่แหละครับ และจะต้องทำภายใน Update() mehtod ตาม code ที่แสดงด้านล่าง นะครับ

protected override void Update(GameTime gameTime)
{
// Allows the game to exit
if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed)
this.Exit();
// TODO: Add your update logic here
// ourcode #6 ----------------------------
KeyboardState keystate = Keyboard.GetState();
//ขึ้นบน
if (keystate.IsKeyDown(Keys.Up))
ship_pos = new Vector2(ship_pos.X, ship_pos.Y - 0.5f);
//ลงล่าง
if (keystate.IsKeyDown(Keys.Down))
ship_pos = new Vector2(ship_pos.X, ship_pos.Y + 0.5f);

// ไปซ้าย
if (keystate.IsKeyDown(Keys.Left))
ship_pos = new Vector2(ship_pos.X - 0.5f , ship_pos.Y );
// ไปขวา
if (keystate.IsKeyDown(Keys.Right))
ship_pos = new Vector2(ship_pos.X + 0.5f, ship_pos.Y );
// ---------------------------------------
base.Update(gameTime);
}

Code มีความหมาย ตาม remark ไว้ไห้

เป็นการตรวจจับ keyboard ว่ามีการ กดปุ่ม หัวลูกศรหรือป่าว และเป็น หัวลูกศรทิศไหน ก็ ดำเนินการกับ ดำแปร ship_pos ในด้านที่ ควรจะเป็น ถ้าไม่เข้าใจ ลอง ร่างหน้าจอใน กระดาษดูนะครับ แล้วจะเข้าใจเอง ขี้เกียจอธิบาย lazy  อะ
เอาดูจากรูป ก็แล้วกัน

ส่วนใคร ไม่เข้าใจการเพิ่มค่า shiop_pos.X และ ship_pos.Y ลองทำแบบนี้แทนก็ได้

Ship_pos.Y -= 0.5f ;

หรือ

Ship_pos.Y = Ship_pos.Y – 0.5f ;

ใครไม่เข้าใจอะไร ก็ลอง mail มาคุยกันก็ได้ หรือ คุยกันผ่านทาง blog ก็ได้

ขอให้สนุกสนานกับการเริ่มต้น กับ XNA  นะครับ

ธีระพงษ สนธยามาลย์

Teerapong Sontayaman

s_teerapong2000@yahoo.com

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

สิ่งที่เราต้องการพูดถึง ก็คือ การทำงานกับ UML Diagram และสื่อสาร กันระหว่าง นักวิเคราะห์ระบบ กับโปรแกรมเมอ์ (หรือ นักเขียนรหัสโปรแกรม ฮิ ฮิ ตั้งชื่อให้มัน โก้ ๆ ) หลายคน เห็นคำพูดนี้ก็จะร้องว่า เออ ใช่ แล้วไงหล่ะ ก็ นักวิเคราะห์ระบบ วิเคราะห์ เสร็จก็จะเขียน UML diagram เช่น class diagram ซึ่งมันเป็น conceptual level มันไม่ได้ให้ความหมายใด ใด เกี่ยวกับ ข้อมูล หรือโปรแกรม เช่น ตัวอย่าง diagram ข้างล่าง

   ในความหมายทาง OOP ของเรา ก็หมายถึง Dog is animal หรือ หมาเป็นสัตว์ ครับ diagram บอกแค่นี้แหละครับ แต่ในรายละเอียดของ Implementation level นั้น มันจะต้องถอดรหัสออกมา ให้แม่นยำมาก เพื่อให้ได้ตามความหมายที่ต้องการ ในที่นี้ ก็จะได้ออก มาเป็น  ( ท่านควรจะมีพื้นฐาน OOP ก่อน ที่ท่านจะมาอ่านเรื่องนี้นะครับ ขอบอก)

  public class Animal { … }
  public class Dog : Animal { … }

ตาม code อธิบายได้ว่า มี class Animal และ class Dog โดยที่  class Dog สืบทอดมากจาก Animal ก็หมาย ฟามว่า Dog มีคุณสมบัติทุกอยาก รวมถึงพฤติกรรมเหมือน Animal และก็จะต้องคุณสมบัติบางอย่างหรือ พฤติกรรมบางอย่างที่บ่งบอก ว่ามันเป็น Dog ครับ นั่นนะซิ ( เช่น หมาต้องกิน ขี้ หรือป่าว ฮิ ฮิ อันนี้ไร้สาระ แล้ว)

ก็จะสรุปว่า Diagram นั้น มันเป็น conceptual level ครับ มันสามารถเป็นปัญหาใหญ่ได้หาก โปรแกรมเมอร์ ถอดรหัสออกมาเป็น code ได้ไม่ถูกต้อง

ในที่นี้ก็เลยอยากจะ แสดง การถอดรหัส จาก diagram ไปเป็น code ให้เพื่อน ๆ ได้ติดตามอ่าน กันก็แล้วกันครับ

สำหรับ UML diagram ที่เราจะกล่าวถึง ก็จะเป็น ตัวที่เราใช้ในการ วิเคราะห์ระบบ หลัก ๆ สวนที่ไม่ได้กล่าวถึง นั้น ก็ไม่ได้กล่าวถึง ฮิ ฮิ
UML นั้นมีอยู่ 3 กลุ่ม diagrams นะครับ ประกอบด้วย

• Static diagram อธิบาย โครงสร้างที่มันไม่เป็นแปลงหรือเคลื่อนไหว โดยใช้ class โครงสร้างของข้อมูล รวมถึงความสัมพันธ์ระหว่าง กัน

• Dynamic diagram อธิบาย การทำงานของ entities ต่าง ๆ ในระหว่างการประมวลผล โดยการแสดงภาพของ flow การประมวลผล

• Physical diagrams อธิบายโครงสร้างที่ ไม่มีการเปลี่ยนแปลง ในภาพของ sources files  หรือ libraries และความสัมพันธ์ที่เกิดขึ้น ระหว่าง กัน ครับ

ลองมาดูตัวอย่างกันนะครับ ด้านล่างแสดง code การทำ binary trees แบบหนึ่ง ดูให้เข้าใจแล้วค่อยไปดู ไปไล่ดู diagram กันนะครับ

public class TreeMap{
  TreeMapNode topNode = null;
  public void add(Comparable key, Object value)
  {
    If(topNode == null)
      topNode = new TreeMapNode(key, value)
    else
      topNode.add(key,value)
   }

  public Object get(Comparable key)
  {
    return topNode == null ? null : topNode.find(key) ;
  }
}

class TreeMapNode {

  private final static int LESS = 0;
  private final static int GREATER = 1;
  private Comparable itsKey;
  private Object itsValue;
  private TreeMapNode nodes [] = new TreeMapNode[2]

  public TreeMapNode(Comprarable key, Object value)
  {
     itsKey = key;
     itsValue = value;
  }

  public Object find(Comparable key)
  {
     if(key.compareTo(itsKey) == 0) return itsValue;
     return findSubNodeForkey(selectSubNode(key),key);
  }

   public int selectSubNodeForKey(int node, Comparable key) {
     return node[nodes] == null ? null : node[node].find(key) ;
   }

  public void add(Comparable key, Object vlaue)
  {
     if(key.compareTo(itskey) == 0)
        itsValue = value;
     else
        addSubNode(selectSubNode(key),key,value);
   }

   public void addSubNode( int node, Comparable key, Object value){
      if( nodes[node] == null)
         nodes[node] = new TreeMap(key, vlaue);
      else
         nodes[node].add(key,value);
    }
}

เอาละครับ คราวนี้เรามาดูกันที่ diagram ว่าจะเป็น อย่างไรกันบ้าง

Class Diagram

      class diagram จะแสดง class หลัก และความสัมพันธ์ของ class เหล่านั้น ครับ จากตัวอย่างโปรแกรม นะครับ เราจะเห็น ว่ามี class อยู่ 2 class  คือ TreeMap และ TreeMapNode  กล่าวคือ class TreeMap นั้น มีความสัมพันธ์เชื่อมโยง ไปยัง TreeeMapNode ในลักษณะที่ TreeMapNode เป็น member ของ TreeMap  ในตัวแปรที่ชื่อว่า topNode  ในขณะเดียวกัน TreeMapNode ก็ อ้างอิงไปที่ TreeMapNode ก็คือตัวเอง ลองมาดูว่าในลักษณะนี้เราจะเขียน class diagram และ relation ระหว่างกันอย่าไร

จาก Code นั้นก็จะได้อย่าง diagram ที่เห็น ด้านบนนี้ นะครับ จากรูป สิ่งที่เราควรจะทราบก็คือ

• กล่องสี่เหลี่ยม จะแทน class ชื่อ class จะอยู่ด้านบนสุด ตามด้วย attribute และ method อยู่ล่างสุด

• ใน diagram relationship ทั้งหมด เป็น association ซึ่งเป็น relation ship แบบง่ายสุด ใช้การสร้างตัวแปล object เพื่อที่จะ อ้างอิง และเรียกใช้ method ของ class ที่ต้องการ

• ชื่อที่กำกับ association เป็นชื่อ ตัวแปร object ของ class  ที่ต้องการอ้างอิง

• ตัวเลขที่กำกับ เป็นตัวเลขบอก จำนวน instance ที่ relationship สามารถอ้างอิง ได้

Object diagram

  ภาพด้านล่างเป็นการแสดง Object Diagram และ relation ship ในเวลาใดเวลาหนึ่งของการประมวลผล หรือเราอาจเรียกได้ว่าเป็นการทำ snapshot ของ memory มาแสดง นั่นเอง

จากภาพ รูปสี่เหลี่ยมแทน Object นะครับ จะสังเกตุเห็นว่า เป็น ชื่อ class จะขีดเส้นใต้นะครับ  ซึ่งเป็น class ที่ เป็น object นั้น ๆ ด้านล่างของ object แทน ตัวแปร object ซึ่งจะเห็นว่าบ้างตัวจะถูกกำหนดค่าให้  และ  relation ระหว่าง object เราเรียกว่า link ซึ่งเป็นตัวเดียวกับ association ครับ

Sequence Diagrams

    สำหรับ sequence diagram นั้น จะเป็นการแสดง ว่า method ต่าง ๆ นั้น implement อย่างไร

จากรูปจะเห็น ว่า เริ่มแรกจะต้องมีการ เรียก add() method ของ TreeMap ถ้า topNode มีค่าเป็น null TreeMap จะresponse ด้วย การสร้าง TreeMapNode ใหม่ แล้วกำหนดให้ topNode ถ้า topNode มีค่าไม่เท่ากีบ null TreeMap จะเรียก add() method ของ topNode

นิพจน์ที่อยู่ในวงเล็บ สี่เหลี่ยม เรียกว่า guardห สำหรับการแสดง ทางเลือกกำกับ   และ หัวลูกศรที่จบที่  TreeMapNode icon นั้นแทน construction  และ bar สี่เหลี่ยม ใต้ Treemap เรียกว่า activation ใช้แสดงห้วงเวลาที่ add method ทำงาน

Collaboration Diagram

      Diagram ต่อไปเรียกว่า collaboration Diagram ซึ่งเป็น diagram ที่แสดงข้อมูลคล้ายกันกับ Sequence diagram  กล่าวคือ sequence diagram นั้นเป็นตัวแสดงให้เห็นลำดับการทำงานของ การเรียก message แต่ใน collaboration diagram นั้นจะแสดงให้เห็น ความสัมพันธ์ระหว่าง object ดังรูป

จากรูป object ถูกเชื่อมเข้าด้วยกัน ด้วย สัญลักษณ์ที่เรียกว่า link ดังนั้น link จะเกิดขึ้นได้ก็ต่อเมื่อ object หนึ่งสามารถ ส่ง message ถึง อีก object หนึ่งได้  สัญลักษณ์ หัวลูกศร คู่กับ message จะกำกับอยู่กับ link แสดงให้เห็น ชื่อ message และทิศทางที่เรียก หมายเลข ด้านหน้าและมี dot นั้นแสดงให้เห็น ลำดับของการเรียก เป็นชั้น

จะเห็นว่า TreeMap.add Function (message 1)  เรียก TreeMapNode.add Function (message 1.1)  พูดได้อีกอย่างหนึ่งว่า message 1.1 นั้น เป็น message แรกที่ ที่เรียกจาก message 1 ครับ

ครับ คงพอเห็นได้นะครับ ว่าเราได้ ทำความรู้จักกับส่วนหนึ่งของ  diagram ที่เรามักใช้งานบ่อย ๆ แล้ว จุดประสงค์ก็เพื่อเป็นการ ทำความคุ้นเคยนะครับ ต่อไปเราจะพูดถึงรายละเอียดในการถอดรหัส ของ diagram ออกเป็น code ที่ถูกต้องต่อไป นะครับ ติดตามตอนต่อไปนะครับ

s_teerapong2000@yahoo.com

Teerapong Sontayaman

ธีระพงษ์ สนธยามาลย์

Fluent NHibernate นั้นเป็นเครื่องมือ ที่พัฒนา เพิ่มเติมมาจาก NHibernate   มาตรฐาน ซึ่งเดิมนั้น การทำการ Mapping จะเขียนด้วย XML     การพัฒนาของ Fluent NHibernate นั้น ทำให้เราสามารถ mapping ด้วยการเขียน C# code แทนที่จะเป็นการสร้าง XML documents(.hbm.xml files)

นอกจากนี้  Fluent NHibernate ยังมีเครื่องมือ อื่น ๆ ที่น่าสนใจ เช่น

• Auto mappings – การ mapping ทำให้อัตโนมัติ โดยอ้างอิงจาก entities ที่ออกแบบและเขียนไว้
• Presistence specification testing –  การ testing  สำหรับ entities ที่ออกแบบไว้  โดยไม่จำเป็นต้องเขียน CRUD แม้แต่บรรทัดเดียว
• Full application configuration การกำหนด configuration ทำผ่านทาง Fluent configuration API ได้เลย
• Database configuration – เช่นเดียว กันสามารถกำหนด configuration ของ Database ผ่าน ทาง API ได้เลย

ความเป็นมาของ Fluent NHibernate

NHibernate เป็น Object Relational Mapping framework ใช้สำหรับการจับคู่ ระหว่าง relational data และ objects   ซึ่ง NHibernate มีการกำหนด การ จับคู่ หรือ mapping ในรูปแบบ XML เรียกว่า HBM ดังนั้น class ทุก class จะต้องมี HBM XML file กำกับอยู่ด้วยเสมอ เพื่อที่จะป็นตัวกำกับ และเป็นตัวอธิบาย โครงสร้างของข้อมูล ในฐานข้อมูล ให้กับ class นั้น ๆ   ครับ  ก็ mapping file นี่แหละครับ ที่ Fluent NHibernate สร้างเครื่องมือมาแทนที่

พอเข้าใจนะครับ ผมรู้ว่าคนที่อ่าน บทความนี้น่าจะต้อง เข้าใจ ORM เป็นพื้นอยู่แล้วนะครับ

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

•  Compiler ไม่ได้ทำการ evaluate XML ให้  เมื่อมีการเปลี่ยนชื่อ properties ใน class แล้วไม่ได้ทำการ ปรับปรุง ใน mapping เราจะไม่รู้เลยจนกว่า mapping จะถูกอ่าน ตอน runtime
• XML นั้น หยุมหยิม ครับ ถึงแม้ว่า NHibernate นั้นลด การใช้งาน XML elements ไปแล้ว แต่ก็ยังหนีไม่พ้น ครับ
• Repetitive mapping  - NHibernate HBM mapping จะยิ่ง เยอะ หากเราต้องเขียนข้อกำหนด เดิม ๆ บ่อยครั้ง เช่น  ข้อกำหนดที่จะไม่ยอมให้ ข้อมูลแบบ string ให้รับค่า null และต้องมีความยาวไม่เกินกว่า 1000 ตัวอักษรเป็นต้น

แล้ว Fluent NHibernate จัดการกับ ข้อปัญหาเหล่านี้ได้อย่างไร

ครับ มันทำได้ด้วยการ เปลี่ยนการเปขียน mapping ให้มาเป็นการ code แทน  และถูก compile ไปกับ app ที่เราเขียน ทำให้เมื่อเราแก้ไขหรือเปลี่ยนแปลง class ก็จะทำให้ ไปแก้ไข การ mapping ตามที่ควรจะเป็น ด้วย  สำหรับเรื่องการใช้งานซ้ำ ๆ    Fluent NHibernate มี configuration system   ทำให้เราสามารถกำหนด รูปแบบสำหรับการทำ override ได้  และ อื่น ๆ

ตัวอย่าง ครับ <สำหรับข้อมูลและตัวอย่างนำมาจาก  http://wiki.fluentnhibernate.org/Getting_started >

วิธีการ mapping แบบ เดิม

<?xml version="1.0" encoding="utf-8" ?>

<hibernate-mapping xmlns="urn:nhibernate-mapping-2.2" namespace="QuickStart" assembly="QuickStart">

<class name="Cat" table="Cat">
  <id name="Id">
    <generator />
  </id>
  <property name="Name">
    <column name="Name" length="16" not-null="true" />
  </property>
  <property name="Sex" />
  <many-to-one name="Mate" />
  <bag name="Kittens">
    <key column="mother_id" />
    <one-to-many class="Cat" />
   </bag>
</class>
</hibernate-mapping>

วิธีการ mapping แบบ Fluent NHibernate

public class CatMap : ClassMap<Cat>
{
  public CatMap()
  {
    Id(x => x.Id);
    Map(x => x.Name)
      .Length(16)
      .Not.Nullable();
    Map(x => x.Sex);
    References(x => x.Mate);
    HasMany(x => x.Kittens);
  }
}

จบไว้แค่นี้ก่อนนะครับ ไว้ต่อ กันในรายละเอียดต่อไป ครับ s_teerapong2000@yahoo.com

เป็นคำถามที่แรกที่หลายคนถามว่า ทำไมถึงต้อง NHibernate  สำหรับผู้พัฒนาระบบ ที่ทำงานมายาวนานแล้ว พอที่จะรู้คำตอบในใจอยู่แล้วว่า การเขียน code เพื่อจัดการกับ object persistence นั้นเป็นเรื่องที่สร้างความ เหน็ดเหนื่อยให้ผู้พัฒนาเป็นอย่างมาก ผมก็เห็นด้วย เพราะงานในการอ่านข้อมูลจากฐานข้อมูล มาสร้างเป็น Object และบันทึกข้อมูลที่เป็น Object กลับลงฐานข้อมูลนั้น ใช้เวลา มากพอสมควร บางท่านบอกว่า อาจต้องใช้ถึง 1 ใน 4 ของ เวลาที่ต้อง coding ทั้งหมด [ผมหมายถึงเวลาที่เราเขียน n-tier aplication นะครับ] และงานพวกนี้ก็ ทำซ้ำซาก ใช้เวลา น่าเบื่อเป็นที่สุด

ครับได้มีการแก้ปัญหานี้กันอย่างกว้างขวาง อย่างเช่น การทำ code generator ให้กับ data acces layer สามารถสร้าง code ให้ได้ภายใน พริบตาเดียวแต่ปัญหาก็ยังคงอยู่เนื่องจาก หากมีการแก้ไขโครงสร้างฐานข้อมูลเมื่อใด ก็จำเป็นจะต้องมีการ re – create ใหม่อีก

สำหรับ Object-relational managers หรือ ORM อย่างเจ้า NHibernate นั้นแตกต่างครับ ท่าน  มันสามารถจัดการกับ data acces ได้อย่างมีประสิทธิภาพ และสามารถเข้าถึงข้อมูลได้ง่าย เพียงไม่กี่บรรทัด

แนะนำ NHibernate

NHibernate เป็น เป็น persistence engine ในรูปของ Framworke  เอาว่ามันทำหน้าที่ load และ สร้าง business object จากฐานข้อมูล และบันทึกการเปลี่ยนแปลงจาก object กลับลงฐานข้อมูล ครับ และสามารถทำง่ายดังพริกฝ่ามือ เติมให้อีกนิด

เจ้า NHibernate มันจะใช้ข้อมูลใน mapping files [ XML ] สำหรับการแปลงจาก ข้อมูลในฐานข้อมูล เป็น Objects [ ไอ้เจ้า Object ที่สัมพันธ์กับ table ในฐานข้อมูลนี่แหละที่เรียกว่า persistence object ]

ดังนั้นทำให้เราแค่ เพิ่ม code สองสามบรรทัด และสร้าง mapping file ให้กับ persistent class [ class ที่สัมพันธ์กับ table ในฐานข้อมูล ] ที่เหลือ เช่น การจัดการกับข้อมูลทั้งหมด   NHibernate จะจัดการให้ สุดยอดไหมหล่ะครับ save เวลาไปเยอะนะครับ

ครับ NHibernate ไม่ใช่ ORM framework ที่มีอยู่เพียงอันเดียว ที่มีอยู่ ในโลกของ .NET นะครับ  มีตัวอื่น ๆอีกมากมาย ไม่ว่าจะเป็น Open source หรือ commercial ที่ทำงานในลักษณะเดียวกันครับ แต่เจ้า NHibernate เป็นตัวหนึ่งที่ค่อนข้างเป็นที่นิยมกันครับ อาจจะเป็นเพราะว่ามันมี บรรพบุรูษเป็น Hibernate ซึ่งเป็น ORM  Framework ยอดนิยมของ Java ก็เป็นได้ นอกจากนั้น Microsoft สัญญาว่าจะมี Entity Framework สำหรับ ADO.NET ที่มีความสามารถเป็น ORM แต่มันก็ยังไม่คลอดออกว่า คงต้องรอก็ต่อไปสักพักนะครับ

ครับ สำหรับเรื่องของ NHibernate นั้นคงต้องว่ากันต่อไป นะครับส่วนท่าที่ต้องการจะอ่านเพิ่มเติมก็สามารถไปตาม link นี้นะครับ อ่านเพิ่มเติมได้ที่

ของผมเองก็มีเหมือนกันะครับ  สะพานเชื่อมระหว่าง Object และ Database

s_teerapong2000@yahoo.com

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

เรื่องในวันนี้นับเป็นเรื่องแรกแห่งปีนี้ ครับ  อย่างที่ได้ขึ้นหัวไว้นะครับ  NHibernate ถือว่าเป็น นวัตกรรม ของการพัฒนาซอฟต์แวร์ แห่งปีก็ว่าได้นะครับ นักพัฒนาระบบอย่างเรา คงจะเข้าใจได้นะครับ ว่าระบบฐานข้อมูลส่วนใหญ่ที่เราใช้งานั้น จะเป็น relational database ซะส่วนใหญ่ และการพัฒนาระบบในภาษาใหม่นั้น เราก็จะเน้นการเขียน แบบ Object oriented  เมื่อเราทำงานในลักษณะ Object เราก็น่าจะสามารถมองเห็น ข้อมูลเป็น Object ด้วย แต่การ ทำ Data access Layer นั้น เป็นงานหนักทีเดียว ถ้าต้องการทำให้ การเขียนเป็น เชิง Object ทั้งหมด ทั้งนี้ผมกล่าวไปตามความเข้าใจ นะครับ และก็เข้าใจว่า NHibernate เป็นหนทางที่จะนำเราไปสู่การส้รางงานที่ง่ายขึ้น แต่จะเป็นอย่างไรนั้นคงจะต้องหาคำตอบ ไปด้วยกันนะครับ

คงจะต้องกล่าวถึง NHibernate ก่อนที่จะลองสัมผัส กันสักนิด นะครับ สำหรับ NHibernate นี่นั้นเขาเรียกกันว่า Object Relational Mapper (ORM) ทำหน้าที่ Map จาก Relational database มาเป็น Object ให้เราครับ ทำให้เราทำงานได้ง่ายขึ้นครับเพราะเราไม่ต้องไปงุ่มง่ามอยู่กับการเขียน Data access layer  ง่ายอย่างไรนั้นคงต้อง ค่อย ๆ ดูตามผมไปก็แล้วกันนะครับ เพราะผมเองก็อยากรู้มากเหมือนกัน

เอาเป็นว่าเราเรียนรู้ NHibernate ผ่านทางต้วอย่างที่ผมจะรวบรวมมา จากง่ายไปหาอยากและเอาไปใช้งานจริง ๆ นะครับ

เครื่องมือที่เราจะใช้ใน ตัวอย่างแรกนี้ก็คงจะเป็น

• NHibernate version 2.1.2 ครับ load ตาม link นี้เลยครับ NHibernate-2.1.2.GA-bin
• Visual studio 2008 Express, C#
• SQL Server 2005 Express

ขั้นตอนการติดตั้ง NHibernate ก็ไม่ยากนะครับ ผมแตกออกแล้วเอาไว้ที่ c:\NHibernate-2.1.2 GA\ แล้ว ทำตามขั้นตอนต่อไปนี้นะครับ

ขั้นตอนที่ 1 :

• สร้าง Project ชื่อ Lesson3 แล้วสร้าง form แล้ววาง datagrideview ไว้ บน form นั้น นะครับแล้วทิ้งไว้ก่อน
• Add Reference -> NHibernate
  • Click ขวาที่ชื่อ Project เลือก Add Reference
  • Brows ไปยัง folder ที่แตกไว้แล้วเลือก NHibernate.dll ใน \Required_Bins
  • ทำอีกครั้ง เพื่อ Add    NHibernate.ByteCode.Castle.dll  ใน \Required_For_LazyLoading\Castle

ขั้นตอนที่ 2 :

• Add new class -> company.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

namespace Lesson3
{
 public class company
 {
 public company() { }

 public virtual string companyid { get; set; }
 public virtual string companyname { get; set; }
 public virtual string companyemail { get; set; }
 public virtual string companysize { get; set; }

 }
}

• Add new XML ->    Set as Embedded Resource [company.hbm.xml]
• สำคัญมากสำหรับ ไฟล์นี้ ต้องกำหนด properties ให้เป็น  embedded resource

<?xml version="1.0" encoding="utf-8" ?>
<hibernate-mapping xmlns="urn:nhibernate-mapping-2.2" assembly="Lesson3" auto-import="true">
 <class name="Lesson3.company, Lesson3" table="company" lazy="true">
 <id name="companyid" type="string">
 <generator/>
 </id>
 <property name="companyname" type="string"/>
 <property name="companyemail" type="string"/>
 <property name="companysize" type="string"/>

 </class>

</hibernate-mapping>

ขั้นตอนที่ 3 :

• config and Execute
  • Add using statment , เปิด form1 ที่เราวาง datagridview ไว้แล้วเพิ่ม using statement ตามนี้ครับ

...
using NHibernate;
using NHibernate.Cfg;
using NHibernate.ByteCode.Castle;
using System.Collections;

• แล้ว เพิ่ม code ลงใน constructor ดังนี้

Configuration config = new Configuration();
ISessionFactory factory;

 config.SetProperty(NHibernate.Cfg.Environment.ConnectionProvider, "NHibernate.Connection.DriverConnectionProvider");
 config.SetProperty(NHibernate.Cfg.Environment.Dialect, "NHibernate.Dialect.MsSql2005Dialect");
 config.SetProperty(NHibernate.Cfg.Environment.ConnectionDriver, "NHibernate.Driver.SqlClientDriver");
 config.SetProperty(NHibernate.Cfg.Environment.ConnectionString, @"Data Source=.\SQLEXPRESS;Initial Catalog=enterprise4;User ID=sa;Password=xxxx;Pooling=False");
 config.SetProperty(NHibernate.Cfg.Environment.ProxyFactoryFactoryClass, "NHibernate.ByteCode.Castle.ProxyFactoryFactory,NHibernate.ByteCode.Castle");

 config.AddAssembly(typeof(Lesson3.company).Assembly);

 factory = config.BuildSessionFactory();
 ISession session = null;
 try
 {
 session = factory.OpenSession();
 dataGridView1.DataSource = session.CreateCriteria(typeof(Lesson3.company)).List();
 }
 catch (Exception ex)
 {
 session.Close();
 MessageBox.Show(ex.Message);
 //throw;
 }

ลืมไปว่าท่านต้องทำการ สร้าง database ชื่อ enterprise4 โดยที่มี โครงส้รางข้อมูลดังนี้
CREATE TABLE [dbo].[company]( [companyid] [nchar](10) NOT NULL, [companyname] [nchar](150) NULL, [companyemail] [nchar](150) NULL, [companysize] [nchar](10) NULL, CONSTRAINT [PK_company] PRIMARY KEY CLUSTERED ( [companyid] ASC )WITH (PAD_INDEX  = OFF, STATISTICS_NORECOMPUTE  = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS  = ON, ALLOW_PAGE_LOCKS  = ON) ON [PRIMARY] ) ON [PRIMARY]

หลังจากนี้ก็ลอง compile แล้วrun ดูนะครับ จะได้ข้อมูลขึ้นมาแสดง ให้ท่านเห็น อ้อ แต่อย่าลืม ใส่ข้อมูลลงตารางซะก่อนนะครับ
จาก เห็นมั้ยครับ ว่ามันจัดการอะไรให้เราบ้างเราแค่เขียน แค่นี้เราก็สามารถที่จะแสดงข้อมูลจาก table ได้แล้ว ดังนั้น ต้องติดตามกันต่อไปนะครับว่า การทำ operation ต่าง ๆ กับข้อมูลทำได้อย่างไรบ้าง
เช่นการ insert update และการ delete ซึ่งจะเก็บไว้เป็นตอนต่อไป ครับ ถ้ามีอะไรที่ต้องการ ถามก่อนก็ ว่ากันไปตามนี้นะครับ s_teerapong2000@yahoo.com ครับ Bye…
]]> https://gpluspluss.wordpress.com/2011/01/10/nhibernate-%e0%b8%aa%e0%b8%b0%e0%b8%9e%e0%b8%b2%e0%b8%99%e0%b9%80%e0%b8%8a%e0%b8%b7%e0%b9%88%e0%b8%ad%e0%b8%a1%e0%b8%a3%e0%b8%b0%e0%b8%ab%e0%b8%a7%e0%b9%88%e0%b8%b2%e0%b8%87-object-world-%e0%b9%81/feed/ 2 Teerapong S. https://gpluspluss.wordpress.com/2010/07/24/how-to-embed-a-form-in-a-control-%e0%b8%88%e0%b8%b1%e0%b8%9a-from-%e0%b8%a1%e0%b8%b2%e0%b9%83%e0%b8%aa%e0%b9%88-form/ https://gpluspluss.wordpress.com/2010/07/24/how-to-embed-a-form-in-a-control-%e0%b8%88%e0%b8%b1%e0%b8%9a-from-%e0%b8%a1%e0%b8%b2%e0%b9%83%e0%b8%aa%e0%b9%88-form/#comments Sat, 24 Jul 2010 16:47:18 +0000 Teerapong Sontayaman http://gpluspluss.wordpress.com/?p=411 ]]>

it’s another time there is some asking about how to show form into another form. i have been trying to find around the web to get the example . but i found the answer myself as following example. . . [try to understand my bad English] . ha ha

in this posting i will show how to put existing  two form into one main form , by the way i’m doing this in main form i put the tab with two tab pages , first tabpage for first form and anther tab put second form. as following picture.

figure 1. show two tab in main form

By doing this i  create the project   with main form name form1.cs and another two is anotherform.cs and moreform.cs

First – put two tab into mainform (form1.cs)  and place panel1 into tabpage1 and groupbox1 into tabpage2 [please note this the control must be a container control]

then – Create another two form , anotherform.cs and moreform.cs

anotherform.cs

figure 2. show anotherform.cs

in this form show information of two textbox when you click  ‘show information’  button

moreform.cs

figure 3. show moreform.cs

in this form the textbox will show the selected text of  above combobox…

I will not go in detail of how these two form work i will explain how it work  in the main form.

in main form (form1.cs)  , see the following code, better then  explain…

public void ShowFormInControl(Control myctl, Form myfrm)
{

myfrm.TopLevel = false;
myfrm.FormBorderStyle = FormBorderStyle.None;
myfrm.Dock = DockStyle.Fill;
myfrm.Visible = true;
myctl.Controls.Add(myfrm);

 }

 private void button1_Click(object sender, EventArgs e)
 {
anotherForm myform = new anotherForm();
ShowFormInControl(panel1, myform);

moreForm myform2 = new moreForm();
ShowFormInControl(groupBox1, myform2);

 }

in the source code you can see  the technique of how to put the form into control  in the  “ShowformInControl(Control myctl, Form myfrm)  “    the function perform putting the form ( myfrm ) into Control( myctl ) as i mention earlier – the control must be container control.  without any explanation it’s obviously show in the code…

then the forms are load by the click event of button1.    – create form and put into control by calling ShowformInControl where ever you want to put , panel or groupbox or any contrainer control.

hope this will help …   s_teerapong2000@yahoo.com

you can download code example here frmAdvance.zip

]]> https://gpluspluss.wordpress.com/2010/07/24/how-to-embed-a-form-in-a-control-%e0%b8%88%e0%b8%b1%e0%b8%9a-from-%e0%b8%a1%e0%b8%b2%e0%b9%83%e0%b8%aa%e0%b9%88-form/feed/ 0 Teerapong S. fpic1 fpic3 fpic4 https://gpluspluss.wordpress.com/2010/07/07/real-time-framework-single-to-multi-server-online-game/ https://gpluspluss.wordpress.com/2010/07/07/real-time-framework-single-to-multi-server-online-game/#comments Wed, 07 Jul 2010 03:05:53 +0000 Teerapong Sontayaman http://gpluspluss.wordpress.com/?p=394 ]]>

ได้มีโอกาสร่วมอยู่ในงานวิจัย และพัฒนาเกมที่เป็นกึ่ง ๆ online game  แบบ single-server ซึ่ง เดินมาถึงจุดที่ single – server ไม่สามารถให้บริการได้เนื่องจาก มี ผู้ใช้มากขึ้น และจำนวน object หรือ entity ก็มากขึ้นเป็นเงาตามตัวเช่นเดียวกัน  การพัฒนาก็เริ่มมอง หา solution ทำจะช่วยแก้ปัญหาโดยต้องใช้ เวลา และ แรงงาน  ไม่มากนัก  และ RTF ก็เป็น solution หนึ่งที่ น่าสนใจเป็นอย่างยิ่ง ครับ

Real-Time Framework หรือ RTF คือ middleware ที่จะช่วยให้เราสามารถเปลี่ยน Single-Server ให้เป็น Multi-Server online game ครับ  อ้างจาก cast study ที่อ้างอิงในบทความนี้ นะครับว่า  game ประเภท Fast-paced action เช่น First Persons Shooters หรือ FPS นั้น หากต้องการความสามารถ ในการ ขยายระบบรองรับผู้เล่นจำนวนมาก แล้วละก็ ต้องมี สถาปัตยกรรม แบบ multi-server ถึง จะทำได้  แต่การทำ mult-server นั้นเป็นงานที่ท้าทายต่อผู้พัฒนา  เนื่องจาก การประมวลผลจะต้องเป็นการประมวลผลแบบ ขนาน และการ distribute game state  ก็ต้องทำอย่าง มีประสิทธิภาพ  ครับ สองงานหลัก ๆ ที่ game แบบ multi-server นั้นต้อง จัดการให้ได้ ก็คือ เรื่องของการ ทำให้เป็นการประมวลผลแบบขนาน และ การประสานงาน การแจกจ่ายสถานะของ game ให้ได้ประสิทธิภาพ

เนื่องจากว่า มุมมองที่เราจะนำ RTF มาใช้งานก็คือผู้พัฒนา ที่มี game ที่เป็น single-server เป็นของตัวเองอยู่แล้ว และต้องการ ปรับปรุง ให้เป็น multi-server โดยที่ไม่ต้องไปลือระบบของตัวเอง จนแทบจะเรียกได้ว่า ต้องทำกันไหม อะไร แบบนั้นอะครับ  เนื่องจากว่า RTF นั้น จะช่วย ในเรื่องของ การทำ parallelization  และ การจัดการกับ game state โดยเฉพาะในเรื่องของการแจกจ่าย game state ให้อัตโนมัติ  ผุ้พัฒนาที่ใช้ RTF ไม่ต้องเข้าไปดำเนินการเรื่องนี้ เพียงแค่เรียกใช้ผ่าน hight level support ของ RTF เท่านั้นเอง

เพื่อให้ภาพนะครับ ดูจากภาพ แรก

จากภาพเป็นโครงสร้างและการทำงานของ game แบบ single-server นะครับ จะเห็นว่า server เพียงตัวเดียวควบคุมการทำงานทั้งหมด  การคำนวน game states การโต้ตอบกับ ผู้ใช้ และการกระจาย game states กลับไปให้ client ทั้งหมด  ครับ รูปต่อไป

จากภาพแสดงให้เป็น สถาปัตยกรรมแบบ Multi-server game จะเห็นว่า งานการประมวลผล game state การโต้ตอบกับผู้ใช้และการ กระจาย game state นั้นถูกแบ่งออกไป ให้ server อื่น ๆ ช่วยทำงาน  ซึ่งจะเห็นได้ว่า แน่นอนครับการขยายระบบ การเพิ่มจำนวนผู้เล่น ย่อมเกิดขึ้นได้ โดยสถาปัตยกรรมแบบ mult-server

ปัญหาคือว่า ผู้พัฒนาที่มี game ที่เป็น single-server อยู่ในมือจะทำให้เป็น mult-server ได้ด้วย RTF อย่างไร     (ตามที่ได้กล่าวไปแล้วว่า RTF จะช่วยให้ เราเปลี่ยจาก single-server เป็นเป็น Multi-server ได้) จะขอไว้ต่อใน คราวหน้านะครับ

s_teerapong2000@yahoo.com – Soft Speed Solution

Reference
[From a Single- to Multi-Server Online Game: A Quake 3 Case Study Using RTF  , Alexander Ploss, Stefan Wichmann, Frank Glinka , and Sergei Gorlatch  University of Munster, Germany]