Skip to content

February 20, 2013

7

Game Development : 02වන පාඩම

අද ලිපියෙන්  සාකච්ඡා කෙරෙන්නේ කොහොමද මේකට රුප එහෙම නැත්නම් Sprites ඇතුලත් කරන්නේ කියල. ප්‍රධාන වශයෙන්ම sprites වර්ග දෙකක් තියෙනවා. එනම්  2D සහ  3D යන්නයි. අපි මේ පාඩම් මාලාව තුල කරන්නේ ද්විමාන රූප නිසා අපි 2D sprites යොදා ගන්න හැටි බලමු.  අද සිට පලවන සියලු පාඩම් සමග “මුලික අංග” නිම කරන ලද project එකක් අමුණන්න තීරණය කලා. මොකද එතකොට තේරෙන්නේ නැති තැනක් අවොත් බලන්න පුළුවන් වෙන නිසා.

XNA වල අපිට රුප සදහා ගොඩක් file extensions යොදා ගන්න පුළුවනි.  jpg, bmp සහ png වගේ ඒවා. මේ අපි ප්‍රොජෙක්ට් එක තුලට ගන්න හැම ඉමේජ් එකක්ම XNA වලින් එයාලගෙම ෆෝමැට් එකකට පරිවර්තනය කරලා තම පාවිච්චි කරන්නේ. මෙය සරලව content pipeline කියාත් හදුන්වනවා. ඉමේජ් පමණක් නොවේ අපි අපේ ප්‍රොජෙක්ට් එකට ගන්න ශබ්ද මාධ්‍ය ගොනු පවා ඔවුන්ගේම ෆෝමැට් එකකට යොමු කරලා පෙළ ගස්වනවා.

මම මේ සදහා පාවිච්චි කරන්නේ  100 x 100 පික්සෙල් ප්‍රමාණයේ jpg ඉමේජ එකක්. ඔබට කැමති ප්‍රමාණයේ එකක් යොදාගන්න පුළුවනි.

පලමුව අලුත් project එකක් හදාගන්න. දැන් solution explorer එකේ  <project_name>Content(Content) කියන එක රයිට් ක්ලික් කරන්න. අලුත් ෆෝල්ඩර් එකක් හදල images කියල රිනෙම් කරන්න. ඉන් පසු එම ෆෝල්ඩරය රයිට් ක්ලික් කරලා Add ->  Existing items ගිහින් ඔයාගේ ඉමේජ් එක දෙන්න. එවිට project එක තුලට එම අදාල ඉමේජ් ගොනුවෙන් කොපියක් වැටේවි.  තව මතක තියාගන්න අපි මේ project එකට දමන හැම ෆයිල් එකක්ම <project_name>Content (Content) එක යටතේ දැමිය යුතු බව..

දැන් අපි මෙම ඉමෙජ් ෆයිල් එක තිරයට ගන්න නම් එය 2D වෙරියබල් එකකට ගන්න ඕනි. මෙය ද්විමාන එකක් නිසා අපි Texture2D පාවිච්චි කරනවා. Game1.cs එකේ ක්ලාස් ලෙවෙල් එකෙන් හදාගන්න.

Texture2D   <texure_variable_name>;

දැන් අපි හදාගත්තු වෙරියබල් එකට ඉමේජ් එක ලෝඩ් කල යුතුයි. එනිසා එය LoadContent() එක තුල මෙසේ සිදු කරන්න..

<texure_variable_name> = Content.Load<Texture2D>(@”images/<your_image_name>”);

හරි දැන් ඉමේජ් එක වෙරියබ්ල් එකට ලෝඩ් වෙලා තියෙන්නේ. දැන් තියෙන්නේ මේක ඩිස්ප්ලේ එකේ අදින එකයි. එකට Draw මෙතඩ් එකට යන්න..

spriteBatch.Begin();

spriteBatch.Draw(<texure_variable_name>,  Vector2.Zero,   Color.White);

spriteBatch.End();

ඔබ හරියාකාරව අනුගමනය කලේ නම් නිල පාට තිරයේ ඔබේ රුපය වම් උඩ කොනක දිස්වෙනු ඇති.  මෙම ලයින් 3 හි පළමු ලයින් එකෙන් කියන්නේ ග්‍රැෆික් කාඩ් එකට sprite data යැවීම අරඹන බවයි. මැද ලයින් එකෙන් කියන්නේ එම යවන data ගැනයි. 3වන ලයින් එකෙන් කියන්නේ data යැවීම නවත්වන බවයි.

 

Vector2.Zero  –  දෛය්ශික වර්ග දෙකයි. 2D සහ 3D. අපි මෙහිදී කියන්නේ (0,0) ලක්ශ්‍යට අදාල vector එක පාවිච්චි කරන්න කියල.  ඔබට තිරයේ වෙනත් තැනක අදින්න උවමනා නම්  එවෙනුවට new Vector(y, x)  ලෙස දුන්නනම් හරි.

Color – ඉමෙජ් එකට Tint color එක.. මෙය වැදගත් වෙන්නේ එහා මෙහා පෙන ඉමේජ් වලටයි.

Overloaded method Draw – මෙය සාමාන්‍ය spriteBatch.Draw මෙතඩ් එකට තවත් ක්‍රියාකාරකම් වැඩිකොට එක කරන ලද මෙතඩ් එකක්. මෙයින් ඉම්ජ් වල එහා මෙහා පෙන ගති වැඩි කරන්න. ඉමේජ් flip කරන්න, crop කරන්න සහ layer depth හදාගන්න පුළුවනි.

spriteBatch.Draw(<texure_variable_name,  <Vector_Position>, <Rectangle_Crop>,  <Tint_color>,  <rotataion>,  <origin_of_rotation>,  <image_scale>, <spriteEffects>,  <Layer_Depth> );

Rectangle Crop – මේක අවශ්‍ය වෙන්නේ Sprite Animations වලදී. එනිසා දැනට මෙය null ලෙස සදහන් කරන්න.

rotation – ඉමේජ් එක කරකැවීමට යොදාගනී. float වලින් සදහන් කල යුතයි.

Scale – ඉමේජ් එකේ scale එක වෙනස් කරයි. float වලින් අගය සදහන් කල යුතුයි.

spriteEffects –  spriteEffects.FlipHorizontally  සහ spriteEffects.FlipVertically යන argument යොදා ඉමේජ් flip කිරීම කල හැකියි.

Layer Depth – මෙයින් කෙරෙන්නේ ඉමේජ් කීපයක් එක උඩ එක සමපාත කිරීමේදී උඩිනම පෙනෙන්න ඕනි මොකක්ද කියන එක සදහන් කරන එකයි. අපි හිතමු මෙහෙම.. දැන් අපි ගව තියෙනවා ගහක ඉමේජ් එකක් සහ මුවෙක්ගේ ඉමේජ් එකක්. අපිට ඕනි මුවා ගහ යට ඉන්නවා පෙන්න්න්න නේ. එතකොට අපිට කරන්න පුළුවන් උඩට එන්න ඕනි මොකක්ද යටට එන්න ඕනි මොකක්ද කියල float අගයක් දීල එක විස්තර කරන්න. අගය හැමවිටම 0 සහ 1 අතර තිබිය යුතුයි. 0 කියන්නේ most front position එක . 1 කියන්නේ  most back position එක. මෙම layer depth බාවිතා කිරීම සදහා spriteBatch.Begin() එකත් overload කිරීම අවශ්‍ය වෙනවා.

spriteBatch.Begin(SpriteSortMode.<your_selection>,  BlendState.<your_selection>);

SpriteSortModes – මෙයින් සදහන් වෙන්නේ රෙන්ඩර් කරන ලද sprites  ඇදීම සදහා පිළියෙළ කරන අයුරුයි.

  1. Deffered – end මෙතඩ් එක කෝල් කරන කන් sprite ටික stack කර තබාගෙන කෝල් කිරීමෙන් පසු එම sprite සාදන අනුපිලිවෙලින් යැවීම
  2. Immediate – Begin මෙතඩ් එක කෝල් කල වහ sprite යැවීම අරබිම..
  3. Texure –  Deffered ක්‍රමයට සමානයි නමුත් sequence එක ඇදීමට පෙරම තීරණය කරයි.
  4. BackToFront – layer Depth parameter පාවිච්චි කර sprites පිටුපස සිට ඉදිරිපසට පිළිවෙල කරයි.
  5. FrontToBack – Layer Depth parameter පාවිච්චි කර  sprites ඉදිරිපස සිට පසුපසට පිළිවෙල කරයි..

 

BlendState –   sprite වල වර්ණයන් බැක්ග්‍රවුන්ඩ් වර්ණ සමග සංයෝජනය වන අයුරු විස්තර කරයි. දැනට එහි ක්‍රම 4 විස්තර කිරීම ප්‍රයෝගික නොවන නිසා දැනට  AlphaBlend යන්න යොදා ගන්න. පසුව උදාහරණ යෙදෙන තැන්වලදී එය ගැන කීම වඩාත් සුදුසුයි.. දැනට AlphaBlend ලෙස එතනට යොදන්න.

example :

protected override void Draw(GameTime gameTime)

{

GraphicsDevice.Clear(Color.CornflowerBlue);

// TODO: Add your drawing code here

spriteBatch.Begin(SpriteSortMode.FrontToBack, BlendState.AlphaBlend);

spriteBatch.Draw(texture, Vector2.Zero, null, Color.White, 0, Vector2.Zero , 1,  SpriteEffects.None,  0);

spriteBatch.Draw(texture, new Vector2(150, 150), null, Color.Black, 0, Vector2.Zero, 1.5f, SpriteEffects.FlipHorizontally,1);

spriteBatch.End();

base.Draw(gameTime);

}

 

මේ සම්බන්දව ගැටලුවක් ඇත්නම් ඇත්නම් කොමෙන්ටුවක් දැමීම හෝ  TechKatha වෙත ලියන්න. ඒවගේම ලියන ආකාරය වෙනස් විය යුතු යයි සිතෙනවා නම් එයත් අපට දන්වන්න. ඊලග ලිපියෙන් animation කරන හැටි කියන්න බලාපොරොත්තු වෙනවා.  ඔබ සැමට සුභ සතියක් 🙂

මෙවර වැඩසටහන මෙතනින් ගන්න.

 

– Prasad Jayashanka –

Read more from Articles, Guides, How To
7 Comments Post a comment
  1. sanjeewa
    Feb 20 2013

    ela ela ohoma yan.. api balagena innawa

    Reply
  2. sandun dhamika
    Feb 22 2013

    if you could, publish this kind of articles in wikimedia.
    if you are using wordpress CMS then I think you could use ,

    I know you already know this. But me too have this problem.
    Then I make a keeping a quick make a quick reference card on
    how to do typesetting on wordpress.

    That quick reference card work well for me.

    [sourcecode language=”csharp”]
    your code here
    [/sourcecode]

    I don’t know why different kind of CMS people use different kind of formatting syntax. This makes me nervous and it made me always
    to go and reference those quick reference sheets.

    Regards.
    Publish this comment if helpfull.

    Reply
  3. Feb 22 2013

    ela ela

    Reply
  4. Sajith
    Feb 23 2013

    god work bro.. keep updated

    Reply
  5. Gihan
    Feb 24 2013

    Elakiri Brother

    Good Job.

    Reply
  6. Sachith
    Feb 24 2013

    Ela ela

    Reply
  7. Prasad
    Feb 26 2013

    Thanks to all 🙂

    Reply

Share your thoughts, post a comment.

(required)
(required)

Note: HTML is allowed. Your email address will never be published.

Subscribe to comments

-->