Chrome के Touch API में किया गया एक छोटा बदलाव
Chrome 39, जिसमें
webkitRotationAngle एट्रिब्यूट का काम करने वाला वर्शन लॉन्च किया गया
TouchEvent ऑब्जेक्ट. अब Chrome 45 (जुलाई 2015 में बीटा वर्शन में) में, यह प्रीफ़िक्स के तौर पर rotationAngle,
लागू करने की प्रक्रिया को बेहतर बनाने के लिए,
TouchEvent
spec और Firefox.
भले ही ऐसा लंबे समय से हो रहा हो, लेकिन यह बताना ज़रूरी है कि
rotationAngle में, टच के ज़्यादा दिलचस्प इस्तेमाल की जानकारी मिलती है
हाथ के जेस्चर, खास तौर पर मोबाइल डिवाइसों पर इस्तेमाल किए जा सकते हैं.
तकनीकी रूप से, घूर्णन कोण 0 और 90 के बीच की
संपर्क क्षेत्र का दीर्घवृत्त
Touch.radiusX
और
Touch.radiusY.
अरे, अच्छा, है न? (यह ध्यान दिया जाना चाहिए कि मुझे केवल पता चला है कि Chrome
Android, radiusX और radiusY की वैल्यू को 64 पिक्सल पर लॉक नहीं करता. इसके बजाय, इसे 64 पिक्सल पर लॉक नहीं करता
इसमें बदलाव भी होता है. ये बदलाव, स्क्रीन के संपर्क साइज़ के हिसाब से तय होते हैं).
इसका क्या मतलब है?
इस इमेज का इस्तेमाल करके, इमेज के आकार, आकृति, और ओरिएंटेशन (स्क्रीन की दिशा) को सटीक तरीके से दिखाएं
क्लिक करें. उपयोगकर्ता हमेशा स्क्रीन पर नब से टैप नहीं करते
उंगली से दबाने के बजाय, स्क्रीन को ऐसे दबाते हुए बार-बार दबाएं, जैसे कि वे
का पता लगाना है. rotationAngle के बिना, आपको यह आसानी से मिल जाएगा
टच जेस्चर कितना चौड़ा और कितना लंबा था. rotationAngle के साथ, आप
90 डिग्री का घुमाव पाएं (0 का मतलब है वर्टिकल और 90 का मतलब हॉरिज़ॉन्टल है). सिर्फ़ क्यों
90 डिग्री? आपको सिर्फ़ 90 डिग्री की ज़रूरत होती है, क्योंकि जब आप उन कोणों से आगे जाते हैं
radiusX और radiusY, जगह की जानकारी में बदल जाएंगे.
इसकी एक और खास बात यह है कि उपयोगकर्ता की उंगली का संपर्क क्षेत्र बदल जाता है
क्योंकि वे स्क्रीन पर अपनी उंगली के दबाव को बदल सकते हैं. यह नहीं है
force को सीधे तौर पर बदला जा सकता है, लेकिन लाइट ब्रश के बीच अंतर किया जा सकता है
स्क्रीन पर दिखाई दे सकता है, क्योंकि ज़्यादा ज़ोर से दबाने की तुलना में उनका सरफ़ेस एरिया कम होता है.
मैं इसका इस्तेमाल कैसे करूं?
सबसे पहले आपको किसी ऐसे डिवाइस की ज़रूरत है जो इसका पता लगा सके. Nexus 10 बेहतर तरीके से काम करेगा. ऐप्लिकेशन इस बात का सबसे अच्छा उदाहरण है कि रिक बायर्स पेंट का उदाहरण. जीतना नहीं है हालांकि, कैनवस के बिना भी इसका इस्तेमाल किया जा सकता है.
var touchHandler = function(e) {
e.preventDefault();
var touches = e.changedTouches;
var touch = touches[0]; // only concerned about first touch.
var rotationAngle = touch.rotationAngle || touch.webkitRotationAngle || 0;
var radiusX = touch.radiusX || touch.webkitRadiusX || 1;
var radiusY = touch.radiusY || touch.webkitRadiusY || 1;
var force = touch.force || touch.webkitForce || 0;
// Use the rotationAngle to rotate the 'p' element.
p.style.width = radiusX * 2 + 'px';
p.style.height = radiusY * 2 + 'px';
p.style.transform = "rotate(" + rotationAngle + "deg)";
};
document.documentElement.ontouchstart = touchHandler;
document.documentElement.ontouchend = touchHandler;
document.documentElement.ontouchmove = touchHandler;
आपके हिसाब से, इसे कहां इस्तेमाल किया जा सकता है?
कुछ ऐसी जगहें हैं जहां इससे विज्ञापन देने वाले लोगों या कंपनियों को तुरंत उपयोगकर्ता:
- उदाहरण के लिए, पेंटिंग और इमेज में बदलाव करने वाले वेब ऐप्लिकेशन इसका इस्तेमाल कर सकते हैं और कैनवस पर लागू किए गए स्ट्रोक या इफ़ेक्ट को बदलने की जानकारी दे सकते हैं. आप ब्रश का आकार बदलने के लिए टच रेडियस का इस्तेमाल करके, उसे कैनवस पर ब्रश के संपर्क का ऐंगल अलग-अलग करने के लिए रोटेशन ऐंगल.
- जेस्चर की बेहतर पहचान: अगर आप रोटेशन ऐंगल को समझते हैं, तो किसी ऑब्जेक्ट को घुमाने के लिए, एक उंगली से किया जाने वाला जेस्चर बनाएं.
क्या हर डिवाइस पर यह सुविधा काम करती है?
नहीं. फ़िलहाल, यह काफ़ी आम नहीं है. यदि आपके पास Nexus 10 है तो आपको कुछ ऐसा दिखता है,
इमेज क्रेडिट रिक बायर्स को दिया गया है.
जब कोई डिवाइस टच के रोटेशन के कोण को नहीं समझ पाता है, तो
rotationAngle की वैल्यू 0 होगी. साथ ही, radiusX और radiusY की वैल्यू
एक जैसी होती है (हालांकि, टच सरफ़ेस एरिया के हिसाब से यह अलग-अलग हो सकती है).
परेशान क्यों हैं?
यह अच्छा सवाल है. वेब पर कई सुविधाओं की तरह, यह भी बेहतर अनुभव है.
अभी तक किसी भी व्यक्ति ने चेक इन नहीं किया है
टच इवेंट तब काम करेंगे, जब ये काम करेंगे. इसके अलावा, अगर रेडिआई और रोटेशन की वैल्यू सिर्फ़
उपलब्ध है, तो आप उपयोगकर्ता को और सक्षम बनाने के लिए अपने ऐप्लिकेशन को बेहतर बना सकते है
अनुभव. हर व्यक्ति के पास Wacom टैबलेट नहीं होता है, लेकिन कई पेंटिंग मौजूद होने पर उसके पास ये टैबलेट होते हैं
ऐप्लिकेशन इसका लाभ उठाएंगे.
पॉइंटर इवेंट पर क्या असर होगा?
असल में, यह सिर्फ़ यह पक्का करने के लिए है कि हमारे पास एक पूरी तरह से टच इवेंट हो उन डेवलपर के लिए API जो इस पर भरोसा करते हैं. देखिए, मैं सवाल से थोड़ा बच गईं... ज़्यादा देखें हालांकि, अगर आपको Blink के PointerEvent पर फ़ॉलो करने में दिलचस्पी है लागू करने के बाद, आप समस्या 471824 पर स्टार का निशान लगा सकते हैं और रिक बायर्स का' ट्रैकिंग दस्तावेज़.