cari
Rumahhujung hadapan webtutorial jsPengalaman permainan yang benar dengan API Gamepad

Pengalaman permainan yang benar dengan API Gamepad

Takeaways Key

    API GamePad, standard W3C yang dicadangkan, menyediakan API yang konsisten merentasi pelayar untuk menghubungkan peranti input permainan seperti pengawal Xbox ke komputer untuk pengalaman berasaskan penyemak imbas.
  • API Gamepad menawarkan fleksibiliti dan menyediakan akses kepada butang dan paksi dengan nilai yang dinormalisasi, dan objek GamePad menawarkan maklumat terperinci mengenai pengilang dan model GamePad yang disambungkan.
  • PxGamepad adalah kelas penolong yang menyediakan perwakilan tahap yang lebih tinggi dari gamepad standard seperti pengawal Xbox One, memetakan indeks butang dan paksi kepada nama -nama biasa seperti yang dilabelkan pada pengawal Xbox.
  • Walaupun API Gamepad mampu menyokong beberapa pemain dengan Gamepad mereka sendiri, penambahbaikan masa depan mungkin membolehkan pengguna mengulangi atau menyesuaikan fungsi butang pada Gamepad mereka, dan API menawarkan potensi untuk senario bukan permainan seperti memanipulasi dan menavigasi model 3D .

Artikel ini adalah sebahagian daripada siri Web Dev dari Microsoft. Terima kasih kerana menyokong rakan kongsi yang membuat SitePoint mungkin.

Permainan di web telah datang jauh dengan teknologi HTML5 seperti Canvas, WebGL, dan Webaudio. Sekarang mungkin untuk menghasilkan grafik dan bunyi kesetiaan tinggi dalam penyemak imbas. Walau bagaimanapun, untuk memberikan pengalaman permainan yang benar, anda memerlukan peranti input yang direka untuk permainan. API Gamepad adalah standard W3C yang dicadangkan, dan direka untuk menyediakan API yang konsisten di seluruh pelayar.

API Gamepad membolehkan pengguna menyambungkan peranti seperti pengawal Xbox ke komputer dan menggunakannya untuk pengalaman berasaskan penyemak imbas! Jika anda mempunyai gamepad, cuba pasangkannya ke dalam komputer anda dan kemudian tekan butang. Anda akan melihat pengawal Xbox di bawah cahaya sehingga mencerminkan setiap pergerakan yang anda buat!

Pengalaman permainan yang benar dengan API Gamepad cubalah secara interaktif di sini.

Tutorial ini adalah yang ketiga dalam siri pada Arcade Penerbangan - dibina untuk menunjukkan apa yang mungkin di platform web dan dalam pelayar Microsoft Edge baru dan enjin rendering EdgeHTML. Anda boleh menemui dua artikel pertama di WebGL dan API Web, ditambah kod interaktif dan contoh untuk artikel ini di flightarcade.com.

[YouTube xyaq9tpmxra]

Api fleksibel

API Gamepad direka dengan bijak dengan fleksibiliti. Pada tahap asas, ia menyediakan akses kepada butang dan paksi. Nilai butang berkisar dari [0 .. 1] manakala paksi berkisar dari [-1 .. 1]. Semua nilai dinormalisasi kepada julat ini supaya pemaju boleh mengharapkan tingkah laku yang konsisten antara peranti.

Objek Gamepad menyediakan maklumat terperinci mengenai pengilang dan model Gamepad yang disambungkan. Lebih berguna ialah harta pemetaan yang menggambarkan jenis umum gamepad. Pada masa ini satu -satunya pemetaan yang disokong adalah standard yang sepadan dengan susun atur pengawal yang digunakan oleh banyak konsol permainan popular seperti Xbox.

Pemetaan pengawal standard mempunyai dua batang, masing -masing diwakili oleh 2 paksi (x dan y). Ia juga termasuk d-pad, 4 butang permainan, butang atas, dan pencetus: semuanya diwakili sebagai butang dalam API Gamepad.

Pengawal Xbox semasa melaporkan keadaan butang sebagai 0 (keadaan biasa) atau 1 (ditekan). Walau bagaimanapun, anda boleh membayangkan bahawa pengawal masa depan boleh melaporkan jumlah daya yang digunakan untuk setiap butang tekan.

Xbox D-Pad juga melaporkan nilai diskret (0 atau 1), tetapi tongkat memberikan nilai berterusan merentasi seluruh julat paksi [-1 .. 1]. Ketepatan tambahan ini menjadikannya lebih mudah untuk terbang pesawat dalam misi arked penerbangan kami.

pxgamepad

pelbagai butang dan paksi yang disediakan oleh API Gamepad adalah pemikiran ke hadapan dan sempurna sebagai API tahap rendah. Walau bagaimanapun, apabila menulis permainan, adalah baik untuk mempunyai perwakilan tahap yang lebih tinggi dari gamepad standard seperti pengawal Xbox One. Kami mencipta kelas pembantu bernama PxGamepad yang memetakan butang dan indeks paksi kepada nama yang lebih biasa seperti yang dilabelkan pada pengawal Xbox.

Kami akan berjalan melalui beberapa keping perpustakaan yang menarik, tetapi kod sumber penuh (lesen MIT) boleh didapati di sini: https://github.com/thinkpixellab/pxgamepad

API Gamepad standard menyediakan keadaan butang sebagai pelbagai butang. Sekali lagi, API ini direka untuk fleksibiliti yang membolehkan pengawal dengan pelbagai butang. Walau bagaimanapun, semasa menulis permainan, lebih mudah untuk menulis dan membaca kod yang menggunakan nama butang yang dipetakan standard.

Contohnya, dengan API HTML5 Gamepad, inilah kod untuk memeriksa sama ada pencetus kiri sedang ditekan:

Pengalaman permainan yang benar dengan API Gamepad Kelas PxGamepad mengandungi kaedah kemas kini yang akan mengumpulkan keadaan untuk semua butang dan paksi dipetakan standard. Jadi menentukan sama ada lefttrigger ditekan adalah semudah mengakses harta boolean:

Pengalaman permainan yang benar dengan API Gamepad paksi dalam API Gamepad standard juga disediakan sebagai pelbagai nilai berangka. Sebagai contoh, inilah kod untuk mendapatkan nilai x dan y yang dinormalisasi untuk tongkat kiri:

Pengalaman permainan yang benar dengan API Gamepad D-Pad adalah kes khas, kerana ia dianggap satu set empat butang oleh API HTML5 Gamepad (indeks 12, 13, 14, dan 15). Walau bagaimanapun, perkara biasa bagi pemaju untuk membolehkan DPAD digunakan dengan cara yang sama seperti salah satu tongkat. Pxgamepad menyediakan maklumat butang untuk d-pad, tetapi juga menyegarkan maklumat paksi seolah-olah d-pad adalah tongkat:

Pengalaman permainan yang benar dengan API Gamepad

Satu lagi batasan API HTML5 GamePad ialah tidak menyediakan peristiwa tahap butang. Adalah perkara biasa bagi pemaju permainan untuk mengaktifkan satu acara untuk menekan butang. Dalam arked penerbangan, butang pencucuhan dan brek adalah contoh yang baik. PxGamepad Watches Button State dan membolehkan pemanggil mendaftar untuk pemberitahuan pada pelepasan butang.

Pengalaman permainan yang benar dengan API Gamepad

Berikut adalah senarai penuh butang bernama yang disokong oleh pxGamepad:

  • a
  • b
  • x
  • y
  • lefttop
  • righttop
  • lefttrigger
  • righttrigger
  • pilih
  • Mula
  • leftstick
  • kanan
  • dpadup
  • dpaddown
  • dpadleft
  • dpadright
  • Mendapatkan Gamepad semasa

Terdapat dua kaedah untuk mendapatkan objek Gamepad. API GamePad menambah kaedah ke objek Navigator bernama GetGamePads () yang mengembalikan pelbagai gamepads yang disambungkan. Terdapat juga peristiwa gamepadconnected dan gamepaddisconnected baru yang dipecat apabila gamepad baru telah disambungkan atau diputuskan. Sebagai contoh, inilah cara penyokong PXGamepad menyimpan Gamepad yang terakhir:

Dan di sini adalah pembantu untuk mendapatkan gamepad standard pertama menggunakan navigator.getgamepads () API: Pengalaman permainan yang benar dengan API Gamepad

Kelas Helper PxGamepad direka untuk senario mudah di mana pengguna tunggal bermain permainan dengan gamepad dipetakan standard. Pelayar terkini, seperti Microsoft Edge, menyokong sepenuhnya API W3C Gampepad. Walau bagaimanapun, versi lama beberapa pelayar lain hanya menyokong kepingan spesifikasi yang muncul. Pxgamepad mendengar untuk acara GamePadConnected dan jatuh kembali untuk meminta senarai semua gamepad jika diperlukan. Pengalaman permainan yang benar dengan API Gamepad

Masa Depan Gamepad

Walaupun pxGamepad memberi tumpuan kepada senario yang mudah dan paling biasa, API Gamepad mampu menyokong pelbagai pemain, masing -masing dengan gamepad mereka sendiri. Satu peningkatan yang mungkin untuk pxGamepad mungkin menyediakan kelas gaya pengurus yang menjejaki sambungan pelbagai gamepad dan memetakannya kepada beberapa pemain dalam permainan. Satu lagi mungkin untuk membolehkan pengguna mengulangi atau menyesuaikan fungsi butang pada gamepad mereka.

Kami juga teruja dengan potensi gamepad untuk senario bukan permainan. Dengan kebangkitan WebGL, kami melihat pelbagai kegunaan inovatif untuk 3D di web. Ini mungkin bermakna meneroka rantau Mt. Everest dalam 3D dengan Glacierworks. Atau melihat koleksi Assyrian Muzium British berkat usaha Cyark untuk secara digital mengekalkan tapak dan artifak dunia yang penting.

Semasa pembangunan arked penerbangan, kami sering menggunakan pengisar dan alat 3D lain untuk memproses model untuk Babylon.js. Sesetengah pemaju dan artis menggunakan peranti yang dipanggil tetikus 3D untuk membantu memanipulasi dan menavigasi model 3D. Peranti ini menjejaki pergerakan satu tombol melalui enam paksi! Mereka menjadikannya sangat mudah dan cepat memanipulasi model. Di luar permainan, mereka digunakan dalam pelbagai aplikasi menarik dari kejuruteraan kepada pengimejan perubatan. Semasa menambah sokongan GamePad ke Arcade Penerbangan, kami terkejut mengetahui bahawa API Gamepad mengesan ruang angkasa 3D kami dan menyediakan data pergerakan untuk semua enam paksi!

Ia menarik untuk membayangkan semua kemungkinan yang ditawarkan API Gamepad baru. Sekarang adalah masa yang tepat untuk bereksperimen dengan API Gamepad baru dan menambah kawalan ketepatan dan banyak keseronokan untuk permainan atau aplikasi seterusnya!

lebih banyak tangan dengan JavaScript

Microsoft mempunyai banyak pembelajaran percuma di banyak topik JavaScript sumber terbuka dan kami berada dalam misi untuk membuat lebih banyak lagi dengan Microsoft Edge. Berikut adalah beberapa yang perlu diperiksa:

  • Microsoft Edge Web Summit 2015 (siri lengkap apa yang diharapkan dengan pelayar baru, ciri platform web baru, dan penceramah tetamu dari komuniti)
  • membina // membina/dan Windows 10 (termasuk enjin JavaScript baru untuk tapak dan aplikasi)
  • Memajukan JavaScript tanpa melanggar web (Keynote baru -baru ini Christian Heilmann)
  • aplikasi web yang dihoskan dan inovasi platform web (menyelam dalam topik seperti manifold.js)
  • Petua Prestasi Praktikal Untuk menjadikan HTML/JavaScript anda lebih cepat (siri 7 bahagian dari reka bentuk responsif ke permainan kasual ke pengoptimuman prestasi)
  • Platform Web Modern Jumpstart (asas -asas HTML, CSS, dan JS)

dan beberapa alat percuma untuk memulakan: Kod Visual Studio, Percubaan Azure, dan Alat Ujian Cross-Browser-semuanya tersedia untuk Mac, Linux, atau Windows.

Artikel ini adalah sebahagian daripada siri Web Dev Tech dari Microsoft. Kami teruja untuk berkongsi Microsoft Edge dan enjin rendering EdgeHTML baru dengan anda. Dapatkan mesin maya percuma atau ujian dari jauh pada Mac, iOS, Android, atau peranti Windows @ moden.ie.

soalan yang sering ditanya mengenai API Gamepad

Apakah API Gamepad? API ini direka untuk bekerja dengan mana -mana jenis gamepad, menjadikannya alat yang serba boleh untuk pemaju permainan. Ia menyediakan cara untuk berinteraksi dengan gamepad secara langsung, tanpa perlu melalui perisian atau pemandu pihak ketiga.

Bagaimanakah API Gamepad berfungsi? Ia melakukan ini dengan mendengar peristiwa tertentu, seperti menekan butang atau pergerakan kayu bedik, dan kemudian mencetuskan tindakan yang sama dalam permainan. Ini membolehkan pengalaman permainan yang lebih mendalam dan interaktif. dalam kod permainan anda. Ini melibatkan memanggil fungsi API dan mendengar peristiwa yang dihasilkannya. Anda kemudian boleh menggunakan peristiwa ini untuk mengawal aspek permainan anda, seperti pergerakan watak atau navigasi menu. bersesuaian dengan pelbagai gamepad. Ini termasuk gamepad standard dengan butang dan joysticks, serta pengawal yang lebih khusus seperti roda stereng atau tongkat penerbangan. API juga boleh mengendalikan pelbagai gamepads sekaligus, yang membolehkan permainan multiplayer. Untuk membuat permainan yang lebih kompleks. Sebagai contoh, anda boleh menggunakan API GamePad untuk mengawal pergerakan watak, semasa menggunakan API lain untuk mengendalikan fizik atau grafik permainan. adalah antara muka berasaskan web, tidak semua pelayar kini menyokongnya. Walau bagaimanapun, pelayar yang paling moden, termasuk Chrome, Firefox, dan Edge, menyokong API Gamepad. Adalah idea yang baik untuk memeriksa sokongan penyemak imbas semasa untuk API sebelum memulakan pembangunan. API Gamepad termasuk mengesan gamepad yang betul, mengendalikan pelbagai gamepad, dan berurusan dengan susun atur butang yang berbeza. Isu -isu ini biasanya dapat diselesaikan dengan berhati -hati membaca dokumentasi API dan menguji permainan dengan teliti. Penyemak imbas desktop, ia juga boleh digunakan untuk permainan mudah alih. Walau bagaimanapun, ini memerlukan gamepad yang serasi dengan peranti mudah alih, dan pengalaman pengguna mungkin tidak lancar seperti permainan desktop. Boleh menguji API Gamepad dengan menyambungkan Gamepad ke komputer anda dan menjalankan permainan yang menggunakan API. Anda kemudian boleh tekan butang pada gamepad dan lihat jika tindakan yang sepadan dicetuskan dalam permainan.

di mana saya boleh mengetahui lebih lanjut mengenai API Gamepad? Ini termasuk dokumentasi API rasmi, serta tutorial dan panduan di pelbagai laman web pembangunan permainan. Anda juga boleh mencari contoh permainan yang menggunakan API untuk melihatnya dalam tindakan.

Atas ialah kandungan terperinci Pengalaman permainan yang benar dengan API Gamepad. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Ganti aksara rentetan dalam javascriptGanti aksara rentetan dalam javascriptMar 11, 2025 am 12:07 AM

Penjelasan terperinci mengenai kaedah penggantian rentetan javascript dan Soalan Lazim Artikel ini akan meneroka dua cara untuk menggantikan watak rentetan dalam JavaScript: Kod JavaScript dalaman dan HTML dalaman untuk laman web. Ganti rentetan di dalam kod JavaScript Cara yang paling langsung ialah menggunakan kaedah pengganti (): str = str.replace ("cari", "ganti"); Kaedah ini hanya menggantikan perlawanan pertama. Untuk menggantikan semua perlawanan, gunakan ungkapan biasa dan tambahkan bendera global g: str = str.replace (/fi

Bina Aplikasi Web Ajax anda sendiriBina Aplikasi Web Ajax anda sendiriMar 09, 2025 am 12:11 AM

Jadi di sini anda, bersedia untuk mempelajari semua perkara ini yang dipanggil Ajax. Tetapi, apa sebenarnya? Istilah Ajax merujuk kepada kumpulan teknologi longgar yang digunakan untuk membuat kandungan web yang dinamik dan interaktif. Istilah Ajax, yang asalnya dicipta oleh Jesse J

10 JQuery Fun and Games Plugin10 JQuery Fun and Games PluginMar 08, 2025 am 12:42 AM

10 Plugin Permainan JQuery yang menyeronokkan untuk menjadikan laman web anda lebih menarik dan meningkatkan keletihan pengguna! Walaupun Flash masih merupakan perisian terbaik untuk membangunkan permainan web kasual, jQuery juga boleh menghasilkan kesan yang mengejutkan, dan walaupun tidak setanding dengan permainan flash aksi tulen, dalam beberapa kes, anda juga boleh bersenang -senang di penyemak imbas anda. permainan jquery tic toe "Hello World" pengaturcaraan permainan kini mempunyai versi jQuery. Kod sumber JQuery Game Composition Crazy Word Ini adalah permainan mengisi kosong, dan ia dapat menghasilkan beberapa hasil yang pelik kerana tidak mengetahui konteks perkataan. Kod sumber JQuery Mine Sweeping Game

JQuery Parallax Tutorial - Latar Belakang Header AnimasiJQuery Parallax Tutorial - Latar Belakang Header AnimasiMar 08, 2025 am 12:39 AM

Tutorial ini menunjukkan cara membuat kesan latar belakang paralaks yang menawan menggunakan jQuery. Kami akan membina sepanduk header dengan imej berlapis yang mewujudkan kedalaman visual yang menakjubkan. Plugin yang dikemas kini berfungsi dengan JQuery 1.6.4 dan kemudian. Muat turun

Bagaimana saya membuat dan menerbitkan perpustakaan JavaScript saya sendiri?Bagaimana saya membuat dan menerbitkan perpustakaan JavaScript saya sendiri?Mar 18, 2025 pm 03:12 PM

Artikel membincangkan membuat, menerbitkan, dan mengekalkan perpustakaan JavaScript, memberi tumpuan kepada perancangan, pembangunan, ujian, dokumentasi, dan strategi promosi.

Bagaimanakah saya mengoptimumkan kod JavaScript untuk prestasi dalam penyemak imbas?Bagaimanakah saya mengoptimumkan kod JavaScript untuk prestasi dalam penyemak imbas?Mar 18, 2025 pm 03:14 PM

Artikel ini membincangkan strategi untuk mengoptimumkan prestasi JavaScript dalam pelayar, memberi tumpuan kepada mengurangkan masa pelaksanaan dan meminimumkan kesan pada kelajuan beban halaman.

Bermula dengan Matter.js: PengenalanBermula dengan Matter.js: PengenalanMar 08, 2025 am 12:53 AM

Matter.js adalah enjin fizik badan tegar 2D yang ditulis dalam JavaScript. Perpustakaan ini dapat membantu anda dengan mudah mensimulasikan fizik 2D dalam penyemak imbas anda. Ia menyediakan banyak ciri, seperti keupayaan untuk mencipta badan yang tegar dan menetapkan sifat fizikal seperti jisim, kawasan, atau ketumpatan. Anda juga boleh mensimulasikan pelbagai jenis perlanggaran dan daya, seperti geseran graviti. Matter.js menyokong semua pelayar arus perdana. Di samping itu, ia sesuai untuk peranti mudah alih kerana ia mengesan sentuhan dan responsif. Semua ciri-ciri ini menjadikannya bernilai masa untuk belajar menggunakan enjin, kerana ini memudahkan untuk membuat permainan atau simulasi 2D berasaskan fizik. Dalam tutorial ini, saya akan merangkumi asas -asas perpustakaan ini, termasuk pemasangan dan penggunaannya, dan menyediakan

Kandungan Div Refresh Auto Menggunakan JQuery dan AjaxKandungan Div Refresh Auto Menggunakan JQuery dan AjaxMar 08, 2025 am 12:58 AM

Artikel ini menunjukkan bagaimana untuk menyegarkan semula kandungan div secara automatik setiap 5 saat menggunakan jQuery dan Ajax. Contohnya mengambil dan memaparkan catatan blog terkini dari suapan RSS, bersama -sama dengan timestamp refresh terakhir. Imej pemuatan adalah opsyena

See all articles

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
3 minggu yang laluBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Tetapan grafik terbaik
3 minggu yang laluBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Cara Memperbaiki Audio Jika anda tidak dapat mendengar sesiapa
3 minggu yang laluBy尊渡假赌尊渡假赌尊渡假赌

Alat panas

SecLists

SecLists

SecLists ialah rakan penguji keselamatan muktamad. Ia ialah koleksi pelbagai jenis senarai yang kerap digunakan semasa penilaian keselamatan, semuanya di satu tempat. SecLists membantu menjadikan ujian keselamatan lebih cekap dan produktif dengan menyediakan semua senarai yang mungkin diperlukan oleh penguji keselamatan dengan mudah. Jenis senarai termasuk nama pengguna, kata laluan, URL, muatan kabur, corak data sensitif, cangkerang web dan banyak lagi. Penguji hanya boleh menarik repositori ini ke mesin ujian baharu dan dia akan mempunyai akses kepada setiap jenis senarai yang dia perlukan.

EditPlus versi Cina retak

EditPlus versi Cina retak

Saiz kecil, penyerlahan sintaks, tidak menyokong fungsi gesaan kod

Penyesuai Pelayan SAP NetWeaver untuk Eclipse

Penyesuai Pelayan SAP NetWeaver untuk Eclipse

Integrasikan Eclipse dengan pelayan aplikasi SAP NetWeaver.

Muat turun versi mac editor Atom

Muat turun versi mac editor Atom

Editor sumber terbuka yang paling popular

PhpStorm versi Mac

PhpStorm versi Mac

Alat pembangunan bersepadu PHP profesional terkini (2018.2.1).