কম্পোজে অটোফিল

কিছু অ্যাপ, যেমন পাসওয়ার্ড ম্যানেজার, ব্যবহারকারীর প্রদত্ত ডেটা ব্যবহার করে অন্যান্য অ্যাপের উপাদান পূরণ করতে পারে। যেসব অ্যাপ অন্যান্য অ্যাপের উপাদান পূরণ করে তাদের অটোফিল পরিষেবা বলা হয়। অটোফিল ফ্রেমওয়ার্ক একটি অ্যাপ এবং একটি অটোফিল পরিষেবার মধ্যে যোগাযোগ পরিচালনা করে।

শংসাপত্র এবং ফর্ম পূরণ করা একটি সময়সাপেক্ষ এবং ত্রুটি-প্রবণ কাজ। অটোফিল ব্যবহারকারীদের ক্ষেত্রগুলি পূরণ করার সময় বাঁচাতে সাহায্য করে এবং ব্যবহারকারীর ইনপুট ত্রুটি কমিয়ে দেয়।

মাত্র কয়েকটি লাইন কোড দিয়ে, আপনি কম্পোজে অটোফিল বাস্তবায়ন করতে পারেন। এই বৈশিষ্ট্যটি ব্যবহারকারীদের নিম্নলিখিত সুবিধা প্রদান করে:

শংসাপত্র পূরণ করুন

অটোফিল ব্যবহারকারীদের নিম্নলিখিত উপায়ে তাদের শংসাপত্র পূরণ করতে দেয়:

• ব্যবহারকারী যখন এমন একটি ক্ষেত্রে ট্যাপ করেন যেখানে অটোফিল সেমান্টিক্স সেট করা থাকে, তখন সিস্টেমটি তাদের জন্য অটোফিল পরামর্শ প্রদর্শন করে।
• সিস্টেমটি ব্যবহারকারীর জন্য অটোফিল পরামর্শ প্রদর্শন করে এবং ব্যবহারকারী কী টাইপ করে তার উপর ভিত্তি করে সেগুলি ফিল্টার করে।

শংসাপত্র সংরক্ষণ করুন

ব্যবহারকারীরা নিম্নলিখিত উপায়ে অটোফিলের মাধ্যমে শংসাপত্র সংরক্ষণ করতে পারেন:

• সিস্টেমটি একটি সংরক্ষণ ডায়ালগ ট্রিগার করে, যা ব্যবহারকারীকে তথ্য সংরক্ষণ করতে অনুরোধ করে যখন তারা একটি অটোফিল-সক্ষম ক্ষেত্রে নতুন বা আপডেট করা তথ্য ইনপুট করে। সংরক্ষণ দুটি উপায়ে করা যেতে পারে:
  • স্পষ্টভাবে, তথ্য প্রদানের মাধ্যমে (উদাহরণস্বরূপ, একটি বোতাম ক্লিকের মাধ্যমে)
  • স্পষ্টতই, যখন কোনও ব্যবহারকারী পৃষ্ঠা থেকে দূরে সরে যান
• আপনার শংসাপত্র প্রদানকারীর উপর নির্ভর করে, যখন কোনও ক্ষেত্রে ContentType.NewPassword সেট থাকে তখন সিস্টেম ব্যবহারকারীকে একটি শক্তিশালী পাসওয়ার্ড প্রস্তাব করতে পারে।

ব্যবহারকারীদের জন্য সংরক্ষিত ডেটা পুনরুদ্ধারের প্রক্রিয়া সহজতর করতে আপনি আপনার অ্যাপে অটোফিল ব্যবহার করতে পারেন। অটোফিল BasicTextField এবং সেই উপাদানের উপর ভিত্তি করে তৈরি সমস্ত ম্যাটেরিয়াল টেক্সট ফিল্ডের মাধ্যমে টেক্সট কম্পোনেন্টগুলিকে সমর্থন করে।

অটোফিল সেট আপ করুন

আপনার ডিভাইস বা এমুলেটরে অটোফিল API ব্যবহার করার আগে, আপনাকে সেটিংসে অটোফিল সক্রিয় করতে হবে। সেখানে, আপনি আপনার শংসাপত্র সংরক্ষণের জন্য অটোফিলের জন্য একটি শংসাপত্র প্রদানকারী নির্দিষ্ট করতে পারেন।

কন্টেন্ট টাইপ ব্যবহার করে আপনার টেক্সট ফিল্ডে অটোফিল যোগ করুন

একটি TextField Autofill-সক্রিয় কিনা তা বোঝাতে, ContentType শব্দার্থবিদ্যাকে সেই ধরণের ধরণ দিয়ে সেট করুন যা ক্ষেত্রটি গ্রহণ করতে পারে। এটি Autofill পরিষেবাগুলিকে নির্দেশ করে যে এই নির্দিষ্ট ক্ষেত্রের সাথে কোন ধরণের ব্যবহারকারীর ডেটা প্রাসঙ্গিক হতে পারে। 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 যোগ করেন, তখন ব্যবহারকারীদের শংসাপত্র পূরণ করতে সক্ষম হওয়ার জন্য আপনাকে আর কিছু করতে হবে না।

যখন একজন ব্যবহারকারী একটি অটোফিল-সক্ষম ক্ষেত্রে ক্লিক করেন, যদি প্রাসঙ্গিক ডেটা সঞ্চিত থাকে, তাহলে তারা কীবোর্ডের উপরে টুলবারে একটি চিপ দেখতে পান যা তাদের শংসাপত্র পূরণ করতে অনুরোধ করে।

নেভিগেশনের মাধ্যমে অটোফিলের মাধ্যমে ডেটা সংরক্ষণ করুন

কম্পোজ স্বয়ংক্রিয়ভাবে নির্ধারণ করার চেষ্টা করে যে কখন একজন ব্যবহারকারী একটি পৃষ্ঠা থেকে নেভিগেট করে এবং ইনপুট করা শংসাপত্রগুলি কমিট করে। একবার একটি ক্ষেত্র অটোফিল-সক্ষম হয়ে গেলে, কোনও অতিরিক্ত কোডের প্রয়োজন ছাড়াই যখন একজন ব্যবহারকারী পৃষ্ঠা থেকে দূরে নেভিগেট করেন তখন এটি স্বয়ংক্রিয়ভাবে শংসাপত্রের তথ্য সংরক্ষণ করবে।

অটোফিলের মাধ্যমে স্পষ্টভাবে ডেটা সংরক্ষণ করুন

অটোফিলের মাধ্যমে টেক্সট ফিল্ডের মাধ্যমে নতুন শংসাপত্রগুলি স্পষ্টভাবে সংরক্ষণ করার জন্য, অটোফিল ম্যানেজার দ্বারা অটোফিল প্রসঙ্গটি প্রতিশ্রুতিবদ্ধ (অথবা বাতিল) করা উচিত। স্থানীয় অটোফিল ম্যানেজার যখনই প্রয়োজন তখন অটোফিল ফ্রেমওয়ার্কের সাথে যোগাযোগ করে। আপনি যদি ব্যবহারকারীর ইনপুট করা শংসাপত্রগুলি সরাতে চান, তাহলে সংরক্ষণ না করেই যেকোনো মুলতুবি থাকা ডেটা মুছে ফেলতে 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

যখনই কোনও ব্যবহারকারী স্ক্রিন থেকে দূরে সরে যান তখনই কমিট কল করা হয়। যদি একটি সাবমিট বোতাম নেভিগেশনের সাথে সংযুক্ত থাকে, তাহলে কমিট কল করার প্রয়োজন নেই। যদি আপনি এখনও একটি সাবমিট ক্লিক করে সেভ ডায়ালগটি ট্রিগার করতে চান, তাহলে এখানে কমিট যোগ করুন।

যখন ব্যবহারকারী বোতামটি ক্লিক করবেন, তখন তারা এই নীচের শীটটি দেখতে পাবেন যা তাদের নির্বাচিত শংসাপত্র সরবরাহকারীর কাছে শংসাপত্রগুলি সংরক্ষণ করার জন্য অনুরোধ করবে:

শক্তিশালী পাসওয়ার্ড সাজেস্ট করে অটোফিলের মাধ্যমে ডেটা সংরক্ষণ করুন

আপনার শংসাপত্র সরবরাহকারীর উপর নির্ভর করে, যখন আপনি 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