מילוי אוטומטי במצב יצירת מוזיקה

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

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

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

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

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

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

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

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

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

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

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

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

איור 1. דף הגדרות שבו מוצג איך לציין ספק פרטי כניסה.

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

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

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

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

הוספת שדות למילוי אוטומטי עם כמה סוגים

במקרים מסוימים, יכול להיות שתרצו להקצות ל-TextField יותר מContentType אחת. לדוגמה, בשדה התחברות אפשר להזין כתובת אימייל או שם משתמש. אפשר להוסיף כמה סוגי תוכן ל-TextField באמצעות האופרטור +.

במאמרי העזרה בנושא ContentType מפורטים כל סוגי הנתונים שאפשר לשמור באמצעות מילוי אוטומטי.

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

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

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

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

איור 2. צ'יפים בסרגל הכלים של הטקסט שמוצגים בהם פרטי כניסה שמורים.

שמירת נתונים באמצעות מילוי אוטומטי דרך ניווט

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

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

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

קטעי הקוד הבאים מראים איך לשמור נתונים באמצעות מילוי אוטומטי באופן מפורש באמצעות לחצן:

1. יוצרים משתנה מקומי שיכיל את מנהל המילוי האוטומטי, שאותו אפשר לאחזר בדרך הבאה:

   val autofillManager = LocalAutofillManager.current
   AutofillSnippets.kt

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

3. כדי להפעיל את ההקשר של המילוי האוטומטי, לוחצים על הכפתור:

   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.

כשהמשתמש ילחץ על הכפתור, יוצג לו הגיליון התחתון הזה, שבו הוא יתבקש לשמור את פרטי הכניסה בספק פרטי הכניסה שנבחר:

איור 3. גיליון תחתון שבו המשתמשים מתבקשים לשמור את הסיסמה.

שמירת נתונים באמצעות מילוי אוטומטי דרך הצעת סיסמה חזקה

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

איור 4. הצ'יפ להצעת סיסמה חזקה בסרגל הכלים של המקלדת.

איור 5. גיליון תחתון שבו המשתמשים מתבקשים להשתמש בסיסמה חזקה.

פתרון בעיות

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

איור 6. גיליון תחתון שבו המשתמשים מתבקשים לשמור את הסיסמה.

התאמה אישית נוספת של המילוי האוטומטי

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

כדי להתאים אישית את צבע ההדגשה, משתמשים ב-CompositionLocal ומציינים את הצבע הרצוי. צבע ברירת המחדל להדגשה של המילוי האוטומטי הוא Color(0x4dffeb3b).

val customHighlightColor = Color.Red

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