פיתוח אפליקציות מותאמות

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

מהן אפליקציות מותאמות?

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

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

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

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

אפליקציות מותאמות נראות נהדר ומשתלבות היטב בכל מכשיר ובכל הגדרות אישיות.

למה כדאי ליצור ממשקי משתמש גמישים?

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

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

Google Play

ב-Google Play יש אוספים ספציפיים של אפליקציות לטאבלטים ומתקפלים וגם שמאפשרות למשתמשים לגלות אפליקציות באיכות גבוהה.

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

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

איור 2. אזהרה לגבי איכות טכנית בדף הפרטים של האפליקציה.

פיתוח אפליקציות מותאמות כדי להרחיב את יכולת הגילוי ב-Google Play ולמקסם את מספר המכשירים שניתן להוריד מהם את האפליקציה.

איך מתחילים

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

כדי ליצור אפליקציה מותאמת שתומכת בכל הגדלים ובכל ההגדרות: הבאים:

  • השתמשו בסיווגים של גודל החלון כדי לקבל החלטות לגבי הפריסה
  • פיתוח באמצעות הספרייה המותאמת של Material 3
  • תמיכה בקלט מעבר למגע
  • בדיקה בכל סוגי המכשירים

סיווגי גודל של חלונות

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

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

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

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

מחשבים את WindowSizeClass של האפליקציה באמצעות currentWindowAdaptiveInfo() הפונקציה ברמה העליונה של כתיבה ספרייה מותאמת של Material 3. הפונקציה מחזירה מופע של WindowAdaptiveInfo, שמכיל windowSizeClass. האפליקציה שלך מקבלת עדכונים בכל פעם שסיווג גודל החלון משתנה:

val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass

חלוניות תוכן

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

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

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

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

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

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

איור 5. פריסת רשימה-פרטים עם חלונית רשימה כיעד ניווט.
איור 6. פריסת רשימה-פרטים עם חלונית פרטים כיעד ניווט.

יצירת חומר 3 מותאם

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

הספרייה המותאמת ל-Compose Material 3 מכילה תכנים קומפוזביליים שמנהלים סיווגי גודל של חלונות, רכיבי ניווט, פריסות של חלוניות מרובות ו תנוחות מתקפלות ומיקום צירים, לדוגמה:

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

  • ListDetailPaneScaffold: הטמעה של הדף הקנוני של פרטי הרשימה פריסה.

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

  • SupportingPaneScaffold: הטמעה של חלונית התמיכה הקנונית פריסה.

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

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

הגדרה והמשכיות

אפליקציות מותאמות שומרות על רציפות במהלך שינויים בהגדרות.

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

כברירת מחדל, שינויים בהגדרות יוצרים מחדש את הפעילות באפליקציה וכל הפעילות אובדת את המצב. כדי לשמור על המשכיות, אפליקציות מותאמות שומרות את המצב onSaveInstanceState() של הפעילות או ב-ViewModel.

מצב

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

איור 7. מכשיר מתקפל במצב שולחני.

הממשק WindowInfoTracker ב-Jetpack windowManager מאפשר לקבל רשימה של DisplayFeature אובייקטים בשביל המכשיר. בין המסכים תכונות הן FoldingFeature.State, שמציין אם המכשיר פתוח לגמרי או למחצה.

הספרייה Material 3 Adaptive מספקת הפונקציה currentWindowAdaptiveInfo() ברמה העליונה, שמחזירה מופע של WindowAdaptiveInfo שמכיל windowPosture.

קלט מעבר למגע

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

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

  • Jetpack Compose 1.7 ואילך: ניווט באמצעות כרטיסיות במקלדת ועכבר או כברירת מחדל יש תמיכה בלחיצה, בחירה וגלילה במשטח המגע.

  • הספרייה androidx.compose.material3 של Jetpack: מאפשרת למשתמשים לכתוב לכל רכיב TextField באמצעות סטיילוס.

  • כלי העזר למקשי קיצור: מאפשר פלטפורמת Android ומקלדת באפליקציה קיצורי דרך שהמשתמשים יכולים למצוא. פרסום מקשי הקיצור של האפליקציה ב: כלי העזרה למקשי קיצור מוצגים על ידי ביטול של קריאה חוזרת (callback) של חלון onProvideKeyboardShortcuts().

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

איך בודקים אפליקציות מותאמות

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

הנחיות איכות לאפליקציות במסך גדול

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

מערכים מרובים של הגדרות אישיות

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

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

צילומי מסך בצד המארח

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

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

יצירת תצוגות מקדימות

תצוגות מקדימות של פיתוח נייטיב מאפשרות לך לבדוק את ממשק המשתמש של האפליקציה בתצוגת העיצוב של Android אולפן. תצוגות מקדימות כוללות הערות כמו @PreviewScreenSizes, @PreviewFontScale ו-@PreviewLightDark כדי לאפשר הצגה של תוכן קומפוזבילי תוכן בתצורות שונות. אפשר אפילו לבצע פעולות בתצוגה המקדימה.

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

למידע נוסף, ראו תצוגה מקדימה של ממשק המשתמש באמצעות תצוגות מקדימות קומפוזביליות.

אמולטורים

ב-Android Studio יש מגוון אמולטורים לבדיקה של גודלי פריסה שונים:

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

סטרימינג ממכשיר מרוחק

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

סטרימינג ממכשיר מרוחק משולב ב-Android Studio. לקבלת מידע נוסף, למידע נוסף על סטרימינג במכשירי Android שמופעלת על ידי Firebase.

מקורות מידע נוספים