[السلسلة الثانية]، الدرس الثاني، سلسلة دروس تعلم 3d Xna

بسم الله الرحمن الرحيم
الدرس الثاني
أهلا بكم في الدرس الثاني من سلسلة دروس تعلم 3D Xna (السلسلة الثانية)، في هذا الدرس سوف نتحدث عن الخامات.
حتى اللحظة، الطريقة الوحيدة التي إستخدمناها لتلوين المشهد، هي من خلال تعريف رؤوس منفصلة بحيث يحمل كل رأس لون مختلف. بالتأكيد، ليست هذه الطريقة التي تم صنع الألعاب الحديثة الضخمة بها. XNA تدعم طريقة فعالة جدا لإضافة الألوان و الصور إلى المشهد: بإمكانك ببساطة وضع صورة على مثلث. يطلق على هذه الصور إسم الخامات “Textures”.
كمثال أولي، سوف نقوم برسم مثلث واحد بسيط، وتغطيته بخامة. بإمكانك الحصول على خامة بسيطة من الرابط هنا(بإمكانك تنزيلها من خلال الضغط بالزر الأيمن للماوس على الرابط و إختيار حفظ الصوره بإسم..) أو من الملفات المرفقه في الدرس الأول. بعدها قم بإستيراد الصورة إلى مجلد ال Content في ال Solution Explorer، تماما كما فعلنا مع ملف التأثير.
عندما تضغط على الملف في خانة الContent في ال Solution Explorer، سيكون بإمكانك مشاهدة إسم هذا الملف بإسم ‘riemerstexture’، وذلك في مربع الخصائص في الجهه السفلى اليمنى للشاشة، بإمكانك تغيير هذا الاسم كما تحب، لكن دعه كما هو الآن.
في الكود، سوف نقوم بإضافة متغير جديد لكي يحمل صورة الخامة. قم بإضافة السطر التالي في أعلى الكود:

Texture2D texture;

texture = Content.Load<Texture2D> ("riemerstexture");

 VertexPositionTexture[] vertices;
 VertexDeclaration texturedVertexDeclaration;

 private void SetUpVertices()
 {
     vertices = new VertexPositionTexture[3];
     vertices[0].Position = new Vector3(-10f, 10f, 0f);
     vertices[0].TextureCoordinate.X = 0;
     vertices[0].TextureCoordinate.Y = 0;
 
     vertices[1].Position = new Vector3(10f, -10f, 0f);
     vertices[1].TextureCoordinate.X = 1;
     vertices[1].TextureCoordinate.Y = 1;
 
     vertices[2].Position = new Vector3(-10f, -10f, 0f);
     vertices[2].TextureCoordinate.X = 0;
     vertices[2].TextureCoordinate.Y = 1;
 
      texturedVertexDeclaration = new VertexDeclaration(device, VertexPositionTexture.VertexElements); 
}

 SetUpVertices ();

 Matrix worldMatrix = Matrix.Identity;
 effect.CurrentTechnique = effect.Techniques["Textured"];
 effect.Parameters["xWorld"].SetValue(worldMatrix);
 effect.Parameters["xView"].SetValue(viewMatrix);
 effect.Parameters["xProjection"].SetValue(projectionMatrix);
 effect.Parameters["xTexture"].SetValue(texture);
 effect.Begin();
 foreach (EffectPass pass in effect.CurrentTechnique.Passes)
 {
     pass.Begin();
      device.VertexDeclaration = texturedVertexDeclaration;
      device.DrawUserPrimitives(PrimitiveType.TriangleList, vertices, 0, 1);
     pass.End();
 }
 effect.End();

 private void SetUpVertices()
 {
      vertices = new VertexPositionTexture[6];
 
      vertices[0].Position = new Vector3(-10f, 10f, 0f);
      vertices[0].TextureCoordinate.X = 0;
      vertices[0].TextureCoordinate.Y = 0;
 
      vertices[1].Position = new Vector3(10f, -10f, 0f);
      vertices[1].TextureCoordinate.X = 1;
      vertices[1].TextureCoordinate.Y = 1;
 
      vertices[2].Position = new Vector3(-10f, -10f, 0f);
      vertices[2].TextureCoordinate.X = 0;
      vertices[2].TextureCoordinate.Y = 1;
 
      vertices[3].Position = new Vector3(10.1f, -9.9f, 0f);
      vertices[3].TextureCoordinate.X = 1;
      vertices[3].TextureCoordinate.Y = 1;
 
      vertices[4].Position = new Vector3(-9.9f, 10.1f, 0f);
      vertices[4].TextureCoordinate.X = 0;
      vertices[4].TextureCoordinate.Y = 0;
 
      vertices[5].Position = new Vector3(10.1f, 10.1f, 0f);
      vertices[5].TextureCoordinate.X = 1;
      vertices[5].TextureCoordinate.Y = 0;
 
      texturedVertexDeclaration = new VertexDeclaration(device, VertexPositionTexture.VertexElements);
 }

 device.DrawUserPrimitives(PrimitiveType.TriangleList, vertices, 0, 2);

الآن قم بتشغيل الكود، سيكون بإمكانك مشاهدة صورة الخامة كاملة معروضة على مثلثين!


سوف تلاحظ الفراغ البسيط الموجود بين المثلثين... السبب في ذلك هو في الحقيقة لأننا قمنا بتعريف المواقع للرؤوس بالطريقة السابقة، حيث تتكون الصوره من مثلثين منفصلين.

حاول حل التمارين التالية:

 using System;
 using System.Collections.Generic;
 using Microsoft.Xna.Framework;
 using Microsoft.Xna.Framework.Audio;
 using Microsoft.Xna.Framework.Content;
 using Microsoft.Xna.Framework.GamerServices;
 using Microsoft.Xna.Framework.Graphics;
 using Microsoft.Xna.Framework.Input;
 using Microsoft.Xna.Framework.Net;
 using Microsoft.Xna.Framework.Storage;
 
 namespace XNAseries2
 {
  public class Game1 : Microsoft.Xna.Framework.Game
  {
  GraphicsDeviceManager graphics;
  GraphicsDevice device;
 
  Effect effect;
  Matrix viewMatrix;
  Matrix projectionMatrix;
 
  Texture2D texture;
 
  VertexPositionTexture[] vertices;
  VertexDeclaration texturedVertexDeclaration;
 
  public Game1()
  {
  graphics = new GraphicsDeviceManager(this);
  Content.RootDirectory = "Content";
  }
 
  protected override void Initialize()
  {
  graphics.PreferredBackBufferWidth = 500;
  graphics.PreferredBackBufferHeight = 500;
  graphics.IsFullScreen = false;
  graphics.ApplyChanges();
  Window.Title = "Riemer's XNA Tutorials -- Series 2";
 
  base.Initialize();
  }
 
  protected override void LoadContent()
  {
  device = graphics.GraphicsDevice;
 

effect = Content.Load<Effect> ("effects");

texture = Content.Load<Texture2D> ("riemerstexture");
 
  SetUpVertices();
  SetUpCamera();
  }
 
  private void SetUpVertices()
  {
  vertices = new VertexPositionTexture[6];
 
  vertices[0].Position = new Vector3(-10f, 10f, 0f);
  vertices[0].TextureCoordinate.X = 0;
  vertices[0].TextureCoordinate.Y = 0;
 
  vertices[1].Position = new Vector3(10f, -10f, 0f);
  vertices[1].TextureCoordinate.X = 1;
  vertices[1].TextureCoordinate.Y = 1;
 
  vertices[2].Position = new Vector3(-10f, -10f, 0f);
  vertices[2].TextureCoordinate.X = 0;
  vertices[2].TextureCoordinate.Y = 1;
 
  vertices[3].Position = new Vector3(10.1f, -9.9f, 0f);
  vertices[3].TextureCoordinate.X = 1;
  vertices[3].TextureCoordinate.Y = 1;
 
  vertices[4].Position = new Vector3(-9.9f, 10.1f, 0f);
  vertices[4].TextureCoordinate.X = 0;
  vertices[4].TextureCoordinate.Y = 0;
 
  vertices[5].Position = new Vector3(10.1f, 10.1f, 0f);
  vertices[5].TextureCoordinate.X = 1;
  vertices[5].TextureCoordinate.Y = 0;
 
  texturedVertexDeclaration = new VertexDeclaration(device, VertexPositionTexture.VertexElements);
  }
 
  private void SetUpCamera()
  {
  viewMatrix = Matrix.CreateLookAt(new Vector3(0, 0, 30), new Vector3(0, 0, 0), new Vector3(0, 1, 0));
  projectionMatrix = Matrix.CreatePerspectiveFieldOfView(MathHelper.PiOver4, device.Viewport.AspectRatio, 0.2f, 500.0f);
  }
 
  protected override void UnloadContent()
  {
  }

  protected override void Update(GameTime gameTime)
  {
       base.Update(gameTime);
  }
 
  protected override void Draw(GameTime gameTime)
  {
  device.Clear(ClearOptions.Target | ClearOptions.DepthBuffer, Color.DarkSlateBlue, 1.0f, 0);
 
  Matrix worldMatrix = Matrix.Identity;
  effect.CurrentTechnique = effect.Techniques["Textured"];
  effect.Parameters["xWorld"].SetValue(worldMatrix);
  effect.Parameters["xView"].SetValue(viewMatrix);
  effect.Parameters["xProjection"].SetValue(projectionMatrix);
  effect.Parameters["xTexture"].SetValue(texture);
  effect.Begin();
  foreach (EffectPass pass in effect.CurrentTechnique.Passes)
  {
  pass.Begin();
 
  device.VertexDeclaration = texturedVertexDeclaration;
  device.DrawUserPrimitives(PrimitiveType.TriangleList, vertices, 0, 2);
  pass.End();
  }
  effect.End();
 
  base.Draw(gameTime);
  }
  }
 }