Interakcije na dotik pri razvoju igre za operacije povlačenja v telefonu Windows Phone 7, del 3

Programiranje! - 3.Poskusite premakniti kartico na dotik

O tem vzorcu

Tokrat bi rad ustvaril progran, ki na zaslon in kraje postavi štiri karte in povleče karte na kraj, kjer se jih dotaknejo. To je multi-touch različica programa, ki je najprej povlekel sprite z miškinim razredom. Do sedaj je bilo veliko razlag, zato bi tokrat želel pojasniti predvsem o programu.

Cilji tega vzorčne programa

Povlecite več kartic hkrati, ko se dotaknete več dotikov.

Slika 1: Operacija vlečenja na več dotikov

Program - Razredi kartic

Ko gre za multi-touch, postane potrebno imeti več predmetov, zato bi tukaj rad ustvaril "Card" razred s sprite, da se premakne kot "kartico".

/// <summary>
/// ドラッグできるカード
/// </summary>
public class Card
{
  /// <summary>
  /// タッチ ID
  /// </summary>
  public int Id { get; set; }

  /// <summary>
  /// カードの位置
  /// </summary>
  public Vector2 Position { get; set; }

  /// <summary>
  /// カードの色
  /// </summary>
  public Color Color { get; set; }
}

Da koda ne bi bila preveč zapletena, ima razred kartice tri lastnosti: ID dotika, položaj in barvo. Ni posebnega elementa za podrobnost, vendar se "Touch ID" uporablja za preverjanje, katera točka dotika je povezana.

Program – deklariranje polj

Na njem ni nič drugega, kot da imajo razrede kartice, ki imajo informacije o karticah. Tokrat je kot uporaba prejšnjih vzorcev. Naredil sem štiri karte, vsaka z drugačno barvo, tako da lahko vidite razliko pri risanje.

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

/// <summary>
/// カードの一覧(4 枚分)
/// </summary>
Card[] cards = new Card[]
{
  new Card { Color = Color.White, },
  new Card { Color = Color.Yellow, },
  new Card { Color = Color.Fuchsia, },
  new Card { Color = Color.Aqua, },
};

Programsko – Dobi informacije o dotiku

V načinu »Game.Update«. To področje je formulično, zato ni nič posebej novega.

// タッチパネルの機能情報を取得
TouchPanelCapabilities capabilities = TouchPanel.GetCapabilities();

// タッチパネルが使用可能であるかチェック
if (capabilities.IsConnected)
{
  // 現在のタッチパネルの入力情報を取得
  TouchCollection touches = TouchPanel.GetState();

  //   :
  // ここに処理
  //   :
}

Program – Povezava ID-ja na dotik s kartico ob dotiku

V vzorčnem programu se naročilo obrne z vidika stroškov obdelave, vendar je lažje razumeti, če to razložite od tu, zato vam bom to najprej razložil.

Najprej se zakni skozi pridobljeni TouchCollection foreach, da dobiš vsak podatek.

/// タッチ情報の処理を行う
foreach (TouchLocation tl in touches)
{
  // タッチ状態を調べる
  switch (tl.State)
  {
    case TouchLocationState.Pressed:
      // タッチされた瞬間は空いているカードを検索して紐づける
      Card card = cards.Where(c => c.Id == 0).FirstOrDefault();
      if (card != null)
      {
          card.Id = tl.Id;
          card.Position = tl.Position;
      }
      break;
  }
}

Preverite lastnost »TouchLocation.State« in označite, da je »TouchLocationState.Pressed« trenutek, ko ste se ga dotaknili.

V tem vzorcu, če je ID kartice "0", je opredeljena, kot da se ne uporablja, zato "kartice. Kje(c => c.Id == 0). FirstOrDefault()" za iskanje kartice z ID-jem 0 s seznama kartic in pridobite to kartico, če jo najdete. Če ga ni mogoče najti, se vrne null. Tukaj LINQ imenuje načine razširitve, da poenostavi kodo, če pa vas skrbijo stroški obdelave, jih lahko poiščete enega za drugim z zanko.

Ko najdete kartico, nastavite ID na dotik in položaj dotika na kartici.

Program - ravnanje s karticami med dotikom in ob sprostitvi

Kartico ves čas hranite v stanju povleke, ko se je dotaknete, in ko jo spustite, jo odklopite iz točke dotika s kartico.

// 各カードの情報を調べる
foreach (Card card in cards)
{
  if (card.Id != 0)
  {
    // 紐づくタッチ情報がまだ存在するか ID で検索
    TouchLocation tl;
    if (touches.FindById(card.Id, out tl) == true)
    {
      // まだタッチされている場合は位置情報取得
      card.Position = tl.Position;
    }
    else
    {
      // すでにタッチ情報がなかったら紐付を外す
      card.Id = 0;
    }
  }
}

Začnite seznam kartic s predložem in obdelajte vsako kartico. Če je ID kaj drugega kot 0, je povezan z dotikno točko in proces se nadaljuje.

Struktura TouchCollection ponuja metodo »FindById«, ki omogoča pridobivanje informacij o dotiku za navedeni ID, če obstaja. Če lastnost Card.Id 0, lahko domnevamo, da je povezana z neko točko dotika, zato bomo poskušali dobiti informacije o dotiku z metodo FindById.

Če se metoda FindById vrne v veljavi, je še vedno v stanju dotika, tako da dobi položaj dotika iz lastnosti TouchLocation.Position in jo nastavite v razredu kartice. Če se metoda FindById vrne napačno, se dotik sprosti, zato nastavite Card.ID na 0 in ga nastavite tako, da se ga nihče ne dotika.

Program – Risane karte

Parametri, ki so potrebna za risanje, bi morali biti že nastavljeni na razred Kartice, tako da ni nič novega.

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

// 各カードを描画
foreach (Card card in cards)
{
  spriteBatch.Draw(texture, card.Position, card.Color);
}

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

Povzetek tega vzorca

Tokrat sem poskušal ustvariti slikovni program, ki uporablja več dotikov za dejansko premikanje predmetov v igri. Opazili smo tudi, da je bilo pri vleki več kart hkrati z uporabo ID-ja informacij o dotiku gibanje kartic dosledno, tudi če je bil drugi prst spet dvigan ali se ga je dotaknil.

Ta vzorec je le vzorec in izvaja se le enostavna obdelava. Vendar pa je treba osnovni del operacije z več dotiki s ploščo na dotik pokriti z dejanski programiranje igre, zato ga uporabite za obdelavo na več dotikov, ki je primerna za vašo igro na podlagi tega.