ونڈوز فون 7 حصہ 4 چوٹکی کے لئے کھیل کی ترقی میں ٹچ تعامل

پروگرامنگ! - 4. چوٹکی، پیمانے پر اسپرائٹس کو بڑھانے کے لئے

اس نمونے کے بارے میں

جدید اسمارٹ فونز ، جیسے تصویری ناظرین ، آپ کو اپنی انگلیوں کے مابین فاصلے کو بڑھانے یا سکڑنے کے لئے دو انگلیوں کا استعمال کرکے کسی تصویر کو بڑھانے اور سکڑنے کی اجازت دیتے ہیں۔ آپ ونڈوز فون 7 پر انٹرنیٹ ایکسپلورر کے ساتھ بھی ایسا ہی کرسکتے ہیں۔ اس عمل کو ونڈوز فون 7 میں "چوٹکی ، کھینچنا" کہا جاتا ہے۔

پنچنگ اور کھینچنے کے علاوہ ، آپ اسکرین پر ایک نقطہ کو مختصر طور پر چھونے (نل) کرنے کے لئے "ٹیپ" اور اسکرین کو جلدی سے ٹریس کرنے کے لئے "فلک" جیسے اقدامات بھی استعمال کرسکتے ہیں۔ ان اعمال کو اجتماعی طور پر اشاروں کے طور پر جانا جاتا ہے۔

اس پروگرام میں ، میں اس چوٹکی اور کھینچنے والے آپریشن کے ذریعہ اسکرین پر دکھائے جانے والے اسپرائٹ کو بڑھانا اور کم کرنا چاہتا ہوں۔ نیز ، آخری بار تک ، میں نے براہ راست ٹچ پینل کی معلومات حاصل کیں اور اس پر عملدرآمد کیا ، لیکن اس بار میں اشاروں کے لئے وقف طریقوں کا استعمال کرتے ہوئے ٹچ آپریشنز کو سنبھالنا چاہوں گا۔

اس نمونے کے پروگرام کے اہداف

اسپرائٹ کو بڑھانے اور سکڑنے کے لئے چوٹکی اور کھینچنے والے آپریشن۔

شکل 1: اسپرائٹ کو بڑھانے کے لئے کھینچیں

پروگرام - قطعات کا اعلان

فیلڈ اعلامیہ میں کوئی نئی کلاس نہیں ہے ، لیکن اس میں "ساخت کا مرکز کوآرڈینیٹ"، "اسپرائٹ کی میگنیفیکیشن" ، اور "پنچنگ کرتے وقت آخری دو ٹچ پوزیشنوں کے مابین فاصلہ" ہے۔

/// <summary>
/// テクスチャー
/// </summary>
Texture2D texture;

/// <summary>
/// テクスチャーの中心座標
/// </summary>
Vector2 textureCenterPos;

/// <summary>
/// スプライトのスケール
/// </summary>
float scale = 1;

/// <summary>
/// 前回の 2 点間の距離
/// </summary>
float previousLength = 0;

پروگرام - اشاروں کو فعال کرنا

اس بار ، ہم صرف اشارے کا عمل انجام دیں گے ، لیکن پہلے سے طے شدہ حالت میں ، کوئی بھی اشارہ استعمال نہیں کیا جاسکتا ہے۔ ہر اشارے کی معلومات کو بازیافت کرنے کے لئے، آپ کو ٹچ پینل.فعال اشاروں کی خاصیت کے لئے استعمال کرنے کے لئے اشارہ سیٹ کرنا ہوگا۔

// タッチパネルでピンチのジェスチャーを有効にする
TouchPanel.EnabledGestures = GestureType.Pinch | GestureType.PinchComplete;

تمام اشاروں کو چالو کرنے سے کارکردگی متاثر ہوتی ہے ، لہذا اس بات کو یقینی بنائیں کہ آپ صرف ان اشاروں کو مرتب کریں جو آپ استعمال کرنا چاہتے ہیں۔ یہاں ، "جیسچر ٹائپ.پنچ" کو چوٹکی آپریشن کی معلومات حاصل کرنے کے لئے مقرر کیا گیا ہے اور "جیسچر ٹائپ.پنچ مکمل" اس بات کی نشاندہی کرنے کے لئے مقرر کیا گیا ہے کہ چوٹکی کا عمل مکمل ہوچکا ہے۔ ترتیب کا مقام گیم کنسٹرکٹر میں سیٹ کیا گیا ہے۔

پروگرام - بناوٹ لوڈ کر رہا ہے

لوڈنگ بناوٹ پہلے کی طرح ہی ہے ، لیکن اس بار ہم "ساخت کے مرکز کوآرڈینیٹ" کا حساب لگا رہے ہیں۔ اس کی وجہ یہ ہے کہ جب اسپرائٹ کی پیمائش کی جاتی ہے تو ، یہ اصل کے طور پر مرکز کوآرڈینیٹ کے ساتھ ترازو کرتا ہے۔

// テクスチャーをコンテンツパイプラインから読み込む
texture = Content.Load<Texture2D>("Texture");

// テクスチャーの中心座標を求める
textureCenterPos = new Vector2(texture.Width / 2, texture.Height / 2);

پروگرام - اشارے کی معلومات حاصل کریں

ہمیں گیم اپ ڈیٹ کے طریقہ کار میں اشارے کی معلومات (یہاں چوٹکی) ملتی ہے۔ اشارہ پروسیسنگ اتنے ہی اشاروں کو دہرانے کی شکل میں ہے جتنا آپ نے فعال کیا ہے۔ "ٹچ کلیکشن" ڈھانچہ جو آخری وقت تک استعمال کیا گیا تھا استعمال نہیں کیا جاتا ہے۔

// 次のジェスチャー情報が取得できる場合は true を返し続けます
while (TouchPanel.IsGestureAvailable)
{
  // 次のジェスチャー情報を読み込みます
  GestureSample gs = TouchPanel.ReadGesture();
  
  switch (gs.GestureType)
  {
    case GestureType.Pinch:
      // ここにピンチ処理を記述します
      break;
    case GestureType.PinchComplete:
      // ここにピンチ完了処理を記述します
      break;
  }
}

اشارے کی معلومات کے لئے جبکہ لوپ میں ٹچ پینل.اشارہ دستیاب پراپرٹی کی حالت چیک کریں اور چیک کریں کہ آیا مندرجہ ذیل اشارے کی معلومات موجود ہے: اگر آپ کے پاس مندرجہ ذیل اشارے کی معلومات ہیں تو ، اشارے کی معلومات حاصل کرنے کے لئے "ٹچ پینل.ریڈ اشارہ" کا طریقہ استعمال کریں۔

"جیسچر سیمپل.جیسچر ٹائپ" اس بارے میں معلومات ذخیرہ کرتا ہے کہ کس اشارے کی قسم شامل ہے ، لہذا اس پر مبنی سوئچ اسٹیٹمنٹ کے ساتھ اس عمل کو برانچ کریں۔ اس نمونے میں ، کنسٹرکٹر "جیسچر ٹائپ.پنچ" اور "جیسچر ٹائپ.پنچ کمپلیٹ" کو "ٹچ پینل.فعال اشارے" پراپرٹی میں شامل کرتا ہے ، لہذا وہ بالترتیب برانچڈ ہیں۔

پروگرام - پنچ اشارہ ہینڈلنگ

ہم جو کچھ کر رہے ہیں اس کے لئے کوڈ میں تبصروں کو دیکھنا تیز تر ہے ، لیکن ہم جو کچھ کر رہے ہیں اس کا خلاصہ کرنے کے لئے ، ہم پچھلے دو ٹچ پوائنٹس کے مابین فاصلے اور اس بار دو پوائنٹس کے مابین ٹچ پوائنٹ فاصلے کے مابین فرق تلاش کرتے ہیں ، اور اس فرق کو اسکیل ویلیو کو بڑھانے یا کم کرنے کے لئے استعمال کرتے ہیں۔

case GestureType.Pinch:
  // 現在の２点間の距離を求めます
  float nowLength = (gs.Position - gs.Position2).Length();

  if (previousLength == 0)
  {
    // 前回の２点間の距離が 0 の場合は
    // 現在の２点間の距離を設定します
    // 初回はスケール計算を行いません
    previousLength = nowLength;
  }
  else
  {
    // 前回の２点間の距離との差分を計算します
    float diffLength = nowLength - previousLength;
    
    // ピンチ、ストレッチした距離に応じて
    // スケールを変化させています
    // 補正値は適当に設定します
    scale = MathHelper.Max(scale + diffLength / 150, 0);
    
    // 今回の距離を次の計算のために保持します
    previousLength = nowLength;
  }
  break;

دو ٹچ پوزیشنوں کو بالترتیب "جیسچر سیمپل.پوزیشن" اور "جیسچر سیمپل.پوزیشن 2" کے ساتھ حاصل کیا جاسکتا ہے۔ آپ دو حاصل کردہ ویکٹروں کے مابین فرق کو گھٹا سکتے ہیں اور "ویکٹر 2.لمبائی" کے طریقہ کار کو کال کرکے دو نکات کے مابین فاصلہ تلاش کرسکتے ہیں۔

ویسے ، یہاں ہم پچھلے فاصلے کو 0 کے طور پر بیان کرتے ہیں جب پنچنگ نہیں کی جاتی ہے ، لہذا جب پنچنگ شروع ہوتی ہے اور دوسرے اور اس کے بعد کے لوپس میں اس عمل کو برانچ کیا جاتا ہے۔ اس کی وجہ یہ ہے کہ چوٹکی لگانے کا پہلا وقت ، کوئی پچھلا فاصلہ نہیں ہے ، لہذا پیمائش کرنے کی ضرورت نہیں ہے۔

نیز ، اس بار ہم صرف دو خصوصیات استعمال کرتے ہیں ، "جیسچر سیمپل.پوزیشن" اور "جیسچر سیمپل.پوزیشن 2"، لیکن "جیسچر سیمپل.ڈیلٹا" اور "جیسچر سیمپل.ڈیلٹا 2" خصوصیات بھی موجود ہیں ، جو پچھلے ٹچ پوزیشن سے فرق کی معلومات حاصل کرسکتی ہیں۔ ہر ایک میں دو خصوصیات ہیں ، لیکن یہ ملٹی ٹچ کے لئے ہے ، اور اشاروں کے لئے جو صرف ایک ٹچ استعمال کرتے ہیں ، آپ "2" کے بغیر خصوصیات استعمال کریں گے۔

پروگرام - جب چوٹکی کا اشارہ مکمل ہوتا ہے تو ہینڈلنگ

جب چوٹکی کا اشارہ مکمل ہوجاتا ہے (ٹچ پینل سے کسی بھی انگلی کو جاری کرنا) ، پچھلے دو نکات کے مابین فاصلہ 0 پر واپس سیٹ ہوجاتا ہے۔ اصل میں ، ایک علیحدہ پرچم استعمال کرنا بہتر ہوسکتا ہے ، لیکن چونکہ دو انگلیوں سے ایک ہی پوزیشن کو چھونا جسمانی طور پر ناممکن ہے ، لہذا 0 کے فاصلے کو چوٹکی نہ لگانے کے طور پر بیان کیا گیا ہے۔ (اگر ریزولوشن کم ہے تو ، اسی پوزیشن کو چھونا ممکن ہوسکتا ہے ...)

case GestureType.PinchComplete:
  // ピンチが終了した場合は保持している距離を 0 に戻して
  // 完了したことにします
  previousLength = 0;
  break;

پروگرام - ڈرائنگ اسپرائٹس

میں یہاں بہت زیادہ تفصیل میں نہیں جاؤں گا کیونکہ یہ صرف اسپرائٹ کو ڈرائنگ کرنے کے بارے میں ہے ، لیکن میں نے اسپرائٹ کو اسکرین کے وسط میں رکھا اور اسپرائٹ کے مرکز کے ساتھ اسے بڑھا کر اور سکڑ کر حساب شدہ پیمانے کی قدر کو اپنی طرف متوجہ کیا۔

// スプライトの描画準備
spriteBatch.Begin();

// スプライトを描画する
spriteBatch.Draw(texture,
                 new Vector2(graphics.PreferredBackBufferWidth / 2,
                             graphics.PreferredBackBufferHeight / 2),
                 null,
                 Color.White,
                 0.0f,
                 textureCenterPos,
                 scale,
                 SpriteEffects.None,
                 0.0f);

// スプライトの一括描画
spriteBatch.End();

اس نمونے کا خلاصہ

اس بار، ہم نے اشاروں کے لئے وقف عمل کی وضاحت کی. نمونے میں، ہم صرف ایک چوٹکی کا عمل بناتے ہیں، لیکن "فلکس" اور "ہولڈز" بھی موجود ہیں. یہ جاننے کے لئے کہ کون سے اشارے دستیاب ہیں ، ایکس این اے گیم اسٹوڈیو 4.0 مدد برائے اشارہ ٹائپ اینومز چیک کریں۔

آپ اشارے سے متعلق مخصوص طریقوں یا ڈھانچے کا استعمال کیے بغیر ٹچ پینل سے حاصل کردہ ٹچ انفارمیشن سے اسی چیز کو نافذ کرسکتے ہیں ، لیکن اس صورت میں ، آپ کو ملٹی ٹچ آئی ڈی مینجمنٹ ، ٹچ ٹائم ، فلکس وغیرہ کی رفتار کا حساب لگانے کی ضرورت ہوگی۔ اشاروں سے متعلق مخصوص طریقوں کا استعمال کرتے ہوئے ، ان نفاذ کو آسان بنایا جاسکتا ہے ، اور اس کا فائدہ یہ بھی ہے کہ تمام کھیلوں اور ایپلی کیشنز کو اسی طرح چلایا جاسکتا ہے۔

جب آپ اپنے آپ کو ٹچ پینل کا عمل بناتے ہیں تو ، اگر آپ اشارے کے طور پر اسی طرح کے عمل کو تبدیل کرسکتے ہیں تو ، ہم سفارش کرتے ہیں کہ آپ اس کا استعمال کریں۔

پروگرامنگ! - 5. سپرائٹس کو گھمانے کے لئے چوٹکی

اس نمونے کے بارے میں

پنچنگ سے مراد عام طور پر "پنچنگ" اور "کھینچنا" ہوتا ہے ، لیکن ایکس این اے گیم اسٹوڈیو 4.0 کا چوٹکی کا عمل خاص طور پر اس عمل کو ان دونوں تک محدود نہیں کرتا ہے ، لہذا آپ ایسے آپریشن بھی انجام دے سکتے ہیں جو کسی دوسرے ٹچ پوائنٹ کے آس پاس ایک ٹچ پوائنٹ کو گھیرتے ہیں۔

یہاں ، میں اس آپریشن کے طریقہ کار کے ساتھ اسپرائٹ کو گھمانا چاہتا ہوں۔ ویسے، اس بار کوئی نیا طریقہ کار یا کلاسیں ظاہر نہیں ہوئیں، اور یہ پچھلے اسکیلنگ پر مبنی ہے.

اس مضمون میں نمونہ کوڈ کی وضاحت میں، پچھلے اسکیلنگ نمونے کے طور پر ایک ہی حصوں کو چھوڑ دیا جاتا ہے.

اس نمونے کے پروگرام کے اہداف

دو ٹچ پوائنٹس کو گھمانے سے ، اسپرائٹ گھومتا ہے۔ پچھلا اسکیلنگ آپریشن بھی کام کرتا ہے۔

شکل 2: ٹچ پوائنٹ کو موڑ کر اسپرائٹ کو گھمانا۔

پروگرام - قطعات کا اعلان

"سپرائٹ گردش کی رقم" اور "آخری گردش زاویہ" پچھلے اسکیلنگ پروگرام میں شامل کیے جاتے ہیں. تمام زاویوں کا حساب ریڈین میں کیا جاتا ہے۔

/// <summary>
/// スプライトの回転量(radian)
/// </summary>
float rotate;

/// <summary>
/// 前回の回転角度(radian)
/// </summary>
float previousAngle;

پروگرام - گردش کا عمل

گردش کا عمل چوٹکی کے اشاروں کے دوران اسی طرح انجام دیا جاتا ہے جیسے اسکیلنگ کرتے وقت ہوتا ہے۔

میں گردش کا حساب لگانے کے بارے میں بہت زیادہ تفصیل میں نہیں جاؤں گا کیونکہ یہ ریاضی کی کہانی ہے ، لیکن آپ ٹچ پوائنٹ 1 سے ٹچ پوائنٹ 2 تک فرق ویکٹر تلاش کرکے "ریاضی ڈاٹ اٹان 2" طریقہ کار کے ساتھ زاویہ ریڈین حاصل کرسکتے ہیں۔ حاصل کردہ زاویہ اور پہلے سے حاصل کردہ زاویہ کے مابین فرق تلاش کریں اور اسے اسپرائٹ کے گردش زاویہ میں شامل کریں۔

switch (gs.GestureType)
{
  case GestureType.Pinch:
    //===== スケール計算 =====//
    // 前回と同じなので省略

    //===== 回転計算 =====//

    // ２点間のベクトルを求めます
    Vector2 pinchVector = gs.Position2 - gs.Position;

    // Atan2 で角度を求めます
    float nowAngle = (float)Math.Atan2(pinchVector.Y,
                                       pinchVector.X);

    if (previousAngle == 0)
    {
      // 前回の角度が 0 の場合は
      // 現在の角度を設定します
      // 初回は回転計算を行いません
      previousAngle = nowAngle;
    }
    else
    {
      // 前回の角度との差分をスプライトの回転角度に加算します
      rotate += nowAngle - previousAngle;

      // 今回の距離を次の計算のために保持します
      previousAngle = nowAngle;
    }
    break;
  case GestureType.PinchComplete:
    // ピンチが終了した場合は保持している距離、角度を 0 に戻して
    // 完了したことにします
    previousLength = 0;
    previousAngle = 0;
    break;
}

پروگرام - ڈرائنگ اسپرائٹس

ڈرائنگ اسپرائٹس میں کوئی بڑی تبدیلیاں نہیں ہیں۔ اسپرائٹ بیکتھ.ڈرا طریقہ کار کی پانچویں دلیل حساب شدہ گردش زاویہ پر سیٹ کی گئی ہے۔

// スプライトの描画準備
spriteBatch.Begin();

// スプライトを描画する
spriteBatch.Draw(texture,
                 new Vector2(graphics.PreferredBackBufferWidth / 2,
                             graphics.PreferredBackBufferHeight / 2),
                 null,
                 Color.White,
                 rotate,
                 textureCenterPos,
                 scale,
                 SpriteEffects.None,
                 0.0f);

// スプライトの一括描画
spriteBatch.End();

اس نمونے کا خلاصہ

اس بار ، میں نے چوٹکی کے آپریشن کے ذریعہ اسپرائٹ کو گھمانے کی کوشش کی۔ ہم خاص طور پر کسی بھی نئی کلاسوں کا استعمال نہیں کرتے ہیں، لیکن مجھے امید ہے کہ آپ سمجھتے ہیں کہ ہم فراہم کردہ افعال کی بنیاد پر لاگو پروسیسنگ کا احساس کرسکتے ہیں.

آخر کار

ہم نمونوں کے ذریعے چلے گئے اور ونڈوز فون 7 اور ایکس این اے گیم اسٹوڈیو 4.0 کا استعمال کرتے ہوئے ٹچ تعامل کے نفاذ کا مظاہرہ کیا۔ مواد میں سنگل ٹچ اور ملٹی ٹچ ٹچ حصول اور ٹچ کی معلومات میں ہیرا پھیری ، اور اشارے کے مخصوص طریقوں کا استعمال کرتے ہوئے ٹچ اشارہ ہیرا پھیری کے ذریعہ پروسیسنگ شامل تھی۔

اس بار، میں نے ٹچ پینل پر توجہ مرکوز کی ہے، لیکن اب بھی کچھ افعال ہیں جو میں نے ابھی تک متعارف نہیں کرایا ہے. ونڈوز فون 7 میں ایکس این اے گیم اسٹوڈیو 4.0 میں نئی ان پٹ خصوصیات بھی شامل ہیں ، جیسے ایکسلرومیٹر ان پٹ اور صوتی ان پٹ۔ کچھ دلچسپ خصوصیات ہیں جو میں اس بار متعارف نہیں کرا سکا، لہذا براہ کرم ان افعال کو تلاش کرنے سے لطف اندوز کریں جو آپ استعمال کرنا چاہتے ہیں.