पासवर्ड मैनेजर जैसे कुछ ऐप्लिकेशन, उपयोगकर्ता के दिए गए डेटा की मदद से, अन्य ऐप्लिकेशन में कॉम्पोनेंट भर सकते हैं. अन्य ऐप्लिकेशन के कॉम्पोनेंट में जानकारी भरने वाले ऐप्लिकेशन को, जानकारी ऑटोमैटिक भरने की सेवाएं कहा जाता है. ऑटोफ़िल फ़्रेमवर्क, किसी ऐप्लिकेशन और पासवर्ड अपने-आप भरने, मैनेज करने, और सेव करने की सेवा के बीच कम्यूनिकेशन को मैनेज करता है.
क्रेडेंशियल और फ़ॉर्म भरना, समय लेने वाला और गड़बड़ी की संभावना वाला काम है. ऑटोमैटिक तरीके से भरने की सुविधा से, उपयोगकर्ताओं को फ़ील्ड भरने में लगने वाला समय बचता है. साथ ही, उपयोगकर्ताओं से होने वाली गलतियां कम होती हैं.
Compose में, जानकारी अपने-आप भरने की सुविधा को लागू करने के लिए, आपको सिर्फ़ कुछ लाइन का कोड लिखना होगा. इस सुविधा से उपयोगकर्ताओं को ये फ़ायदे मिलते हैं:
क्रेडेंशियल भरें
जानकारी अपने-आप भरने की सुविधा की मदद से, उपयोगकर्ता अपने क्रेडेंशियल इन तरीकों से भर सकते हैं:
- जब उपयोगकर्ता किसी ऐसे फ़ील्ड पर टैप करता है जहां जानकारी अपने-आप भरने की सुविधा के सिमैंटिक सेट हैं, तो सिस्टम उसे जानकारी अपने-आप भरने के सुझाव दिखाता है.
- सिस्टम, उपयोगकर्ता को जानकारी अपने-आप भरने के सुझाव दिखाता है. साथ ही, उपयोगकर्ता के टाइप किए गए टेक्स्ट के आधार पर, सुझावों को फ़िल्टर करता है.
क्रेडेंशियल सेव करें
उपयोगकर्ता, जानकारी अपने-आप भरने की सुविधा का इस्तेमाल करके, क्रेडेंशियल इन तरीकों से सेव कर सकते हैं:
- सिस्टम, सेव करने के लिए एक डायलॉग बॉक्स ट्रिगर करता है. यह डायलॉग बॉक्स, उपयोगकर्ता को जानकारी सेव करने के लिए कहता है. ऐसा तब होता है, जब उपयोगकर्ता ऑटोमैटिक भरने की सुविधा वाले फ़ील्ड में नई या अपडेट की गई जानकारी डालता है.
सेव करने के दो तरीके हैं:
- साफ़ तौर पर, जानकारी सबमिट करके. उदाहरण के लिए, किसी बटन पर क्लिक करके
- जब कोई उपयोगकर्ता पेज से बाहर जाता है, तब यह इवेंट अपने-आप ट्रिगर होता है
- क्रेडेंशियल की सेवा देने वाली कंपनी के आधार पर, सिस्टम उपयोगकर्ता को मज़बूत पासवर्ड का सुझाव दे सकता है. ऐसा तब होता है, जब किसी फ़ील्ड में
ContentType.NewPasswordसेट हो.
अपने ऐप्लिकेशन में, जानकारी अपने-आप भरने की सुविधा का इस्तेमाल किया जा सकता है. इससे उपयोगकर्ताओं के लिए, सेव किए गए डेटा को वापस पाना आसान हो जाता है. ऑटोमैटिक तरीके से भरने की सुविधा, BasicTextField और उस कॉम्पोनेंट पर आधारित सभी Material टेक्स्ट फ़ील्ड के ज़रिए टेक्स्ट कॉम्पोनेंट के साथ काम करती है.
अपने आप भरें जाना सेट करें
अपने डिवाइस या एम्युलेटर पर, जानकारी ऑटोमैटिक भरने की सुविधा वाले एपीआई इस्तेमाल करने से पहले, आपको सेटिंग में जाकर जानकारी ऑटोमैटिक भरने की सुविधा चालू करनी होगी. वहां, जानकारी अपने-आप भरने की सुविधा के लिए क्रेडेंशियल प्रोवाइडर को चुना जा सकता है, ताकि आपके क्रेडेंशियल सेव किए जा सकें.
कॉन्टेंट टाइप का इस्तेमाल करके, टेक्स्ट फ़ील्ड में जानकारी अपने-आप भरने की सुविधा जोड़ना
यह बताने के लिए कि किसी TextField में जानकारी अपने-आप भरने की सुविधा चालू है, ContentType सिमैंटिक को उन टाइप के साथ सेट करें जिन्हें फ़ील्ड स्वीकार कर सकता है. इससे, पासवर्ड अपने-आप भरने, मैनेज करने, और सेव करने की सेवाओं को पता चलता है कि इस फ़ील्ड के लिए, उपयोगकर्ता का किस तरह का डेटा काम का हो सकता है. ContentType.Username का इस्तेमाल करके, TextField सेट करें. उपयोगकर्ता इसे अपने उपयोगकर्ता नाम से भर सकते हैं.
ContentType सिमैंटिक सेट करके, आपके उपयोगकर्ता अपने-आप जानकारी भरने की सुविधा को ऐक्सेस कर सकते हैं. यह जानकारी, उनके डिवाइस के क्रेडेंशियल प्रोवाइडर में पहले से सेव होती है. उदाहरण के लिए, अगर किसी उपयोगकर्ता ने अपने लैपटॉप पर Chrome ब्राउज़र के ज़रिए आपके ऐप्लिकेशन में पहले ही साइन इन कर लिया है और क्रेडेंशियल उपलब्ध कराने वाली सेवा के ज़रिए अपना पासवर्ड सेव कर लिया है, तो जानकारी अपने-आप भरने की सुविधा के ज़रिए उसके क्रेडेंशियल उपलब्ध कराए जाते हैं.
TextField( state = rememberTextFieldState(), modifier = Modifier.semantics { contentType = ContentType.Username } )
ऑटोमैटिक तरीके से भरने की सुविधा के लिए, अलग-अलग तरह के फ़ील्ड जोड़ना
कुछ मामलों में, हो सकता है कि आप अपने TextField को एक से ज़्यादा ContentType की ज़िम्मेदारी देना चाहें. उदाहरण के लिए, लॉगिन फ़ील्ड में ईमेल पता या उपयोगकर्ता नाम डाला जा सकता है. + ऑपरेटर की मदद से, TextField में कई तरह का कॉन्टेंट जोड़ा जा सकता है.
ऑटोमैटिक तरीके से भरने की सुविधा के साथ सेव किए जा सकने वाले सभी तरह के डेटा के बारे में जानने के लिए, ContentType रेफ़रंस देखें.
TextField( state = rememberTextFieldState(), modifier = Modifier.semantics { contentType = ContentType.Username + ContentType.EmailAddress } )
ऑटोमैटिक तरीके से भरने की सुविधा का इस्तेमाल करके डेटा भरना
TextField में ContentType जोड़ने पर, आपको कुछ और करने की ज़रूरत नहीं होगी. इसके बाद, उपयोगकर्ता क्रेडेंशियल भर पाएंगे.
जब कोई उपयोगकर्ता, ऑटोमैटिक तरीके से भरने की सुविधा वाले फ़ील्ड पर क्लिक करता है, तो उससे जुड़ा डेटा सेव होने पर, उसे कीबोर्ड के ऊपर मौजूद टूलबार में एक चिप दिखता है. यह चिप, उपयोगकर्ता को क्रेडेंशियल भरने के लिए कहता है.
नेविगेशन की मदद से, ऑटोमैटिक तरीके से भरने की सुविधा का इस्तेमाल करके डेटा सेव करना
Compose अपने-आप यह पता लगाने की कोशिश करता है कि उपयोगकर्ता किसी पेज से कब नेविगेट करता है और डाले गए क्रेडेंशियल कब सबमिट करता है. किसी फ़ील्ड के लिए, जानकारी अपने-आप भरने की सुविधा चालू करने पर, उपयोगकर्ता के पेज से बाहर जाने पर क्रेडेंशियल की जानकारी अपने-आप सेव हो जाएगी. इसके लिए, किसी अतिरिक्त कोड की ज़रूरत नहीं होगी.
ऑटोमैटिक तरीके से भरने की सुविधा का इस्तेमाल करके, डेटा को साफ़ तौर पर सेव करना
जानकारी अपने-आप भरने की सुविधा वाले टेक्स्ट फ़ील्ड के ज़रिए नए क्रेडेंशियल साफ़ तौर पर सेव करने के लिए, जानकारी अपने-आप भरने की सुविधा के मैनेजर को जानकारी अपने-आप भरने की सुविधा के कॉन्टेक्स्ट को लागू करना (या रद्द करना) चाहिए. इसके बाद, स्थानीय ऑटोफ़िल मैनेजर, ज़रूरत पड़ने पर ऑटोफ़िल फ़्रेमवर्क के साथ कम्यूनिकेट करता है. अगर आपको उपयोगकर्ता के डाले गए क्रेडेंशियल हटाने हैं, तो सेव किए बिना किसी भी डेटा को मिटाने के लिए, AutofillManager.cancel को कॉल करें.
यहां दिए गए स्निपेट में, बटन का इस्तेमाल करके, ऑटोमैटिक तरीके से भरने की सुविधा के साथ डेटा सेव करने का तरीका बताया गया है:
ऑटोमैटिक तरीके से भरने की सुविधा के मैनेजर को सेव करने के लिए, एक लोकल वैरिएबल बनाएं. इसे इस तरीके से वापस पाया जा सकता है:
val autofillManager = LocalAutofillManager.current
TextField(s)में,Modifier.semanticsकी मदद से अपनी पसंद का कॉन्टेंट टाइप जोड़ें:val autofillManager = LocalAutofillManager.current Column { TextField( state = rememberTextFieldState(), modifier = Modifier.semantics { contentType = ContentType.NewUsername } ) Spacer(modifier = Modifier.height(16.dp)) TextField( state = rememberTextFieldState(), modifier = Modifier.semantics { contentType = ContentType.NewPassword } ) }
बटन पर क्लिक करके, ज़रूरत के हिसाब से ऑटोमैटिक तरीके से भरने की सुविधा का कॉन्टेक्स्ट लागू करें:
val autofillManager = LocalAutofillManager.current Column { TextField( state = rememberTextFieldState(), modifier = Modifier.semantics { contentType = ContentType.NewUsername }, ) Spacer(modifier = Modifier.height(16.dp)) TextField( state = rememberTextFieldState(), modifier = Modifier.semantics { contentType = ContentType.NewPassword }, ) // Submit button Button(onClick = { autofillManager?.commit() }) { Text("Reset credentials") } }
जब भी कोई उपयोगकर्ता स्क्रीन से दूर जाता है, तब Commit को कॉल किया जाता है. अगर सबमिट करें बटन को नेविगेशन से लिंक किया गया है, तो कमिट को कॉल करने की ज़रूरत नहीं है. अगर आपको अब भी सबमिट करें पर क्लिक करके, सेव करने वाला डायलॉग बॉक्स ट्रिगर करना है, तो यहां कमिट करें जोड़ें.
जब उपयोगकर्ता बटन पर क्लिक करेगा, तो उसे यह बॉटम शीट दिखेगी. इसमें उसे क्रेडेंशियल सेव करने के लिए कहा जाएगा. क्रेडेंशियल, क्रेडेंशियल मैनेजर की चुनी गई सेवा में सेव किए जाएंगे:
मज़बूत पासवर्ड का सुझाव पाने की सुविधा की मदद से, ऑटोमैटिक तरीके से भरने की सुविधा का इस्तेमाल करके डेटा सेव करना
क्रेडेंशियल की सेवा देने वाली कंपनी के आधार पर, NewUsername और NewPassword कॉन्टेंट टाइप का इस्तेमाल करने पर, उपयोगकर्ताओं को कीबोर्ड में मज़बूत पासवर्ड का सुझाव दें बटन दिख सकता है. इस पर क्लिक करने पर, एक बॉटम शीट दिखती है.
इसकी मदद से, वे अपने क्रेडेंशियल सेव कर सकते हैं. उपयोगकर्ताओं को यह अनुभव देने के लिए, आपको कुछ और लागू करने की ज़रूरत नहीं है.
समस्या का हल
"सेव करने" की उपयोगकर्ता गतिविधि को शुरू करते समय, अगर आपने "अभी नहीं" पर एक से ज़्यादा बार क्लिक किया, तो हो सकता है कि क्रेडेंशियल की सेवा देने वाली कंपनी, बॉटम शीट न दिखाए. इसे फिर से चालू करने और स्क्रीन पर दिखाने के लिए, आपको उन ऐप्लिकेशन को हटाना होगा जिन्होंने "क्या आपको यह पासवर्ड याद रखना है?" सुविधा को ब्लॉक किया है.
जानकारी अपने-आप भरने की सुविधा को पसंद के मुताबिक बनाना
जानकारी ऑटोमैटिक भरने की सुविधा के सामान्य उपयोगकर्ता अनुभव में, जब इस सुविधा वाले कॉम्पोनेंट में क्रेडेंशियल भर दिए जाते हैं, तो उसका रंग बदल जाता है और वह हाइलाइट हो जाता है. इससे उपयोगकर्ता को पता चलता है कि जानकारी ऑटोमैटिक भरने की सुविधा पूरी हो गई है.
हाइलाइट करने के लिए इस्तेमाल होने वाले इस रंग को पसंद के मुताबिक बनाने के लिए, CompositionLocal का इस्तेमाल करें और अपनी पसंद का कोई भी रंग चुनें. जानकारी ऑटोमैटिक भरने की सुविधा के लिए, हाइलाइट का डिफ़ॉल्ट रंग Color(0x4dffeb3b) के तौर पर सेट होता है.
val customHighlightColor = Color.Red CompositionLocalProvider(LocalAutofillHighlightColor provides customHighlightColor) { TextField( state = rememberTextFieldState(), modifier = Modifier.semantics { contentType = ContentType.Username } ) }