Interaksi sentuh dalam pengembangan game untuk Windows Phone 7 Bagian 2 Multitouch

Pemrograman! - 2.Coba multi-touch

Tentang sampel ini

Di sini, saya ingin menjelaskan program untuk mewujudkan input multi-touch. Di Windows Phone 7, input multisentuh melalui panel sentuh adalah salah satu item terpenting untuk input pengguna. Ini karena, tidak seperti Windows dan Xbox 360, antarmuka input utama adalah "panel sentuh". Mungkin ada ponsel Windows dengan keyboard, tetapi tentu saja mereka tidak selalu memilikinya. Jadi, agar game dapat bekerja di Windows Phone apa pun, itu harus mampu disentuh.

Jika Anda membatasi panel sentuh hanya untuk "satu sentuhan", jenis game yang dapat dibuat pasti akan terbatas dalam hal membuat game. Pikirkan konsol game genggam (Anda dapat membiarkannya diam). Sebagian besar konsol game mengharuskan Anda memegang pengontrol game (atau konsol yang sebenarnya) dengan kedua tangan dan menekan beberapa tombol secara bersamaan.

Windows Phone 7 tidak memiliki tombol sebanyak pengontrol game, dan belum tentu memiliki keyboard. Oleh karena itu, tombol dan tombol virtual dapat ditempatkan di layar, dan ketika menekannya, tidak nyaman karena tidak dapat ditekan secara bersamaan hanya dengan satu sentuhan.

Tentu saja, selain contoh tombol virtual di atas, multi-touch diperlukan untuk game di mana banyak orang mengoperasikan satu layar, seperti "cubit dan regangkan (pindahkan dua titik lebih dekat atau lebih jauh)" yang umum dalam multi-touch.

Ngomong-ngomong, pengantarnya panjang, tetapi dalam sampel ini, saya ingin memperoleh informasi multi-sentuh menggunakan kelas yang didedikasikan untuk panel sentuh. Sangat menyenangkan untuk membuat sampel yang dapat dimainkan dengan multi-touch secara tiba-tiba, tetapi pertama-tama saya ingin mengetahui jenis informasi apa yang dapat diperoleh dengan multi-touch. Ada beberapa kebiasaan, jadi dengan mengetahuinya terlebih dahulu, Anda dapat mengurangi waktu yang dihabiskan untuk menyelidiki penyebabnya, seperti ketika itu tidak bekerja dengan baik dalam pemrograman nanti.

Tujuan dari program sampel ini

Tampilkan dan konfirmasikan informasi saat multisentuh dilakukan.

Gambar 1: Informasi sentuh ditampilkan sebagai teks saat disentuh

Program - Mendeklarasikan Bidang

Bidang harus diberi label TouchPanelCapabilities Structure dan TouchCollection Structure.

/// <summary>
///  スプライトでテキストを描画するためのフォント
/// </summary>
SpriteFont font;

/// <summary>
///  タッチパネルの機能情報
/// </summary>
TouchPanelCapabilities capabilities;

/// <summary>
///  取得したタッチ情報の一覧
/// </summary>
TouchCollection touches;

"Struktur TouchPanelCapabilities" adalah struktur yang dapat memiliki fungsi panel sentuh itu sendiri sebagai parameter. Ini digunakan untuk memeriksa apakah panel sentuh dapat digunakan selama pembaruan.

Struktur TouchCollection berisi daftar informasi tentang status yang saat ini disentuh. Jika beberapa sentuhan terdeteksi, beberapa "Struktur TouchLocation" dapat diambil. Lebih lanjut tentang itu nanti.

Program - Memuat Font

Sebelum menggambar teks di layar, tambahkan definisi font ke proyek konten Anda dan muat dengan metode Game.LoadContent. Ini tidak terkait langsung dengan panel sentuh, jadi saya akan menghilangkan penjelasan terperinci.

Gambar 2: Tambahkan "Font.spritefont" ke proyek konten Anda

// フォントをコンテンツパイプラインから読み込む
font = Content.Load<SpriteFont>("Font");

Program - Dapatkan informasi panel sentuh

Dapatkan informasi panel sentuh di dalam metode Game.Update.

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

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

Anda dapat memanggil metode "TouchPanel.GetCapabilities" untuk mendapatkan informasi fungsi panel sentuh. Ada dua jenis informasi yang dapat diperoleh: "Dapatkah panel sentuh digunakan?" dan "Jumlah maksimum titik kontak yang dapat diperoleh oleh panel sentuh." Tak satu pun dari mereka berubah selama permainan, jadi saya pikir tidak ada masalah jika Anda mendapatkannya per metode Game.Initialize, tetapi di masa depan, perangkat yang dapat menghapus panel sentuh (panel sentuh yang dapat dihubungkan ke USB atau perangkat aktual selain Windows Phone) muncul, dan itu dijelaskan dalam metode Pembaruan.

Juga, tidak perlu memeriksa apakah panel sentuh dapat digunakan karena selalu dapat digunakan pada Windows Phone 7, tetapi ketika berbagi kode dengan Windows dan Xbox 360, perangkat keras ini tidak memerlukan antarmuka input dan perlu diperiksa.

Jika Anda dapat mengonfirmasi bahwa panel sentuh tersedia di properti "TouchPanelCapabilities.IsConnected", metode "TouchPanel.GetState" mendapatkan status sentuh saat ini.

Awalnya, beberapa pemrosesan operasi dilakukan setelah memperoleh informasi sentuhan, tetapi dalam sampel ini, informasi hanya ditampilkan, sehingga tidak ada pemrosesan lebih lanjut yang dilakukan dalam metode Game.Update.

Program - Dapatkan jumlah titik kontak maksimum yang bisa Anda dapatkan

Jumlah maksimum titik kontak yang dapat diambil kira-kira tetap, jadi seringkali tidak perlu mengambilnya selama permainan, tetapi Anda bisa mendapatkan jumlah maksimum titik kontak yang dapat diambil dari properti TouchPanelCapabilities.MaximumTouchCount. Misalnya, jika properti MaximumTouchCount adalah "4", Anda tidak bisa mendapatkan informasi posisi kelima dengan menyentuh panel sentuh dengan lima jari.

Jumlah akuisisi untuk smartphone "HTC 7 Trophy" yang digunakan dalam sampel ini adalah "4". (Omong-omong, XNA Game Studio 4.0 didefinisikan untuk selalu mengembalikan 4.) Spesifikasi Windows Phone 7 mengatakan itu lebih dari 4 poin, sehingga tidak mengembalikan kurang dari 4.)

// タッチ可能な最大数を表示
spriteBatch.DrawString(font,  
                       "MaximumTouchCount : " +
                         capabilities.MaximumTouchCount,
                       new Vector2(20, 50),
                       Color.LightGreen);

Gambar 3: TouchPanelCapabilities.MaximumTouchCount Property Retrieval Count Count

Program - Dapatkan informasi sentuhan

Struktur TouchCollection yang diambil berisi beberapa informasi sentuh. Misalnya, jika Anda menyentuh dengan dua jari, biasanya berisi dua sentuhan.

Jumlah informasi sentuh dapat diambil di properti TouchCollection.Count. Informasi sentuh berulang kali ditampilkan dalam pernyataan for sebanyak yang diperoleh. Awalnya, tidak ada masalah untuk mengulang dengan foreach, tetapi karena kita akan menggunakan indeks array (indeks int) dalam penjelasan selanjutnya, kita mengulangnya dengan untuk.

// タッチ情報の数だけループする
for (int index = 0; index < touches.Count; index++)
{
  // 指定したインデックスのタッチ情報取得
  TouchLocation tl = touches[index];

  // タッチ情報を可視化
  string mes = "Index : " + index + Environment.NewLine +
               "Id : " + tl.Id + Environment.NewLine +
               "Position : " + tl.Position + Environment.NewLine +
               "State : " + tl.State;

  // 文字の描画
  spriteBatch.DrawString(font,
                         mes,
                         new Vector2(30 + (index % 4) * 10,
                                     80 + index * 140),
                         Color.White);
}

Sekarang, setiap informasi sentuh diperoleh sebagai struktur "TouchLocation". Jika diulang dengan for, itu dapat diperoleh dengan "TouchCollection[index]". (Anda juga bisa mendapatkan struktur "TouchLocation" langsung di foreach.)

Empat jenis informasi berikut dapat diperoleh dari struktur "TouchLocation", dan setiap informasi ditampilkan dalam sampel.

Ketika Anda benar-benar menjalankannya, informasi sentuh ditampilkan seperti yang ditunjukkan di bawah ini. Karena Anda menyentuh dengan tiga jari, Anda dapat melihat tiga sentuhan. Omong-omong, jika Anda menyentuh dengan lima jari, Anda hanya akan melihat hingga empat. (Karena jumlah akuisisi maksimum adalah 4)

Gambar 4: Menyentuh dengan tiga jari

Program - Hal-hal yang harus diperhatikan saat mengambil informasi sentuh 1 (indeks dan ID)

Saya sebutkan di atas bahwa ada hal-hal yang perlu diingat ketika berhadapan dengan informasi sentuhan, tetapi yang pertama adalah "indeks" dan "ID". Indeks hanya mengacu pada indeks array.

Saya pikir lebih mudah untuk memahami jika Anda mencobanya pada mesin yang sebenarnya daripada menjelaskannya secara tertulis. Misalnya, Anda beroperasi dengan dua jari, "jari telunjuk" dan "jari tengah", dan sentuh dengan jari telunjuk Anda terlebih dahulu.

Gambar 5: Sentuh dengan jari telunjuk

Seperti yang ditunjukkan pada layar, indeks akan menjadi "0". Kemudian sentuh dengan jari tengah Anda.

Gambar 6: Sentuhan jari tengah

Dalam keadaan ini, Anda menyentuh dengan dua jari, sehingga dua informasi ditampilkan. Telunjuk yang disentuh dengan jari tengah adalah "1".

Mari kita angkat jari telunjuk kita di sini. Maka informasi sentuhan akan terlihat seperti berikut.

Gambar 7: Lepaskan jari telunjuk Anda

Seperti yang mungkin telah Anda perhatikan sekarang, indeks informasi yang Anda sentuh dengan jari tengah Anda adalah "0". Jika Anda mengelola karakter berdasarkan indeks saat Anda memindahkannya, operasi di atas akan mengarah pada tindakan berikut.

・ Gerakkan karakter "A" dengan jari telunjuk Anda
↓
・ Gerakkan karakter "B" dengan jari tengah dalam keadaan itu.
↓
・ Lepaskan jari telunjuk sambil menggerakkan karakter dengan jari tengah
↓
・ Karakter yang dikendalikan oleh jari tengah tiba-tiba beralih ke "A"

Fenomena lain adalah bahwa jika Anda berulang kali melepaskan atau menyentuh salah satu dari dua jari saat menyentuhnya, teks gambar dari informasi sentuhan pertama mungkin berkedip. Ini karena jari kedua memotong telunjuk "0" saat Anda menyentuh atau melepaskannya.

Seperti disebutkan di atas, indeks dan urutan informasi sentuhan ketika multi-touch tidak cocok dengan urutan di mana mereka disentuh. Oleh karena itu, jika Anda ingin melakukan operasi apa pun, jangan mengelolanya dalam indeks TouchCollection.

Apa yang harus dikelola adalah bahwa struktur "TouchLocation" memiliki properti "Id", dan Id ditulis ulang dengan nilai baru setiap kali disentuh, tetapi hubungan antara touchpoint dan ID dijamin saat menyentuh, jadi kami akan mengelolanya.

Tentu saja, ini tidak berarti bahwa Anda harus mengelolanya dengan ID, dan dalam beberapa kasus, posisi sentuh saja sudah cukup. Misalnya, jika Anda hanya menyentuh tombol di layar, Anda dapat menentukan bahwa Anda menekan tombol dengan memeriksa posisi sentuh terlepas dari ID. Namun, ketika memasukkan pemrosesan drag, posisinya selalu berubah, jadi saya pikir itu masih harus ditentukan oleh ID.

Program - Hal-hal yang perlu diingat saat memperoleh informasi sentuh 2 (jumlah informasi sentuhan yang diperoleh)

Meskipun tidak termasuk dalam program artikel, sampel menarik string "GetMaxTouchCount" di bagian bawah layar dan "jumlah maksimum informasi sentuh yang diperoleh pada saat yang sama". Ini telah menampilkan jumlah maksimum informasi sentuh yang diperoleh dengan metode "TouchPanel.GetState" di masa lalu, tetapi di mesin uji ini, properti "TouchPanelCapabilities.MaximumTouchCount" adalah 4, jadi nilai maksimum yang ditampilkan di sini biasanya harus 4. Jika Anda meletakkan lima jari di atasnya, itu akan tetap menjadi 4.

Gambar 8: Nomor lima jari

Mari kita lakukan sedikit eksperimen. Coba ulangi panel sentuh dengan banyak jari dengan kecepatan tinggi. Itu tergantung pada mesin uji, tetapi jumlahnya mungkin melebihi 4 sebelum Anda menyadarinya.

Gambar 9: GetMaxTouchCount lebih besar dari 4

Faktanya, informasi sentuh yang diperoleh dengan metode "TouchPanel.GetState" bukanlah informasi sentuh pada saat memanggil metode "TouchPanel.GetState", tetapi saat Anda menyentuhnya dan saat Anda melepaskannya dari waktu pembaruan terakhir di-cache. Oleh karena itu, meskipun hingga empat sentuhan dapat dideteksi pada saat yang sama, menyentuh jari yang sama lagi diperlakukan sebagai sentuhan terpisah, sehingga lebih banyak informasi sentuhan dapat diperoleh daripada TouchPanelCapabilities.MaximumTouchCount.

Oleh karena itu, bahkan jika TouchPanelCapabilities.MaximumTouchCount adalah 4, jika jumlah elemen array dari data terkait sentuhan diperbaiki oleh 4, kesalahan kelebihan indeks dapat terjadi tergantung pada metode pemrosesan.

Ngomong-ngomong, dalam bantuan XNA Game Studio, nilai maksimum properti TouchCollection.Count digambarkan sebagai "8", jadi jika Anda ingin memperbaiki jumlah elemen dalam array, Anda harus mengatur jumlah elemen menjadi setidaknya 8. (Jika Anda berpikir tentang peningkatan versi di masa mendatang, Anda mungkin ingin menyertakan klausa penjaga sehingga indeks tidak berlebihan.)

Ringkasan sampel ini

Kali ini, kami memeriksa berbagai parameter untuk informasi yang diperoleh dari multi-touch. Kami juga mengonfirmasi bahwa ada beberapa hal yang perlu diingat saat memperoleh informasi panel sentuh. Berdasarkan pengetahuan ini, saya ingin menjelaskan sampel yang sebenarnya menggunakan multi-touch.