Interações de toque no desenvolvimento de jogos para as operações do Windows Phone 7, Parte 3 Drag

Programação! - 3.Tente mover o cartão para o toque

Sobre esta amostra

Desta vez, eu gostaria de criar um progran que coloca quatro cartas na tela e coloca e arrasta as cartas para o lugar onde são tocados. Esta é uma versão multi-touch do programa que primeiro arrastou um sprite com a classe Mouse. Até agora, houve muitas explicações, então desta vez eu gostaria de explicar principalmente sobre o programa.

Metas deste programa amostral

Arraste várias cartas ao mesmo tempo que você tocar com multi-toque.

Figura 1: Operação de arrasto multi-toque

Programa - Aulas de Cartões

Quando se trata de multi-toque, torna-se necessário ter vários objetos, então aqui eu gostaria de criar uma aula de "Cartão" com o sprite para ser movido como um "cartão".

/// <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; }
}

Para não tornar o código muito complicado, a classe do cartão tem três propriedades: iD de toque, posição e cor. Não há nenhum item específico para entrar em detalhes, mas "Touch ID" é usado para verificar qual ponto de toque está ligado.

Programa - Campos Declarando

Não há nada de novo nisso além de ter uma série de aulas de cartão para segurar informações do cartão. Desta vez, é como uma aplicação das amostras anteriores. Eu fiz quatro cartas, cada uma com uma cor diferente para que você possa ver a diferença ao desenhar.

/// <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, },
};

Programática - Obter informações sobre toque

Dentro do método Game.Update. Esta área é formulada, então não há nada particularmente novo.

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

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

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

Programa - Vincular um touch ID a um cartão quando tocado

No programa de amostra, a ordem é invertida do ponto de vista do custo de processamento, mas é mais fácil de entender se você explicar daqui, então vou explicar isso primeiro.

Primeiro, loop através da Coleta de Toques adquirida para obter cada informação.

/// タッチ情報の処理を行う
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;
  }
}

Verifique a propriedade "TouchLocation.State" para indicar que "TouchLocationState.Pressed" é o momento em que você tocou nele.

Nesta amostra, se o ID do cartão for "0", ele é definido como não sendo usado, então "cartões. Onde (c => c.Id == 0). FirstOrDefault()" para procurar um cartão com ID 0 da lista de cartões e recuperar esse cartão se encontrado. Se não for encontrado, nulo é devolvido. Aqui, os métodos de extensão são chamados pela LINQ para simplificar o código, mas se você está preocupado com os custos de processamento, você pode procurá-los um a um com um loop para.

Quando encontrar o cartão, defina o ID de toque e a posição de toque no cartão.

Programa - manuseio de cartões durante o toque e quando eles são liberados

Mantenha o cartão em estado de arrasto o tempo todo enquanto você tocá-lo, e quando você liberá-lo, ele será desconectado do ponto de toque para o cartão.

// 各カードの情報を調べる
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;
    }
  }
}

Loop a lista de cartões com foreach e processe cada cartão. Se o ID for algo diferente de 0, ele está ligado ao ponto de contato e o processo continua.

A estrutura TouchCollection fornece um método "FindById" que permite recuperar as informações de toque para o ID especificado, se existir. Se a propriedade Card.Id não for 0, podemos assumir que ela está associada a algum ponto de contato, por isso tentaremos obter as informações de toque com o método FindById.

Se o método FindById retornar verdadeiro, ele ainda está no estado de toque, então obtenha a posição de toque da propriedade TouchLocation.Position e coloque-a na classe de cartão. Se o método FindById retornar falso, o toque será liberado, então defina Card.ID para 0 e defina-o como ninguém está tocando nele.

Programa - Cartões de Desenho

Os parâmetros necessários para o desenho já devem ser definidos para a classe Card, então não há nada de novo.

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

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

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

Resumo desta amostra

Desta vez, tentei criar um programa de imagem que usa multi-toque para realmente mover objetos no jogo. Também observamos que quando várias cartas foram arrastadas ao mesmo tempo usando o ID das informações de toque, o movimento das cartas era consistente mesmo que o outro dedo fosse levantado ou tocado novamente.

Esta amostra é apenas uma amostra e apenas um processamento simples é realizado. No entanto, a parte básica da operação multi-toque pelo painel de toque deve ser coberta pela programação real do jogo, por isso aplique-o ao processamento multi-toque que se adapte ao seu jogo com base nisso.