מילוי אוטומטי בחלונית הכתיבה

אפליקציות מסוימות, כמו מנהלי סיסמאות, יכולות למלא את הרכיבים באפליקציות אחרות בנתונים שהמשתמש מספק. אפליקציות שממלאות רכיבים של אפליקציות אחרות נקראות שירותי מילוי אוטומטי. מסגרת המילוי האוטומטי מנהלת את התקשורת בין אפליקציה לבין שירות מילוי אוטומטי.

מילוי פרטי כניסה וטפסים הוא משימה שלוקחת זמן רב ועלולה להוביל לשגיאות. המילוי האוטומטי מאפשר למשתמשים לחסוך זמן בהזנת נתונים בשדות, ומצמצם את שגיאות ההזנה.

אפשר להטמיע מילוי אוטומטי ב-Compose באמצעות כמה שורות קוד בלבד. התכונה הזו מספקת למשתמשים את היתרונות הבאים:

מילוי פרטי הכניסה

התכונה 'מילוי אוטומטי' מאפשרת למשתמשים למלא את פרטי הכניסה שלהם בדרכים הבאות:

• המערכת מציגה למשתמש הצעות למילוי אוטומטי כשהוא מקיש על שדה שמוגדרים בו כללי מילוי אוטומטי.
• המערכת מציגה למשתמש הצעות למילוי אוטומטי ומסננת אותן על סמך מה שהמשתמש מקליד.

שמירת פרטי הכניסה

משתמשים יכולים לשמור פרטי כניסה באמצעות המילוי האוטומטי בדרכים הבאות:

• המערכת מציגה תיבת דו-שיח לשמירה, שבה המשתמש מתבקש לשמור מידע כשהוא מזין מידע חדש או מעודכן בשדה שמופעל בו מילוי אוטומטי. אפשר לשמור את ההגדרות בשתי דרכים:
  • באופן מפורש, על ידי אישור מידע (לדוגמה, בלחיצה על לחצן)
  • באופן מרומז, כשמשתמש יוצא מהדף
• בהתאם לספק פרטי הכניסה, המערכת עשויה להציע למשתמש סיסמה חזקה כשהשדה מוגדר כ-ContentType.NewPassword.

אתם יכולים להשתמש במילוי אוטומטי באפליקציה כדי לייעל את השליפה של נתונים שמורים עבור המשתמשים. ההשלמה האוטומטית תומכת ברכיבי טקסט דרך BasicTextField ובכל שדות הטקסט של Material שמבוססים על הרכיב הזה.

הגדר מילוי אוטומטי

לפני שמשתמשים בממשקי ה-API של המילוי האוטומטי במכשיר או באמולטור, צריך להפעיל את המילוי האוטומטי בהגדרות. שם תוכלו לציין ספק פרטי כניסה למילוי האוטומטי כדי לאחסן את פרטי הכניסה שלכם.

הוספת מילוי אוטומטי לשדה טקסט באמצעות סוג תוכן

כדי לציין ש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

מילוי נתונים באמצעות המילוי האוטומטי

כשמוסיפים ContentType ב-TextField, לא צריך לעשות שום דבר נוסף כדי שהמשתמשים יוכלו למלא את פרטי הכניסה.

כשמשתמש לוחץ על שדה שמופעלת בו השלמה אוטומטית, אם יש נתונים רלוונטיים שמורים, הוא רואה צ'יפ בסרגל הכלים שמעל המקלדת שמציע לו למלא את פרטי הכניסה.

חיסכון בנתונים בעזרת מילוי אוטומטי באמצעות ניווט

התכונה 'כתיבה אוטומטית' מנסה לקבוע באופן אוטומטי מתי משתמש עובר מדף אחד ומזין את פרטי הכניסה. אחרי שמפעילים מילוי אוטומטי בשדה, פרטי הכניסה נשמרים אוטומטית כשהמשתמש עובר לדף אחר, בלי שצריך להוסיף קוד.

שמירת נתונים באופן מפורש באמצעות מילוי אוטומטי

כדי לשמור במפורש פרטי כניסה חדשים באמצעות שדות טקסט עם מילוי אוטומטי, מנהל המילוי האוטומטי צריך לאשר (או לבטל) את הקשר של המילוי האוטומטי. לאחר מכן, מנהל המילוי האוטומטי המקומי מתקשר עם מסגרת המילוי האוטומטי כשצריך. אם רוצים להסיר את פרטי הכניסה שהמשתמש הזין, צריך להתקשר אל 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 מופעלת בכל פעם שמשתמש יוצא מהמסך. אם לחצן Submit מקושר לניווט, אין צורך לקרוא ל-Commit. אם עדיין רוצים שלחיצה על שליחה תפעיל את תיבת הדו-שיח של השמירה, מוסיפים 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