การวาดภาพใน XNA Game Framework

การวาดภาพใน XNA Game Framework

xna, ภาษา c#, สอน xna, เขียนเกมส์ xna, visual c#
หลังจากหายไปหลายอาทิตย์กลับมาเขียนบทความอีกก็ไม่รู้จะเขียนเรื่องอะไรดี พอดีช่วงนี้กำลังหัดเขียน game อยู่เลยเขียนบทเกี่ยวกับ xna โดยในครั้งนี้เป็นการนำไฟล์รูปภาพต่างๆที่เรามีนั้นไปวาดในโปรแกรม game ที่เราจะเขียนโดย xna ซึ่งขั้นตอนก็ไม่มีอะไรยากมากในตอนแรกเราก็สร้าง Project XNA โดยเลือกที่ภาษา C# แล้วเลือก Windows Game ตั้งชื่อที่เราต้องการ

xna, ภาษา c#, สอน xna, เขียนเกมส์ xna, visual c#

จากบทความ xna ในครั้งก่อน xna framework นั้นจะมี method ในการทำงานต่างๆที่ได้สร้างมาให้แล้ว ซึ่งในขั้นแรกก็ทำการโหลดรู้เข้าไปในตัวเกมส์เราก่อนโดยให้คลิกขวาที่ Content ให้เราการเลือก addnew -> existing item แล้วทำการเลือกรูปที่การ

xna, ภาษา c#, สอน xna, เขียนเกมส์ xna, visual c#

เมื่อเลือกรูปที่ต้องการแล้วก็ทำการประกาศตัวแปรเพื่อเป็นตัวอ้างอิงรูปของเราที่ได้เพิ่มเข้าไป โดยผมได้ประกาศชื่อว่า mypic เป็นแบบ Texture2D

xna, ภาษา c#, สอน xna, เขียนเกมส์ xna, visual c#

หลังจากนั้นก็ไปที่ method LoadContent() เพื่อทำการโหลดรูปเก็บในตัวแปรที่เราประกาศไว้มีโค้ดดังนี้

[sourcecode language=”c#”]
protected override void LoadContent()
{
// Create a new SpriteBatch, which can be used to draw textures.
spriteBatch = new SpriteBatch(GraphicsDevice);
mypic = Content.Load(“naruto2_2″);
}

[/sourcecode]
สังเกตว่าในการโหลดนั้นใช้แต่เพิ่งแค่ชื่อไฟล์เท่านั้นไม่มีนามสกุลของไฟล์ เมื่อโหลดเสร็จแล้วก็ให้ทำการวาดภาพที่โหลดเข้าไปให้ไปที่ method void Draw(GameTime gameTime) ซึ่งมีโค้ดดังนี้
[sourcecode language=”c#”]

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

spriteBatch.Begin();
spriteBatch.Draw(mypic, new Rectangle(0, 0, 800, 800), Color.White);
spriteBatch.End();

base.Draw(gameTime);
}
[/sourcecode]

ในการวาดใน void Draw(GameTime gameTime) นั้นต้องเริ่มโดย spriteBatch.Begin(); เป็นการบอกว่าเริ่มทำการวาดภาพหรือโมเดล ส่วน spriteBatch.End(); เป็นการบอกว่าสิ้นสุดการวาดภาพหรือโมเดล ส่วนการวาดภาพนั้นเราใช้ตัว spriteBatch ซึ่งเป็นตัวควบคุมเกี่ยวกับการวาดภาพนั้นเรียกใช้ method Draw โดยมันต้องการค่า Texture2D , Rectangle, Color นั้นคือ Texture2D คือภาพที่เราโหลดเก็บในตัวแปร mypic ในตอนแรกส่วน Rectangle คือสี่เหลี่ยมที่เราต้องการจะวาดโดย 4 เหลี่ยมนั้นสร้างโดยต้องการค่า (พิกัด x, พิกัด y, ความกว้างมความสูง) ส่วน Color คือสีพื้นหลัง ในตัวอย่างสร้างสี่เหลี่ยมเริ่มที่จุด 0 0 กว้างสูง 800 สีพื้นหลังเป็นสีขาว เมื่อกด F5 ก็จะได้หลังรูป

visual c#, xna, ภาษา C, สอน xna, เขียนเกมส์ xna

ในบทความนี้ก็มีแค่นี้แหละ อีกไม่กี่วันผมก็ต้องจ่ายค่าโฮสแล้วนั้นก็คือ thaicoding.net จะมีอายุครบ 1 ปีแล้วหากใครสนใจลงโฆษณาบน thaicoding แล้วละก็ติดต่อมาที่ admin(at)thaicoding.net

Download SourceCode

Leave a Reply

Your email address will not be published. Required fields are marked *