Αλληλεπιδράσεις αφής στην ανάπτυξη παιχνιδιών για windows Phone 7 Μέρος 4 Τσίμπημα

Προγραμματισμός! - 4.Τσίμπημα, τέντωμα σε κλίμακα ξωτικά

Πληροφορίες για αυτό το δείγμα

Τα σύγχρονα smartphone, όπως τα προγράμματα προβολής εικόνων, σας επιτρέπουν να μεγεθύνετε και να συρρικνώσετε μια εικόνα χρησιμοποιώντας δύο δάχτυλα για να αυξήσετε ή να συρρικνώσετε την απόσταση μεταξύ των δακτύλων σας. Μπορείτε να κάνετε το ίδιο με τον Internet Explorer στο Windows Phone 7. Αυτή η ενέργεια ονομάζεται "τσίμπημα, τέντωμα" στο Windows Phone 7.

Εκτός από το τσίμπημα και το τέντωμα, μπορείτε επίσης να χρησιμοποιήσετε ενέργειες όπως "πάτημα" για να αγγίξετε για λίγο (πατήστε) ένα σημείο στην οθόνη και "flick" για να εντοπίσετε γρήγορα την οθόνη. Αυτές οι ενέργειες αναφέρονται συλλογικά ως χειρονομίες.

Σε αυτό το πρόγραμμα, θα ήθελα να μεγεθύνω και να μειώσω το αντικείμενο που εμφανίζεται στην οθόνη με αυτή τη λειτουργία τσιμπήματος και τεντώματος. Επίσης, μέχρι την τελευταία φορά, έλαβα απευθείας τις πληροφορίες της οθόνης αφής και τις επεξεργάστηκα, αλλά αυτή τη φορά θα ήθελα να χειριστώ λειτουργίες αφής χρησιμοποιώντας μεθόδους αφιερωμένες στις χειρονομίες.

Στόχοι αυτού του δείγματος προγράμματος

Εργασίες τσιμπήματος και τεντώματος για μεγέθυνση και συρρίκνωση του αντικειμένου.

Εικόνα 1: Τεντώστε για να μεγεθύνετε το αντικείμενο

Πρόγραμμα - Δήλωση Πεδίων

Δεν υπάρχει νέα κλάση στη δήλωση πεδίου, αλλά έχει "την κεντρική συντεταγμένη της υφής", "τη μεγέθυνση του αντικειμένου" και "την απόσταση μεταξύ των δύο τελευταίων θέσεων αφής κατά το τσίμπημα".

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

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

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

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

Πρόγραμμα - Ενεργοποίηση χειρονομιών

Αυτή τη φορά, θα εκτελέσουμε μια διαδικασία μόνο με χειρονομίες, αλλά στην προεπιλεγμένη κατάσταση, καμία από τις χειρονομίες δεν μπορεί να χρησιμοποιηθεί. Για να ανακτήσετε κάθε πληροφορία χειρονομίας, πρέπει να ορίσετε τη χειρονομία που θα χρησιμοποιηθεί για την ιδιότητα TouchPanel.EnabledGestures.

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

Η ενεργοποίηση όλων των κινήσεων επηρεάζει την απόδοση, επομένως βεβαιωθείτε ότι έχετε ορίσει μόνο τις κινήσεις που θέλετε να χρησιμοποιήσετε. Εδώ, το "GestureType.Pinch" έχει οριστεί για τη λήψη πληροφοριών λειτουργίας τσιμπήματος και το "GestureType.PinchComplete" έχει οριστεί για να υποδεικνύει ότι η διαδικασία τσιμπήματος έχει ολοκληρωθεί. Η θέση ρύθμισης έχει οριστεί στον κατασκευαστή παιχνιδιών.

Πρόγραμμα - Φόρτωση υφών

Η φόρτωση υφών είναι η ίδια με πριν, αλλά αυτή τη φορά υπολογίζουμε την "κεντρική συντεταγμένη της υφής". Αυτό συμβαίνει επειδή κατά την κλιμάκωση ενός αντικειμένου, κλιμακώνεται με την κεντρική συντεταγμένη ως αρχή.

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

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

Πρόγραμμα - Λήψη πληροφοριών χειρονομίας

Λαμβάνουμε πληροφορίες χειρονομίας (τσίμπημα εδώ) στη μέθοδο Game.Update. Η επεξεργασία χειρονομιών έχει τη μορφή επανάληψης όσων χειρονομιών έχετε ενεργοποιήσει. Η δομή "TouchCollection" που χρησιμοποιήθηκε μέχρι την τελευταία φορά δεν χρησιμοποιείται.

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

Ελέγξτε την κατάσταση της ιδιότητας TouchPanel.IsGestureAvailable στον βρόχο ενώ για πληροφορίες κινήσεων και ελέγξτε αν υπάρχουν οι ακόλουθες πληροφορίες κινήσεων: Εάν έχετε τις ακόλουθες πληροφορίες κινήσεων, χρησιμοποιήστε τη μέθοδο "TouchPanel.ReadGesture" για να λάβετε τις πληροφορίες χειρονομίας.

Το "GestureSample.GestureType" αποθηκεύει πληροφορίες σχετικά με τον τύπο χειρονομίας που περιλαμβάνεται, επομένως διακλαδώστε τη διαδικασία με μια δήλωση διακόπτη που βασίζεται σε αυτήν. Σε αυτό το δείγμα, ο κατασκευαστής ορίζει τις απαριθμήσεις "GestureType.Pinch" και "GestureType.PinchComplete" στην ιδιότητα "TouchPanel.EnabledGestures", ώστε να διακλαδίζονται αντίστοιχα.

Πρόγραμμα - Χειρισμός χειρονομιών τσιμπήματος

Είναι πιο γρήγορο να εξετάσουμε τα σχόλια στον κώδικα για αυτό που κάνουμε, αλλά για να συνοψίσουμε τι κάνουμε, βρίσκουμε τη διαφορά μεταξύ της απόστασης μεταξύ των δύο προηγούμενων σημείων επαφής και της απόστασης σημείου επαφής μεταξύ των δύο σημείων αυτή τη φορά και χρησιμοποιούμε αυτήν τη διαφορά για να αυξήσουμε ή να μειώσουμε την τιμή κλίμακας.

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;

Οι δύο θέσεις αφής μπορούν να ληφθούν με τα "GestureSample.Position" και "GestureSample.Position2", αντίστοιχα. Μπορείτε να αφαιρέσετε τη διαφορά μεταξύ των δύο ληφθέντων διανυσμάτων και να βρείτε την απόσταση μεταξύ των δύο σημείων καλώντας τη μέθοδο "Vector2.Length".

Παρεμπιπτόντως, εδώ ορίζουμε την προηγούμενη απόσταση ως 0 όταν δεν εκτελείται τσίμπημα, οπότε η διαδικασία διακλαδίζεται όταν ξεκινά το τσίμπημα και στον δεύτερο και τους επόμενους βρόχους. Αυτό συμβαίνει επειδή την πρώτη φορά που τσιμπάτε, δεν υπάρχει προηγούμενη απόσταση, οπότε δεν χρειάζεται να κλιμακώσετε.

Επίσης, αυτή τη φορά χρησιμοποιούμε μόνο δύο ιδιότητες, "GestureSample.Position" και "GestureSample.Position2", αλλά υπάρχουν επίσης οι ιδιότητες "GestureSample.Delta" και "GestureSample.Delta2", οι οποίες μπορούν να λάβουν τις πληροφορίες διαφοράς από την προηγούμενη θέση αφής. Υπάρχουν δύο ιδιότητες το καθένα, αλλά αυτό είναι για πολλαπλή αφή και για χειρονομίες που χρησιμοποιούν μόνο ένα άγγιγμα, θα χρησιμοποιήσετε ιδιότητες χωρίς "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();

Περίληψη του δείγματος

Αυτή τη φορά, εξηγήσαμε τη διαδικασία που είναι αφιερωμένη στις χειρονομίες. Στο δείγμα, δημιουργούμε μόνο μια διαδικασία τσίμπημα, αλλά υπάρχουν επίσης "κινήσεις" και "κρατήματα". Για να μάθετε ποιες χειρονομίες είναι διαθέσιμες, ανατρέξτε στη Βοήθεια του XNA Game Studio 4.0 για απαριθμήσεις GestureType.

Μπορείτε να εφαρμόσετε το ίδιο πράγμα από τις πληροφορίες αφής που λαμβάνονται από τη μέθοδο TouchPanel.GetState χωρίς να χρησιμοποιήσετε μεθόδους ή δομές ειδικά για χειρονομίες, αλλά σε αυτήν την περίπτωση, θα πρέπει να υπολογίσετε μόνοι σας την ταχύτητα διαχείρισης ταυτότητας πολλαπλής αφής, χρόνου αφής, κινήσεων κ.λπ. Χρησιμοποιώντας μεθόδους ειδικά για χειρονομίες, αυτές οι υλοποιήσεις μπορούν να απλοποιηθούν και υπάρχει επίσης το πλεονέκτημα ότι όλα τα παιχνίδια και οι εφαρμογές μπορούν να λειτουργούν με τον ίδιο τρόπο.

Όταν δημιουργείτε μόνοι σας μια διαδικασία επιφάνειας αφής, εάν μπορείτε να αντικαταστήσετε μια παρόμοια διαδικασία ως χειρονομία, σας συνιστούμε να τη χρησιμοποιήσετε.

Προγραμματισμός! - 5.Τσιμπήστε για να περιστρέψετε αντικείμενα

Πληροφορίες για αυτό το δείγμα

Το τσίμπημα συνήθως αναφέρεται σε "τσίμπημα" και "τέντωμα", αλλά η διαδικασία τσιμπήματος του XNA Game Studio 4.0 δεν περιορίζει συγκεκριμένα τη διαδικασία σε αυτά τα δύο, επομένως μπορείτε επίσης να εκτελέσετε λειτουργίες που περιστρέφουν ένα σημείο επαφής γύρω από ένα άλλο σημείο επαφής.

Εδώ, θα ήθελα να περιστρέψω το αντικείμενο με αυτή τη μέθοδο λειτουργίας. Παρεμπιπτόντως, δεν εμφανίστηκαν νέες μέθοδοι ή αυτή τη φορά και βασίζεται στην προηγούμενη κλιμάκωση.

Στην περιγραφή του δείγματος κώδικα σε αυτό το άρθρο, παραλείπονται τα ίδια τμήματα με το προηγούμενο δείγμα κλιμάκωσης.

Στόχοι αυτού του δείγματος προγράμματος

Περιστρέφοντας τα δύο σημεία επαφής, το αντικείμενο περιστρέφεται. Η προηγούμενη λειτουργία κλιμάκωσης λειτουργεί επίσης.

Εικόνα 2: Περιστροφή του αντικειμένου περιστρέφοντας το σημείο επαφής

Πρόγραμμα - Δήλωση Πεδίων

Τα "Ποσότητα περιστροφής sprite" και "Τελευταία γωνία περιστροφής" προστίθενται στο προηγούμενο πρόγραμμα κλιμάκωσης. Όλες οι γωνίες υπολογίζονται σε ακτίνια.

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

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

Πρόγραμμα - Διαδικασία Περιστροφής

Η διαδικασία περιστροφής εκτελείται κατά τη διάρκεια των χειρονομιών τσιμπήματος με τον ίδιο τρόπο όπως κατά την κλιμάκωση.

Δεν θα μπω σε πολλές λεπτομέρειες σχετικά με τον υπολογισμό της περιστροφής επειδή είναι μια μαθηματική ιστορία, αλλά μπορείτε να πάρετε το ακτίνιο γωνίας με τη μέθοδο "Math.Atan2" βρίσκοντας το διάνυσμα διαφοράς από το σημείο επαφής 1 στο σημείο επαφής 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;
}

Πρόγραμμα - Σχεδίαση Αντικειμένων

Δεν υπάρχουν σημαντικές αλλαγές στη σχεδίαση αντικειμένων. Το πέμπτο όρισμα της μεθόδου SpriteBacth.Draw ορίζεται στην υπολογισμένη γωνία περιστροφής.

// スプライトの描画準備
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();

Περίληψη του δείγματος

Αυτή τη φορά, προσπάθησα να περιστρέψω το αντικείμενο με λειτουργία τσιμπήματος. Δεν χρησιμοποιούμε νέες συγκεκριμένα, αλλά ελπίζω να καταλαβαίνετε ότι μπορούμε να πραγματοποιήσουμε εφαρμοσμένη επεξεργασία με βάση τις παρεχόμενες λειτουργίες.

Επιτέλους

Εξετάσαμε δείγματα και δείξαμε την υλοποίηση αλληλεπιδράσεων αφής χρησιμοποιώντας το Windows Phone 7 και το XNA Game Studio 4.0. Το περιεχόμενο περιλάμβανε λήψη αφής με ένα άγγιγμα και πολλαπλής αφής και χειρισμό πληροφοριών αφής, καθώς και επεξεργασία με χειρισμό χειρονομιών αφής με τη χρήση μεθόδων που αφορούν συγκεκριμένες χειρονομίες.

Αυτή τη φορά, έχω επικεντρωθεί στην οθόνη αφής, αλλά εξακολουθούν να υπάρχουν ορισμένες λειτουργίες που δεν έχω εισαγάγει ακόμα. Το Windows Phone 7 περιλαμβάνει επίσης νέες δυνατότητες εισόδου στο XNA Game Studio 4.0, όπως είσοδο επιταχυνσιόμετρου και είσοδο φωνής. Υπάρχουν μερικά ενδιαφέροντα χαρακτηριστικά που δεν μπορούσα να παρουσιάσω αυτή τη φορά, οπότε απολαύστε την εξερεύνηση των λειτουργιών που θέλετε να χρησιμοποιήσετε.