'लिखें' विकल्प में ऑटोमैटिक भरने की सुविधा

संग्रह की मदद से व्यवस्थित रहें अपनी प्राथमिकताओं के आधार पर, कॉन्टेंट को सेव करें और कैटगरी में बांटें.

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

क्रेडेंशियल और फ़ॉर्म भरने में काफ़ी समय लगता है. साथ ही, इनमें गड़बड़ियां होने की संभावना भी होती है. ऑटोमैटिक भरने की सुविधा की मदद से, उपयोगकर्ताओं को फ़ील्ड भरने में लगने वाला समय बचता है. साथ ही, उपयोगकर्ता के इनपुट से जुड़ी गलतियां कम होती हैं.

Compose में ऑटोमैटिक भरने की सुविधा को लागू करने के लिए, सिर्फ़ कुछ लाइनों का कोड इस्तेमाल किया जा सकता है. इस सुविधा से, उपयोगकर्ताओं को ये फ़ायदे मिलते हैं:

क्रेडेंशियल भरना

ऑटोमैटिक भरने की सुविधा की मदद से, उपयोगकर्ता अपने क्रेडेंशियल इन तरीकों से भर सकते हैं:

• जब उपयोगकर्ता किसी ऐसे फ़ील्ड पर टैप करता है जिसमें ऑटोमैटिक भरने की सुविधा से जुड़े सेमेटिक सेट होते हैं, तो सिस्टम उसे ऑटोमैटिक भरने के सुझाव दिखाता है.
• सिस्टम, उपयोगकर्ता के लिए ऑटोमैटिक भरने की सुविधा के सुझाव दिखाता है. साथ ही, उपयोगकर्ता के टाइप किए गए शब्दों के आधार पर उन्हें फ़िल्टर करता है.

क्रेडेंशियल सेव करें

उपयोगकर्ता, ऑटोमैटिक भरने की सुविधा की मदद से क्रेडेंशियल इन तरीकों से सेव कर सकते हैं:

• सिस्टम, 'सेव करें' डायलॉग को ट्रिगर करता है. यह डायलॉग तब दिखता है, जब उपयोगकर्ता ऑटोमैटिक भरने की सुविधा वाले फ़ील्ड में नई या अपडेट की गई जानकारी डालता है. सेव करने के दो तरीके हैं:
  • साफ़ तौर पर, जानकारी को स्वीकार करके (उदाहरण के लिए, बटन पर क्लिक करके)
  • जब कोई उपयोगकर्ता पेज से बाहर निकलता है, तो यह इवेंट अपने-आप ट्रिगर होता है
• क्रेडेंशियल देने वाली कंपनी के आधार पर, सिस्टम किसी फ़ील्ड में ContentType.NewPassword सेट होने पर, उपयोगकर्ता को एक मज़बूत पासवर्ड का सुझाव दे सकता है.

अपने ऐप्लिकेशन में ऑटोमैटिक भरने की सुविधा का इस्तेमाल करके, उपयोगकर्ताओं के लिए सेव किए गए डेटा को आसानी से वापस लाया जा सकता है. अपने-आप भरने की सुविधा, BasicTextField और उस कॉम्पोनेंट पर बने सभी Material टेक्स्ट फ़ील्ड के ज़रिए टेक्स्ट कॉम्पोनेंट के साथ काम करती है.

अपने आप भरें जाना सेट करें

अपने डिवाइस या एमुलेटर पर ऑटोमैटिक भरने की सुविधा वाले एपीआई का इस्तेमाल करने से पहले, आपको सेटिंग में जाकर ऑटोमैटिक भरने की सुविधा चालू करनी होगी. यहां, अपने क्रेडेंशियल सेव करने के लिए, ऑटोमैटिक भरने की सुविधा के लिए क्रेडेंशियल उपलब्ध कराने वाली सेवा चुनी जा सकती है.

कॉन्टेंट टाइप का इस्तेमाल करके, अपने टेक्स्ट फ़ील्ड में ऑटोमैटिक भरने की सुविधा जोड़ना

यह बताने के लिए कि TextField में अपने-आप भरने की सुविधा चालू है, ContentType के सिमेंटिक को उन टाइप के साथ सेट करें जिन्हें फ़ील्ड स्वीकार कर सकता है. इससे, ऑटोमैटिक भरने की सुविधाओं को पता चलता है कि इस फ़ील्ड के लिए, उपयोगकर्ता का किस तरह का डेटा काम का हो सकता है. ContentType.Username का इस्तेमाल करके, TextField सेट करें, ताकि उपयोगकर्ता अपने उपयोगकर्ता नाम से इसे भर सकें.

ContentType सेमेटिक्स सेट करके, आपके उपयोगकर्ता अपने डिवाइस के क्रेडेंशियल प्रोवाइडर में पहले से सेव की गई, ऑटोमैटिक भरने की सुविधा वाली जानकारी को ऐक्सेस कर सकते हैं. उदाहरण के लिए, अगर किसी उपयोगकर्ता ने अपने लैपटॉप पर Chrome ब्राउज़र से आपके ऐप्लिकेशन में पहले ही साइन इन कर लिया है और क्रेडेंशियल देने वाली सेवा की मदद से अपना पासवर्ड सेव कर लिया है, तो ऑटोमैटिक भरने की सुविधा की मदद से उसे अपने क्रेडेंशियल मिल जाते हैं.

वैल्यू पर आधारित टेक्स्ट फ़ील्ड

TextField(
    value = textFieldValue.value,
    onValueChange = {textFieldValue.value = it},
    modifier = Modifier.semantics { contentType = ContentType.Username }
)
AutofillSnippets.kt

राज्य के हिसाब से टेक्स्ट फ़ील्ड

TextField(
    state = rememberTextFieldState(),
    modifier = Modifier.semantics { contentType = ContentType.Username }
)
AutofillSnippets.kt

कई तरह के ऑटोमैटिक भरने वाले फ़ील्ड जोड़ना

कुछ मामलों में, हो सकता है कि आपको अपने TextField को एक से ज़्यादा ContentType का इस्तेमाल करना हो. उदाहरण के लिए, लॉगिन फ़ील्ड में ईमेल पता या उपयोगकर्ता नाम डाला जा सकता है. + ऑपरेटर की मदद से, अपने TextField में कई तरह के कॉन्टेंट जोड़े जा सकते हैं.

ऑटोमैटिक भरने की सुविधा की मदद से सेव किए जा सकने वाले सभी तरह के डेटा के लिए, ContentType रेफ़रंस देखें.

वैल्यू पर आधारित टेक्स्ट फ़ील्ड

TextField(
    value = textFieldValue.value,
    onValueChange = { textFieldValue.value = it },
    modifier = Modifier.semantics {
        contentType = ContentType.Username + ContentType.EmailAddress
    }
)
AutofillSnippets.kt

राज्य के हिसाब से टेक्स्ट फ़ील्ड

TextField(
    state = rememberTextFieldState(),
    modifier = Modifier.semantics {
        contentType = ContentType.Username + ContentType.EmailAddress
    }
)
AutofillSnippets.kt

ऑटोमैटिक भरने की सुविधा से डेटा भरना

TextField में ContentType जोड़ने के बाद, उपयोगकर्ताओं को क्रेडेंशियल भरने के लिए कुछ और करने की ज़रूरत नहीं होगी.

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

नेविगेशन की मदद से ऑटोमैटिक भरने की सुविधा का इस्तेमाल करके डेटा बचाना

Compose, उपयोगकर्ता के किसी पेज से जाने और डाले गए क्रेडेंशियल को सेव करने के समय का पता लगाने की कोशिश करता है. किसी फ़ील्ड में ऑटोमैटिक भरने की सुविधा चालू करने के बाद, उपयोगकर्ता जब पेज से बाहर निकलेगा, तो क्रेडेंशियल की जानकारी अपने-आप सेव हो जाएगी. इसके लिए, किसी अतिरिक्त कोड की ज़रूरत नहीं होगी.

ऑटोमैटिक भरने की सुविधा की मदद से, डेटा को साफ़ तौर पर सेव करना

अपने-आप जानकारी भरने की सुविधा वाले टेक्स्ट फ़ील्ड की मदद से, नए क्रेडेंशियल साफ़ तौर पर सेव करने के लिए, अपने-आप जानकारी भरने की सुविधा मैनेजर को अपने-आप जानकारी भरने का कॉन्टेक्स्ट कमिट करना चाहिए या रद्द करना चाहिए. इसके बाद, ज़रूरत पड़ने पर स्थानीय ऑटोमैटिक भरने की सुविधा मैनेजर, ऑटोमैटिक भरने की सुविधा के फ़्रेमवर्क से संपर्क करता है. अगर आपको उपयोगकर्ता के डाले गए क्रेडेंशियल हटाने हैं, तो सेव किए बिना किसी भी डेटा को मिटाने के लिए, AutofillManager.cancel को कॉल करें.

यहां दिए गए स्निपेट में, बटन का इस्तेमाल करके ऑटोमैटिक भरने की सुविधा की मदद से डेटा सेव करने का तरीका बताया गया है:

1. ऑटोमैटिक भरने की सुविधा मैनेजर को सेव करने के लिए, एक लोकल वैरिएबल बनाएं. इसे इस तरह से वापस पाया जा सकता है:

   val autofillManager = LocalAutofillManager.current
   AutofillSnippets.kt

2. अपने TextField(s) में, चुना गया कॉन्टेंट टाइप जोड़ें. इसके लिए, Modifier.semantics का इस्तेमाल करें:

   • वैल्यू पर आधारित टेक्स्ट फ़ील्ड के साथ:

     val autofillManager = LocalAutofillManager.current
     
     Column {
         TextField(
             value = textFieldValue.value,
             onValueChange = { textFieldValue.value = it },
             modifier = Modifier.semantics { contentType = ContentType.NewUsername }
         )
     
         Spacer(modifier = Modifier.height(16.dp))
     
         TextField(
             value = textFieldValue.value,
             onValueChange = { textFieldValue.value = it },
             modifier = Modifier.semantics { contentType = ContentType.NewPassword }
         )
     }
     AutofillSnippets.kt

   • स्थिति के हिसाब से टेक्स्ट फ़ील्ड के साथ:

     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 }
         )
     }
     AutofillSnippets.kt

3. बटन पर क्लिक करके, ज़रूरत के हिसाब से ऑटोमैटिक भरने की सुविधा के कॉन्टेक्स्ट को लागू करें:

   • वैल्यू पर आधारित टेक्स्ट फ़ील्ड के साथ:

     val autofillManager = LocalAutofillManager.current
     
     Column {
         TextField(
             value = textFieldValue.value,
             onValueChange = { textFieldValue.value = it },
             modifier = Modifier.semantics { contentType = ContentType.NewUsername },
         )
     
         Spacer(modifier = Modifier.height(16.dp))
     
         TextField(
             value = textFieldValue.value,
             onValueChange = { textFieldValue.value = it },
             modifier = Modifier.semantics { contentType = ContentType.NewPassword },
         )
     
         // Submit button
         Button(onClick = { autofillManager?.commit() }) { Text("Reset credentials") }
     }
     AutofillSnippets.kt

   • स्थिति के हिसाब से टेक्स्ट फ़ील्ड के साथ:

     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") }
     }
     AutofillSnippets.kt

जब भी उपयोगकर्ता किसी दूसरी स्क्रीन पर जाता है, तो Commit को कॉल किया जाता है. अगर सबमिट करें बटन, नेविगेशन से लिंक है, तो कमिट करें को कॉल करने की ज़रूरत नहीं है. अगर आपको सेव करने के लिए, अब भी सबमिट करें पर क्लिक करना है, तो यहां कमिट करें जोड़ें.

जब उपयोगकर्ता बटन पर क्लिक करता है, तो उसे सबसे नीचे यह शीट दिखेगी. इसमें उसे क्रेडेंशियल सेव करने के लिए कहा जाएगा. क्रेडेंशियल, चुने गए क्रेडेंशियल प्रोवाइडर के पास सेव किए जाएंगे:

'मज़बूत पासवर्ड सुझाएं' सुविधा की मदद से, अपने-आप भरने की सुविधा का इस्तेमाल करके डेटा सेव करना

क्रेडेंशियल देने वाली कंपनी के हिसाब से, NewUsername और NewPassword कॉन्टेंट टाइप का इस्तेमाल करते समय, उपयोगकर्ताओं को कीबोर्ड में एक बटन दिख सकता है. इस बटन का इस्तेमाल करके, मज़बूत पासवर्ड का सुझाव पाया जा सकता है. इस पर क्लिक करने पर, सबसे नीचे एक शीट दिखती है. इसमें, उपयोगकर्ता अपने क्रेडेंशियल सेव कर सकते हैं. उपयोगकर्ताओं को यह अनुभव देने के लिए, आपको कुछ और लागू करने की ज़रूरत नहीं है.

समस्या का हल

"सेव हो रही है" उपयोगकर्ता जर्नी को शुरू करते समय, अगर आपने "अभी नहीं" पर एक से ज़्यादा बार क्लिक किया है, तो हो सकता है कि क्रेडेंशियल उपलब्ध कराने वाली कंपनी, सबसे नीचे मौजूद शीट न दिखाए. इसे फिर से चालू करने और फिर से दिखने के लिए, आपको उन ऐप्लिकेशन को हटाना होगा जिन्होंने "क्या यह पासवर्ड याद रखना है?" को ब्लॉक किया है.

अपने-आप जानकारी भरने की सुविधा को ज़्यादा पसंद के मुताबिक बनाना

ऑटोमैटिक भरने की सुविधा के सामान्य उपयोगकर्ता अनुभव में, जब ऑटोमैटिक भरने की सुविधा वाले किसी कॉम्पोनेंट में क्रेडेंशियल अपने-आप भर जाते हैं, तो उसका रंग बदल जाता है और वह हाइलाइट हो जाता है. इससे उपयोगकर्ता को यह पता चलता है कि ऑटोमैटिक भरने की सुविधा पूरी हो गई है.

हाइलाइट करने के लिए इस्तेमाल किए जाने वाले रंग को पसंद के मुताबिक बनाने के लिए, CompositionLocal का इस्तेमाल करें और अपनी पसंद का रंग डालें. ऑटोमैटिक भरने की सुविधा के हाइलाइट किए गए टेक्स्ट का डिफ़ॉल्ट रंग Color(0x4dffeb3b) है.

वैल्यू पर आधारित टेक्स्ट फ़ील्ड

val customHighlightColor = Color.Red

CompositionLocalProvider(LocalAutofillHighlightColor provides customHighlightColor) {
    TextField(
        value = textFieldValue.value,
        onValueChange = { textFieldValue.value = it },
        modifier = Modifier.semantics { contentType = ContentType.Username }
    )
}
AutofillSnippets.kt

स्थिति के हिसाब से टेक्स्ट फ़ील्ड

val customHighlightColor = Color.Red

CompositionLocalProvider(LocalAutofillHighlightColor provides customHighlightColor) {
    TextField(
        state = rememberTextFieldState(),
        modifier = Modifier.semantics { contentType = ContentType.Username }
    )
}
AutofillSnippets.kt