برنامه های وب اکنون می توانند شتاب ماوس را هنگام ثبت رویدادهای اشاره گر غیرفعال کنند.
حرکت تسریع شده یک ویژگی ارگونومیک در هنگام استفاده از ماوس یا پد لمسی برای حرکت دادن نشانگر روی صفحه است. این امکان حرکت دقیق را با حرکت آهسته فراهم می کند و همچنین به نشانگر اجازه می دهد تا با یک حرکت کوتاه سریع از کل صفحه عبور کند. به طور خاص، برای همان فاصله فیزیکی که ماوس را حرکت میدهید، اگر مسافت سریعتر طی شود، نشانگر روی صفحه بیشتر حرکت میکند.
سیستم عامل ها به طور پیش فرض شتاب ماوس را فعال می کنند. برای برخی از بازیهای پرسپکتیو شخص اول ، معمولاً تیراندازیهای اول شخص (FPS)، از دادههای ورودی خام ماوس برای کنترل چرخش دوربین بدون تنظیم شتاب استفاده میشود. همان حرکت فیزیکی، آهسته یا سریع، منجر به چرخش یکسان می شود. به گفته گیمرهای حرفه ای، این باعث تجربه بازی بهتر و دقت بالاتر می شود.
با شروع در Chrome 88، برنامههای وب میتوانند به لطف بهروزرسانی Pointer Lock API بین دادههای حرکت ماوس شتابدار و بدون شتاب به عقب و جلو حرکت کنند.
پلتفرمهای بازی مبتنی بر وب مانند Google Stadia و Nvidia GeForce Now از این قابلیتهای جدید برای خوشحال کردن گیمرهای FPS استفاده میکنند.
با استفاده از API
درخواست قفل اشاره گر
قفل اشاره گر اصطلاح متعارفی برای زمانی است که یک برنامه دسکتاپ نماد اشاره گر را پنهان می کند و حرکت ماوس را برای چیز دیگری تفسیر می کند، به عنوان مثال نگاه کردن به اطراف در یک دنیای سه بعدی.
ویژگیهای movementX
و movementY
از رویدادهای سند mousemove
به شما میگویند که نشانگر ماوس از آخرین رویداد حرکت چقدر حرکت کرده است. با این حال، هنگامی که نشانگر به خارج از صفحه وب حرکت می کند، به روز نمی شوند.
document.addEventListener("mousemove", (event) => {
console.log(`movementX: ${event.movementX} movementY: ${event.movementY}`);
});
گرفتن اشاره گر ماوس (یا درخواست قفل نشانگر) به شما این امکان را می دهد که دیگر نگران حرکت نشانگر در خارج نباشید. این به ویژه برای بازی های تحت وب همه جانبه مفید است. هنگامی که نشانگر قفل است، همه رویدادهای ماوس به عنصر هدف قفل اشاره گر می روند.
برای درخواست قفل اشاره گر requestPointerLock()
را در عنصر هدف فراخوانی کنید و برای نظارت بر تغییرات قفل اشاره گر به رویدادهای pointerlockchange
و pointerlockerror
گوش دهید.
const myTargetElement = document.body;
// Call this function to request a pointer lock.
function requestPointerLock() {
myTargetElement.requestPointerLock();
}
document.addEventListener("pointerlockchange", () => {
if (document.pointerLockElement) {
console.log(`pointer is locked on ${document.pointerLockElement}`);
} else {
console.log("pointer is unlocked");
}
});
document.addEventListener("pointerlockerror", () => {
console.log("pointer lock error");
});
غیرفعال کردن شتاب ماوس
requestPointerLock()
را با { unadjustedMovement: true }
برای غیرفعال کردن تنظیم سطح سیستم عامل برای شتاب ماوس و دسترسی به ورودی خام ماوس فراخوانی کنید. به این ترتیب، دادههای حرکت ماوس از رویدادهای mousemove
شامل شتاب ماوس در هنگام قفل شدن نشانگر نمیشود.
برای اطلاع از موفقیت آمیز بودن درخواست، از وعده بازگشتی جدید از requestPointerLock()
استفاده کنید.
function requestPointerLockWithUnadjustedMovement() {
const promise = myTargetElement.requestPointerLock({
unadjustedMovement: true,
});
if (!promise) {
console.log("disabling mouse acceleration is not supported");
return;
}
return promise
.then(() => console.log("pointer is locked"))
.catch((error) => {
if (error.name === "NotSupportedError") {
// Some platforms may not support unadjusted movement.
// You can request again a regular pointer lock.
return myTargetElement.requestPointerLock();
}
});
}
امکان جابهجایی بین دادههای حرکت ماوس شتابدار و بدون شتاب بدون رها کردن قفل اشارهگر وجود دارد. کافی است دوباره با گزینه مورد نظر قفل اشاره گر را درخواست کنید. اگر این درخواست ناموفق باشد، قفل اصلی دست نخورده باقی میماند و قول برگشتی رد میشود. هیچ رویداد قفل اشاره گر برای درخواست تغییر ناموفق فعال نمی شود.
پشتیبانی از مرورگر
Pointer Lock API به خوبی در مرورگرها پشتیبانی می شود. با این حال، مرورگرهای مبتنی بر Chromium (مانند Chrome، Edge، و غیره) تنها مرورگرهایی هستند که از اکتبر 2020 از غیرفعال کردن تنظیم سطح سیستم عامل برای شتاب ماوس پشتیبانی میکنند. برای بهروزرسانیها به جدول سازگاری مرورگر MDN مراجعه کنید.
پشتیبانی از سیستم عامل
غیرفعال کردن تنظیم سطح سیستم عامل برای شتاب ماوس در ChromeOS، macOS Catalina 10.15.1 و Windows پشتیبانی میشود. لینوکس دنبال خواهد شد.
نمونه
با اجرای نمونه روی Glitch می توانید با Pointer Lock API بازی کنید. حتماً کد منبع را بررسی کنید .
لینک های مفید
- توضیح دهنده
- مشخصات روابط عمومی
- مخزن GitHub
- ورودی ChromeStatus
- اشکال ردیابی کروم
- قصد ارسال
- موقعیت موزیلا
- موقعیت WebKit
قدردانی
از جیمز هالیر ، توماس اشتاینر ، جو مدلی ، کیس باسک و وینسنت شیب برای بررسی این مقاله سپاسگزاریم.