Students Save 30%! Learn & create with unlimited courses & creative assets Students Save 30%! Save Now
Advertisement
  1. Code
  2. Android SDK
Code

एंड्रॉयड एसडीके: इशारों का परिचय

Difficulty:IntermediateLength:LongLanguages:

Hindi (हिंदी) translation by Ade Khairul Umam (you can also view the original English article)

साल के अंतिम दो में टच स्क्रीन उपकरणों के उपयोग में देखा सबसे व्यापक परिवर्तन में से एक ऐसे कसते और लात के रूप में उंगली इशारों की गोद गया है । वे उपयोगकर्ता और डिवाइस के बीच बातचीत की अनुमति के लिए बहुत सहज और स्वाभाविक लग रहा है । इस ट्यूटोरियल में, आप अपने खुद के Android अनुप्रयोगों में इशारों का उपयोग शुरू करने के लिए कैसे सीखते हैं ।

इस ट्यूटोरियल एक खुला स्रोत परियोजना में प्रदान की कोड का उपयोग करेगा । लेखक मान रहे हैं कि पाठक को Android और Java के साथ कुछ अनुभव है । हालांकि, अगर आप हम क्या किया है के बारे में सवाल है, पूछने के लिए स्वतंत्र महसूस हो रहा है ।

इस ट्यूटोरियल आप सिखाने कैसे अपने अनुप्रयोगों के भीतर उंगली इशारों से निपटने शुरू करने के लिए होगा । हम कस्टम दृश्य ऑब्जेक्ट पर मूल कैनवास ऑब्जेक्ट आरेखण का उपयोग करके ऐसा करेंगे । इस तकनीक का उपयोग कर रहे है जो भी चित्रमय पर्यावरण के लिए लागू किया जा सकता है, यह एक 2d सतह या यहां तक कि ओपन ES प्रतिपादन । यदि आप multitouch इशारों (एक और अधिक उंनत इशारा हैंडलिंग विषय) में रुचि रखते हैं, हम कवर हो जाएगा कि एक और आगामी ट्यूटोरियल में ।

चरण 0: प्रोजेक्ट बनाना

चलो सरल शुरू करते हैं । एक नया Android परियोजना बनाएं । हम हमारे परियोजना इशारा मज़ा नाम दिया है और अपनी एक गतिविधि है, जो GestureFunActivity नाम है विंयस्त किया । डिफ़ॉल्ट लेआउट फ़ाइल, main. xml, निंन, बहुत मूल लेआउट को संशोधित करें:

इस लेआउट में महत्वपूर्ण आइटम FrameLayout परिभाषा है । FrameLayout नियंत्रण एक छवि आरेखित करेगा कस्टम दृश्य को रखने के लिए उपयोग किया जाता है ।

अंत में, चलो बंद अद्यतन गतिविधि वर्ग के onCreate () विधि FrameLayout नियंत्रण शुरू करने और इसे कुछ सामग्री के साथ प्रदान:

इस बिंदु पर, हम PlayAreaView वर्ग अभी तक परिभाषित नहीं है, इसलिए परियोजना का संकलन नहीं होगा । धैर्य है, हम अगले चरण में इस करने के लिए मिल जाएगा ।

चरण 1: नया दृश्य बनाना: PlayAreaView

रास्ते से बाहर हमारे सभी परियोजना सेटअप के साथ, हम अब दिलचस्प हिस्सा पर ध्यान केंद्रित कर सकते हैं: कैनवास वस्तु पर ड्राइंग । किसी दृश्य ऑब्जेक्ट की onDraw () पद्धति को ओवरराइड करके कैनवास पर आरेखण करने के लिए ऑब्जेक्ट प्राप्त करने का एक आसान तरीका है । आसानी से, इस विधि में कोई एकल पैरामीटर है: कैनवास ऑब्जेक्ट । कैनवास ऑब्जेक्ट पर कोई बिटमैप ग्राफ़िक आरेखण करना उतना ही आसान है जितना कैनवास ऑब्जेक्ट की drawBitmap () पद्धति को कॉल करना । यहां एक onDraw () विधि कार्यांवयन का एक सरल उदाहरण है, के रूप में हमारे नए PlayAreaView वर्ग के भीतर परिभाषित:

हमारे onDraw () विधि कार्यांवयन सुंदर बुनियादी है । हमेशा की तरह, आप अपनी गतिविधि में कहीं अपने DEBUG_TAG लॉगिंग टैग चर निर्धारित करने की आवश्यकता होगी । onDraw () विधि के अधिकांश सिर्फ सूचनात्मक उत्पादन है । इस विधि में किया केवल वास्तविक काम drawBitmap () कॉल में जगह लेता है, जहां पहली पैरामीटर छवि को आकर्षित करने के लिए है । दूसरा पैरामीटर एक मैट्रिक्स वस्तु है जिसे अनुवाद कहा जाता है, जैसा कि नाम का तात्पर्य है, जहाँ बिटमैप को उस दृश्य के सापेक्ष बनाया जाएगा, जिसमें कैनवास ऑब्जेक्ट स्थित है. इस ट्यूटोरियल में कोड के बाकी के सभी अनुवाद मैट्रिक्स कुछ उपयोगकर्ता स्पर्श की घटनाओं पर आधारित में हेरफेर शामिल होगा । यह, बारी में, बदल जाएगा, जहां बिटमैप ऑब्जेक्ट कैनवास के भीतर खींचता है और इसलिए, स्क्रीन पर ।

चरण 2: नए दृश्य को कॉंफ़िगर करना

PlayAreaView वर्ग के लिए कुछ प्रारंभिक सेटअप करने के लिए एक निर्माता की आवश्यकता है । के बाद से हमारे कस्टम देखने के लिए इशारों पर प्रतिक्रिया की आवश्यकता होगी, हम एक GestureDetector यहां की जरूरत है । एक GestureDetector एक Android वर्ग है कि गति की घटनाओं ले जा सकते हैं, कुछ गणितीय जादू क्या वे कर रहे हैं निर्धारित करने के लिए, और फिर विशिष्ट इशारा या अन्य गति कॉलबैक के रूप में एक GestureListener वस्तु को कॉल प्रतिनिधि. GestureListener वस्तु, एक वर्ग हम को लागू करने, विशिष्ट इशारों कि GestureDetector पहचानता है और हमें उन पर प्रतिक्रिया के रूप में हम फिट देख (इस मामले में, हमारे PlayAreaView के भीतर एक ग्राफिक चारों ओर ले जाने के लिए) की अनुमति देता है के लिए इन कॉल्स प्राप्त करता है । हालांकि GestureDetector कुछ प्रस्तावों का पता लगाने संभालती है, यह उनके साथ विशिष्ट कुछ भी नहीं करता है और न ही यह इशारों के सभी प्रकार संभाल । हालांकि, इस ट्यूटोरियल के प्रयोजनों के लिए, यह सिर्फ पर्याप्त जानकारी प्रदान करता है । तो, चलो मिल इसे झुका:

चलो थोड़ा और अधिक विस्तार में PlayAreaView निर्माता को देखो । सबसे पहले, हम अनुवाद मैट्रिक्स एक पहचान के लिए शुरू मैट्रिक्स (डिफ़ॉल्ट) । याद है कि एक पहचान मैट्रिक्स एक बिटमैप में कोई संशोधन कर देगा: यह अपने मूल स्थान में तैयार किया जाएगा ।
अगले, हम बनाने और GestureDetector शुरू-एक डिफ़ॉल्ट एक-और यह एक वैध GestureListener वस्तु निरुपित (हम एक पल में इस बारे में अधिक बात करेंगे) । अंत में, बिटमैप, दराज droid कहा जाता है, परियोजना के संसाधनों से सीधे भरी हुई है । आप किसी भी छवि आप चाहते हैं-एक बेसबॉल, सेब, भाग्य कुकी, आदि का उपयोग कर सकते हैं यह ग्राफिक है कि आप कैनवास वस्तु पर चारों ओर लात हो जाएगा है ।

चरण 3: GestureDetector कनेक्ट

हम अगले GestureListener को मिल जाएगा, क्योंकि यह एक कस्टम वस्तु है । अभी के लिए, चलो GestureDetector वस्तु को तार इतना है कि यह गति डेटा यह जादू पहचानने अपने इशारा करने की जरूरत है प्राप्त करता है ।

अब चलो GestureDector वस्तु इशारों कहा जाता है तार को घटनाओं प्राप्त करते हैं । ऐसा करने के लिए, दृश्य नियंत्रण की onTouchEvent () विधि PlayAreaView वर्ग के भीतर निम्नानुसार ओवरराइड करें:

क्या हम यहां किया है GestureDetector इस कस्टम दृश्य के लिए सभी स्पर्श घटनाओं में अंतिम शब्द बना है । हालांकि, GestureDetector वास्तव में गति की घटनाओं के साथ कुछ भी नहीं है, यह सिर्फ उंहें पहचानता है और पंजीकृत GestureListener वर्ग के लिए एक फोन करता है ।

चरण 4: एक इशारा श्रोता लागू

आदेश में GestureDetector वर्ग द्वारा मांयता प्राप्त घटनाओं पर प्रतिक्रिया के लिए, हम GestureListener वर्ग को लागू करने की जरूरत है । गति घटनाओं हम में सबसे अधिक रुचि रखते है डबल नल और किसी भी तरह का इशारा कर रहे हैं । गति घटनाओं के इन प्रकार के लिए सुनने के लिए, हमारे GestureListener वर्ग दोनों OnGestureListener और OnDoubleTapListener इंटरफेस को लागू करना चाहिए ।

इस वर्ग को गतिविधि के एक उपवर्ग के रूप में जोड़ने के बाद, प्रत्येक आवश्यक विधियों के लिए डिफ़ॉल्ट कार्यांवयन जोड़ें । उदाहरण के लिए, यहां onDown () विधि के लिए एक कार्यांवयन है:

इन पद्धतियों को कार्यान्वित करने से आप विभिन्न घटनाओं का अध्ययन कर सकते हैं क्योंकि वे GestureDetector वस्तु द्वारा मान्यता प्राप्त हैं. दिलचस्प है, अगर onDown () विधि वापस नहीं करता है सच है, मुख्य इशारा हम यहां में रुचि रखते है-स्क्रॉल (या खींचें)-पता नहीं होगा । तथापि, आप अंय मांयता प्राप्त घटनाओं है कि आप में रुचि नहीं है के लिए झूठी वापसी कर सकते हैं ।

MotionEvent ऑब्जेक्ट प्रत्येक कॉलबैक विधि करने के लिए एक पैरामीटर के रूप में दिया गया है जो संकेत मान्यता और अन्य बार अंतिम इवेंट जो इशारा मान्यता पूर्ण प्रारंभ किया गया स्पर्श इवेंट कभी-कभार का प्रतिनिधित्व करता है । हमारे प्रयोजनों के लिए, हम GestureDetector वर्ग दे रहे है प्रस्ताव MotionEvent का प्रतिनिधित्व करता है जो की तरह गूढ़ के सभी विवरण संभाल ।

नोट: एंड्रॉयड फ्रेमवर्क भी एक सुविधा वर्ग SimpleOnGestureListener बुलाया प्रदान करता है जो सभी तरीकों के लिए डिफ़ॉल्ट implementations के साथ एक एकल वर्ग में दो इंटरफेस (OnGestureListener & OnDoubleTapListener) को जोड़ती है. डिफ़ॉल्ट कार्यांवयन false लौटाते हैं ।

चरण 5: हैंडलिंग सरल गति घटनाक्रम

पहली घटना हम संभालना चाहते है पुस्तक घटना है । एक स्क्रॉल घटना तब होती है जब उपयोगकर्ता स्क्रीन को छू लेता है और फिर अपनी उंगली को उस पार ले जाता है । यह इशारा भी एक ड्रैग इवेंट के रूप में जाना जाता है । इस घटना में onScroll () OnGestureListener अंतरफलक की विधि के माध्यम से आता है ।

यहां onScroll () विधि के कार्यांवयन है:

PlayAreaView ऑब्जेक्ट के लिए एक चाल अनुरोध के साथ पास करने के लिए स्क्रॉल ईवेंट का उपयोग करें । इस विधि के कार्यांवयन के मानचित्रण में एक महत्वपूर्ण पहला कदम कैसे एक उंगली गति घटना ग्राफिक आंदोलन का संकेत है । हम इस शीघ्र ही मिल जाएगा । इस बीच में, आप अपने पहले इशारा संभाला है!

ग्राफिक सभी स्क्रीन पर ले जाया जाएगा-और कभी भी इसे बंद । परिभाषा के अनुसार, छवि दृश्य ऑब्जेक्ट की सीमा के भीतर आरेखित करते समय केवल दृश्यमान होती है । यदि ग्राफ़िक्स ' दृश्य ऑब्जेक्ट की सीमाओं के बाहर भूमि निर्देशांक, ग्राफ़िक (दृश्यमान नहीं) काटा गया है । आप एज का पता लगाने और तर्क के विभिन्न अन्य बिट्स में डाल सकता है (इस ट्यूटोरियल के दायरे से परे, हम डरते हैं), या बस डबल दोहन और ग्राफिक के स्थान को रीसेट करने के लिए खोज जोड़ सकते हैं । यहां onDoubleTap () विधि (OnDoubleTapListener अंतरफलक से) का नमूना कार्यांवयन है:

पिछले विधि कार्यांवयन के साथ के रूप में, हम इस मांयता प्राप्त प्रस्ताव का उपयोग कर रहे हैं, एक डबल नल, हमारे दृश्य नियंत्रण के भीतर एक परिवर्तन को ट्रिगर करने के लिए । इस मामले में, हम बस दृश्य का स्थान रीसेट ।

चरण 6: बातें लात

एक लात इशारा, मूलतः, एक आइटम है कि एक स्क्रीन के पार घसीटा जा रहा था पर वेग छोड़ने है । गति में आइटम आम तौर पर धीरे-धीरे धीमा हो जाएगा, लेकिन यह व्यवहार डेवलपर के कार्यांवयन द्वारा तय किया जाता है । एक खेल में, उदाहरण के लिए, वेग खेल दुनिया के भौतिकी के अधीन हो सकता है । अंय अनुप्रयोगों में, वेग जो कुछ भी फार्मूला सही कार्रवाई के लिए यह प्रतिनिधित्व करता है लगता है पर आधारित हो सकता है । परीक्षण का सबसे अच्छा तरीका यह कैसे लगता है की एक विचार प्राप्त है । हमारे अनुभव में, कुछ परीक्षण और त्रुटि के लिए कुछ है कि लगता है पर बसने की जरूरत है-और लगता है-बस सही है ।

हमारे कार्यांवयन में, हम समय की लंबाई लात बंद हो जाता है की वजह से गति से पहले बदलती जा रहे हैं, और फिर बस अंतिम गंतव्य के लिए छवि का एक एनीमेशन शुरू onFling द्वारा हमें पारित वेग () विधि और समय हम सेट की राशि के आधार पर । याद रखें, लात इशारा जब तक उपयोगकर्ताओं को उंगली अब प्रदर्शन को छू रहा है के बाद पता नहीं है । के बारे में सोचो एक चट्टान फेंकने की तरह-रॉक यात्रा जारी है जब आप इसे जारी-यह हिस्सा हम चेतन करना चाहते है एक बार उपयोगकर्ता "जाने देता है."

जटिल लगता है? यहां कोड है:

हम भी दो MotionEvent मापदंडों की जांच करने की जरूरत नहीं है, वेग डेटा हमारे प्रयोजनों के लिए पर्याप्त है । वेग इकाइयों पिक्सेल प्रति सेकंड में हैं । तो, हम वेग डेटा का उपयोग करने के लिए एक स्केलिंग कारक है कि समय की अंतिम अवधि के पहले छवि पूरी तरह से आराम करने के लिए आता है निर्धारित करने के लिए इस्तेमाल किया जाएगा पर फैसला कर सकते हैं । हमारे मामले में, हम एक दूसरे (४०० ms) के ४०% का उपयोग कर रहे हैं । तो, ४०% से आधा दो वेग मूल्यों गुणा (उर्फ distanceTimeFactor चर) हम कुल एक दूसरे के इस अंश के बाद प्राप्त आंदोलन के साथ आते हैं । अंत में, हम पर इस जानकारी को पारित करने के लिए हमारे कस्टम onAnimateMove () दृश्य वस्तु है, जो वास्तव में हमारे ग्राफिक कर देगा के लिए स्क्रीन को लात गति घटना द्वारा प्रदान की जानकारी का उपयोग कर के पार जाने के लिए दिखाई देते हैं ।

आधा आरंभिक वेग क्यों? हम पर शुरू कर रहे हैं, कहते हैं, वेग एक और समय के किसी भी राशि से अधिक बी वेग पर समाप्त, औसत वेग है (A + B)/ इस मामले में, समाप्त वेग 0 है । तो, हम यहां आधे में वेग इतना है कि हम अनजाने में नहीं छवि बनाने की तरह यह हमारी उंगली से दूर कूद रहा है तेजी से यह पहले कि हम इसे जारी की जा रही थी ।

क्यों ४०० ms? सब पर कोई कारण नहीं है, लेकिन यह ज्यादातर उपकरणों पर काफी अच्छा लग रहा है । यह अपने माउस आंदोलनों-बहुत तेजी से औजार के विपरीत नहीं है और यह उछल और देखने के लिए मुश्किल लगता है, बहुत धीमी गति से और आप अपने सुस्त mousepointer के लिए अपने मस्तिष्क के साथ पकड़ने के लिए इंतजार कर रहे हैं । इस मान को अपने लात के "महसूस" के लिए समायोजित करने के लिए मुख्य चर है । उच्च मूल्य, कम "घर्षण" छवि के लिए जब स्क्रीन पर एक बंद फिसलने लगता होगा । यदि आप वास्तविक सतह विविधताओं है, तो आप नियमित रूप से भौतिकी गणना लागू करने की आवश्यकता होगी । यहां, हम सिर्फ एक निश्चित कार्य कर रहे है किसी भी असली भौतिकी के बिना नीचे धीमा ।

चरण 7: छवि चलती

अब जब कि सभी इशारों हम संभाला क्षेत्र में रुचि रखते हैं, यह समय अंतर्निहित ग्राफिक के वास्तविक आंदोलन को लागू करने के लिए है । वापस PlayAreaView वर्ग में, onMove () विधि जोड़ें:

यह विधि दो बातें करती है । सबसे पहले, यह अनुवाद (= एक बिंदु से कदम के लिए ग्राफिक्स शब्द अनुवाद) हमारे दूरी उंगली से अपनी मैट्रिक्स ले जाया गया । इसके बाद यह दृश्य अमान्य कर दिया जाता है ताकि इसे फिर से आरेखित किया जाएगा । ड्राइंग करते समय, छवि दृश्य के भीतर एक अलग स्थान में आकर्षित करेगा । यदि हम पूरे दृश्य वस्तु पैन करना चाहता था, हम अनुवाद () दृश्य वस्तु की विधि का उपयोग करने के लिए अपने आंतरिक अपने कैनवास द्वारा सभी ड्राइंग प्रदर्शन मैट्रिक्स अद्यतन कर सकते हैं । यह अच्छी तरह से कुछ बातों के लिए काम हो सकता है, लेकिन अगर हम कुछ स्थिर था (जिसके द्वारा हम तय मतलब है, स्थिर, पहाड़ों की तरह unमूविंग,) दृश्य के अंदर सामान, यह नहीं होगा । इसके बजाय, इस मामले के लिए, हम सिर्फ अपने मैट्रिक्स अद्यतन, अनुवाद, कि हम हर बार हम ग्राफिक आकर्षित का उपयोग करें ।

अब हम onResetLocation () विधि के रूप में अच्छी तरह से जोड़ें:

इस विधि बस मैट्रिक्स पहचान मैट्रिक्स को रीसेट करता है और दृश्य के माध्यम से फिर से फिर से तैयार किया जा करने के लिए अमान्य () विधि. जब दृश्य पुनः आरेखित किया जाता है, तो ग्राफ़िक उसकी आरंभिक स्थिति में वापस हो जाएगा ।

चरण 8: सुचारू रूप से छवि चलती

लात आंदोलन के लिए, हम एक छोटे से अधिक सिर्फ यह एक नए स्थान में आकर्षित करने के लिए है । हम चाहते हैं कि वह उस स्थिति को चेतन smoooooothly. एक चिकनी आंदोलन एनीमेशन के माध्यम से प्राप्त किया जा सकता है-कि है, एक अलग स्थान पर छवि ड्राइंग बहुत तेजी से । Android में अंतर्निहित ऐनिमेशन क्लासेस हैं, लेकिन वे पूरे दृश्यों पर लागू होते हैं. हम किसी दृश्य ऑब्जेक्ट को ऐनिमेट नहीं कर रहे हैं । इसके बजाय, हम एक दृश्य द्वारा नियंत्रित कैनवास पर एक छवि ले जा रहे हैं । इसलिए, हमें अपने एनिमेशन को लागू करना होगा । रफ़ू. अछा

Android एनीमेशन कक्षाओं में बनाया का उपयोग एनिमेशन के दौरान विशिष्ट समय में एक वस्तु के स्थान tweak मदद करने के लिए विभिन्न interpolators प्रदान करता है. हम अपने स्वयं के एनीमेशन के भीतर इन विभिंन interpolators का लाभ उठाने के लिए थोड़ा काम बचा सकते है-और कुछ मज़ा प्रभाव लागू होते हैं । यह संभव है क्योंकि प्रदान की interpolators अच्छी तरह से सामांय है और कैसे निर्मित दृश्य एनिमेशन काम में विशेष के लिए बंधे नहीं है ।

चलो onAnimateMove () विधि के साथ शुरू:

इस विधि में, हम प्रारंभिक स्थान, प्रारंभिक समय, और अंत समय ट्रैक ।

यहां, हम OvershootInterpolator वर्ग का उपयोग कर अपने एनीमेशन शुरू । चूंकि इस interpolator छवि का कारण बनता है एक छोटे से आगे बढ़ना, कुल मिलाकर, हम क्या गणना की तुलना में, छवि तकनीकी रूप से थोड़ा तेजी से शुरू होगा । यह एक छोटे से पर्याप्त अंतर है कि यह गौर नहीं किया जाना चाहिए है, लेकिन अगर आप परिशुद्धता सटीकता के बाद जा रहे थे, तो आप उस के लिए समायोजित करने की आवश्यकता होगी (जो अपने interpolator लेखन मतलब होगा-
इस ट्यूटोरियल के दायरे से परे-और कूच कुल दूरी की गणना के लिए एक विधि होने) ।

इस जानकारी के सभी जब (समय में) हम एनीमेशन की कुल अवधि के साथ कर रहे है निर्धारित करने के लिए प्रयोग किया जाता है । हम इस डेटा का उपयोग निर्धारित करने के लिए करते है जब (प्रतिशत समय में) हम इस जानकारी को interpolator में पास कर रहे हैं । इस interpolator की जरूरत है तो यह हमें बता सकते है जहां (प्रतिशत दूरी में) हम शुरू बिंदु से हमारी गति के अंत बिंदु से कर रहे हैं । हम इस का उपयोग करते हैं, बारी में, यह निर्धारित करने के लिए जहां (पिक्सल में) हम प्रारंभिक बिंदु से हैं ।

यह गणना सब onAnimateStep () विधि में किया जाता है, नीचे दिखाया गया है । हम संदेश पंक्ति के लिए एक पोस्ट के माध्यम से onAnimationStep () विधि कहते हैं । हम एक तंग पाश में पाने के लिए नहीं करना चाहते-हम सिस्टम अप्रतिसादी हो जाने के लिए कारण होगा । तो, एक सरल तरीका सिर्फ संदेश पोस्ट करने के लिए है । यह सिस्टम थ्रेड्स के साथ डील करने के लिए बिना एसिंक्रोनस व्यवहार प्रदान करके उत्तरदायी रहने के लिए अनुमति देता है । जब से हम UI धागे पर हमारे ड्राइंग है, वैसे भी, वहां इस सरल उदाहरण में एक धागे को थोड़ा बिंदु है ।

अब चलो onAnimateStep () विधि को लागू:

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.