การโต้ตอบแบบสัมผัสในการพัฒนาเกมสําหรับ Windows Phone 7 ส่วนที่ 1 พื้นฐานการโต้ตอบแบบสัมผัส

ปรับปรุงหน้า : วันอาทิตย์ที่ 30 ตุลาคม พ.ศ. 2565

วันที่สร้างเพจ : วันศุกร์ที่ 10 เมษายน พ.ศ. 2563

เริ่มต้นใช้งาน Windows Phone 7

โทรศัพท์ Windows 7 แพลตฟอร์มแอพลิเคชัน

สภาพแวดล้อมการพัฒนา Windows Phone 7 ได้รับการเผยแพร่อย่างเป็นทางการในเดือนกันยายน 2010 และสมาร์ทโฟนที่ใช้ Windows Phone 7 ได้เริ่มเข้าสู่ตลาดแล้ว

図 1 ：HTC から販売されている Windows Phone 7 を搭載した「HTC 7 Trophy」
รูปที่ 1: ถ้วยรางวัล HTC 7 พร้อมวินโดวส์โฟน 7 ที่จําหน่ายโดย HTC

เมื่อคุณสร้างโปรแกรมประยุกต์ที่ทํางานบน Windows Phone 7 คุณสามารถเลือกระหว่าง "Silverlight" และ "กรอบงาน XNA" เป็นกรอบการทํางานของโปรแกรม โดยทั่วไปคุณจะใช้ "XNA Framework" สําหรับการพัฒนาเกมและ "Silverlight" สําหรับแอปพลิเคชันอื่น ๆ เช่นเครื่องมือ

ส่วนนี้ใช้ XNA Framework สําหรับการพัฒนาเกมและอธิบายวิธีใช้แผงสัมผัสซึ่งจะเป็นอินเทอร์เฟซผู้ใช้ที่ใช้มากที่สุดสําหรับ Windows Phone 7 การใช้งานที่เรียบง่ายอธิบายไว้ในวิธีใช้ XNA Game Studio ดังนั้นฉันต้องการอธิบายในเชิงลึกเพิ่มเติมเล็กน้อยที่นี่

เตรียมสภาพแวดล้อมการพัฒนาของคุณ

ส่วนนี้มาจากมุมมองของใครบางคนที่ได้สัมผัส XNA Game Studio แม้แต่น้อยดังนั้นฉันจะละเว้นคําแนะนําโดยละเอียดเช่นการติดตั้งและการตั้งค่า มีข้อมูลมากมายในความช่วยเหลือที่มาพร้อมกับ XNA Game Studio และบนเว็บดังนั้นโปรดตรวจสอบด้วยตัวคุณเอง ฉันยังมีบางส่วนในเว็บไซต์ของฉัน (http://sorceryforce.com/xna/)

เครื่องมือสําหรับนักพัฒนาโทรศัพท์ที่ใช้ Windows
ซอฟต์แวร์ Zune
อุปกรณ์จริงที่ใช้ Windows Phone 7 หรือสภาพแวดล้อมแบบมัลติทัชของ Windows 7
แอปพลิเคชันการลงทะเบียนนักพัฒนาซอฟต์แวร์ Windows Phone

図 2 ：Microsoft Visual Studio 2010 Express for Windows Phone(Windows Phone Developer Tools に含まれます)
รูปที่ 2: ไมโครซอฟท์วิชวลสตูดิโอ 2010 Express สําหรับวินโดวส์โฟน (รวมอยู่ในเครื่องมือสําหรับนักพัฒนาวินโดวส์โฟน)

図 3 ：Windows Phone エミュレーター
รูปที่ 3: วินโดวส์โฟนอีมูเลเตอร์

โปรแกรม! - 1. รับข้อมูลการสัมผัส

เกี่ยวกับตัวอย่างนี้

เวอร์ชันของ XNA Framework ที่ใช้ใน Windows Phone 7 คือ "4.0" แต่จนถึงตอนนั้นยังไม่มีคลาสสําหรับแผงสัมผัสและแป้นพิมพ์เมาส์และเกมแพดเป็นกระแสหลัก ตั้งแต่ 4.0 Windows Phone 7 ได้รับการสนับสนุนและมีการเพิ่มคลาสใหม่สําหรับแผงสัมผัสโดยเฉพาะ

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

เป้าหมายของโปรแกรมตัวอย่างนี้

เมื่อคุณสัมผัสหน้าจอภาพ (สไปรท์) จะถูกวางไว้ตามตําแหน่งสัมผัส

図 3,4 ：タッチした位置にスプライトが表示される
รูปที่ 3,4: สไปรท์ปรากฏที่ตําแหน่งที่สัมผัสได้

โปรแกรม - ประกาศสาขา

ฉันต้องการจะอธิบายพร้อมกับโปรแกรมตัวอย่างได้ทันที คําอธิบายของชิ้นส่วนที่ไม่เกี่ยวข้องโดยตรงกับการดําเนินการสัมผัสและโปรแกรมที่สร้างขึ้นตั้งแต่ต้นจะถูกละไว้ดังนั้นโปรดดูซอร์สโค้ดที่แจกจ่ายแยกต่างหาก

public class Game1 : Microsoft.Xna.Framework.Game
{
  GraphicsDeviceManager graphics;
  SpriteBatch spriteBatch;

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

  /// <summary>
  /// タッチしている位置
  /// </summary>
  Vector2 touchPosition;

  public Game1()
  {

ฟิลด์จะประกาศพื้นผิวที่จะวาดที่ตําแหน่งสัมผัสและตัวแปรโครงสร้าง Vector2 เพื่อจัดเก็บตําแหน่งการสัมผัส

โปรแกรม - กําลังโหลดพื้นผิว

พื้นผิวถูกเพิ่มลงในโครงการเนื้อหาแล้วและโหลดด้วยวิธี LoadContent เนื่องจากเนื้อหาไม่เกี่ยวข้องโดยตรงกับแผงสัมผัสจึงละเว้นคําอธิบายโดยละเอียด

図 6 ：コンテンツプロジェクトに「Texture.png」を追加しておく
รูปที่ 6: เพิ่มพื้นผิว.pngโปรเจ็กต์เนื้อหาของคุณ

図 7 ：今回サンプルで使用する画像
รูปที่ 7: รูปภาพที่ใช้ในตัวอย่างนี้

protected override void LoadContent()
{
  // 新規の SpriteBatch を作成します。これはテクスチャーの描画に使用できます。
  spriteBatch = new SpriteBatch(GraphicsDevice);

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

โปรแกรม -- สัมผัสการได้มาซึ่งข้อมูล

ข้อมูลการสัมผัสจะถูกดึงมาในเมธอด Game.Update

ฉันได้รับข้อมูลการสัมผัสโดยใช้คลาส "เมาส์" แทนจากคลาสเฉพาะ เมื่อใช้วิธีการ "Mouse.GetState" สถานะเมาส์ปัจจุบันจะถูกส่งกลับในโครงสร้าง "MouseState" เพื่อให้คุณสามารถรับตําแหน่งการสัมผัสจากคุณสมบัติ "MouseState.X" และ "MouseState.Y"

protected override void Update(GameTime gameTime)
{
  // ゲームの終了条件をチェックします。
  if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed)
    this.Exit();

  // マウスの状態を取得(ここではタッチパネルの簡易的な情報)
  MouseState mouseState = Mouse.GetState();

  // タッチしている位置を設定
  touchPosition = new Vector2(mouseState.X, mouseState.Y);
  base.Update(gameTime);
}

สิ่งหนึ่งที่ควรทราบเกี่ยวกับการใช้คลาสเมาส์เพื่อรับข้อมูลการสัมผัสคือส่งคืนข้อมูลง่ายๆเท่านั้น ข้อจํากัดเพียงอย่างเดียวเกี่ยวกับข้อมูลที่สามารถรับได้เมื่อใช้คลาสเมาส์คือ "สัมผัสเดียวเท่านั้น", "ตําแหน่งการสัมผัส (คุณสมบัติ MouseState.X, MouseState.Y)" และ "ไม่ว่าจะสัมผัสหรือไม่ (MouseState.LeftButton)" ไม่รองรับมัลติทัชหรือท่าทางสัมผัส นอกจากนี้หากคุณได้รับตําแหน่งเมื่อคุณยังไม่ได้สัมผัสมันจะยังคงส่งคืนตําแหน่งสัมผัสก่อนหน้า เนื่องจากไม่สามารถรับข้อมูลอินพุตได้เว้นแต่จะสัมผัสข้อมูลตําแหน่งจึงไม่สามารถรับข้อมูลตําแหน่งได้เช่นเมาส์เมาส์

โปรแกรม - พื้นผิวการวาด

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

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

  // タッチしている位置にテクスチャーを描画
  spriteBatch.Draw(texture, touchPosition, Color.White);

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

  base.Draw(gameTime);
}

สรุปตัวอย่างนี้

เนื่องจากคลาสเมาส์แทนที่การได้มาซึ่งข้อมูลการสัมผัสจึงสามารถรับข้อมูลได้โดยการได้รับตําแหน่งสัมผัสเช่นเดียวกับในตัวอย่างนี้เท่านั้น ในทางกลับกันหากคุณใช้ชั้นเรียนแบบสัมผัสเท่านั้นคุณสามารถรับข้อมูลเพิ่มเติมได้

ดังนั้นจึงไม่ใช่การทําบุญที่จะได้รับข้อมูลการสัมผัสโดยใช้คลาสเมาส์ การใช้คลาสเมาส์ให้ประโยชน์ดังต่อไปนี้:

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

หากคุณใช้เพียงการสัมผัสเพียงครั้งเดียวและการวางตําแหน่งแบบสัมผัสเท่านั้นคุณสามารถใช้ประโยชน์จากประโยชน์ข้างต้นได้โดยใช้ระดับเมาส์

การโต้ตอบแบบสัมผัสในการพัฒนาเกมสําหรับ Windows Phone 7 ส่วนที่ 2 มัลติทัช