Interacció tàctil en el desenvolupament de jocs per al Windows Phone 7 Part 1 Conceptes bàsics d'interacció tàctil

Introducció al Windows Phone 7

Plataforma d'aplicacions del Windows Phone 7

L'entorn de desenvolupament de Windows Phone 7 es va llançar oficialment el setembre de 2010 i els telèfons intel·ligents que realment executen Windows Phone 7 han començat a sortir al mercat.

Figura 1: Trofeu HTC 7 amb Windows Phone 7 venut per HTC

Quan creeu una aplicació que s'executa al Windows Phone 7, podeu triar entre "Silverlight" i "XNA Framework" com a marc del programa. En general, utilitzaràs "XNA Framework" per al desenvolupament de jocs i "Silverlight" per a altres aplicacions com ara eines.

Aquesta secció utilitza el XNA Framework per al desenvolupament de jocs i explica com utilitzar el tauler tàctil, que serà la interfície d'usuari més utilitzada per a Windows Phone 7. L'ús senzill es descriu a l'ajuda de XNA Game Studio, així que m'agradaria explicar-ho d'una manera una mica més profunda aquí.

Prepara el teu entorn de desenvolupament

Aquesta secció és des de la perspectiva d'algú que fins i tot ha tocat lleugerament XNA Game Studio, de manera que ometré instruccions detallades com la instal·lació i la configuració. Hi ha molta informació a l'ajuda que inclou XNA Game Studio i al web, així que comproveu-ho vosaltres mateixos. També en tinc alguns al meu lloc (http://sorceryforce.com/xna/).

• Eines per a desenvolupadors del Windows Phone
• Zune Programari
• Un dispositiu real amb el Windows Phone 7 o un entorn multitàctil del Windows 7
• Aplicació de registre de desenvolupadors del Windows Phone

Figura 2: Microsoft Visual Studio 2010 Express per al Windows Phone (inclòs a les Eines per a desenvolupadors del Windows Phone)

Figura 3: Emulador del Windows Phone

Programació! - 1. Obtenir informació tàctil

Sobre aquesta mostra

La versió del XNA Framework utilitzada a Windows Phone 7 és "4.0", però fins aleshores no hi havia classes per a panells tàctils, i teclats, ratolins i gamepads eren el corrent principal. Des de la 4.0, s'ha donat suport a Windows Phone 7 i s'ha afegit una nova classe dedicada als panells tàctils.

En aquest article, explicarem principalment aquesta classe, però de fet, si voleu obtenir informació senzilla sobre la posició tàctil, podeu substituir una altra classe sense utilitzar una classe per panells tàctils. És la classe "Ratolí". En aquesta mostra, utilitzarem la classe del ratolí per obtenir informació tàctil.

Objectius d'aquest programa de mostra

Quan toqueu la pantalla, la imatge (sprite) es col·loca segons la posició tàctil.

Figura 3,4: Els sprites apareixen en posicions tocades

Programa - Declaració de Camps

M'agradaria explicar-ho juntament amb el programa de mostra de seguida. S'ometen explicacions de parts que no estan directament relacionades amb el funcionament tàctil i els programes creats des del principi, així que si us plau, consulteu el codi font distribuït per separat.

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

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

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

  public Game1()
  {

El camp declara una textura per dibuixar a la ubicació tàctil i una variable d'estructura Vector2 per emmagatzemar la posició tàctil.

Programa - Càrrega de textures

Les textures ja s'afegeixen al projecte de contingut i es carreguen amb el mètode LoadContent. Com que el contingut no està directament relacionat amb panells tàctils, s'ometen explicacions detallades.

Figura 6: afegiu una textura.png al vostre projecte de contingut

Figura 7: Imatge utilitzada en aquesta mostra

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

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

Programa - Adquisició d'informació tàctil

La informació tàctil es recupera al mètode Game.Update.

Estic rebent la informació tàctil utilitzant la classe "Ratolí" en lloc d'una classe dedicada. Quan utilitzeu el mètode "Mouse.GetState", l'estat actual del ratolí es retorna a l'estructura "MouseState", de manera que podeu obtenir la posició tàctil des de les propietats "MouseState.X" i "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);
}

Una cosa a tenir en compte sobre l'ús de la classe Mouse per obtenir informació tàctil és que només retorna informació senzilla. Les úniques restriccions a la informació que es poden obtenir quan s'utilitza la classe Mouse són "només tàctil únic", "posició tàctil (mousestate.X, propietat MouseState.Y)" i "si s'ha de tocar o no (MouseState.LeftButton)". No admet multitàctils ni gestos. A més, si aconsegueixes una posició quan no l'has tocat, continuarà retornant la posició tàctil anterior. Com que la informació d'entrada no es pot rebre tret que es toqui, no es pot adquirir informació d'ubicació, com ara el ratolí.

Programa - Dibuix de Textures

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

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

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

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

  base.Draw(gameTime);
}

Resum d'aquesta mostra

Atès que la classe Mouse substitueix l'adquisició d'informació tàctil, la informació només es pot obtenir obtenint la posició tàctil com en aquesta mostra. Per contra, si utilitzeu una classe només tàctil, podeu obtenir més informació.

Per tant, no està exempt de mèrit obtenir informació tàctil mitjançant la classe Mouse. L'ús de la classe Mouse proporciona els següents avantatges:

• Pot compartir codi amb jocs habilitats pel ratolí que s'executen a Windows
• La informació d'ubicació tàctil es pot escriure amb la menor quantitat de codi
• Es pot ometre un processament innecessari

Si només utilitzeu un sol toc i només posicionament tàctil, podeu aprofitar els avantatges anteriors utilitzant la classe Mouse.