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

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

איור 1. כלי מוטמע לבדיקת פריסות באפליקציית Jetchat.

שנתחיל?

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

הנה כמה דוגמאות למשימות נפוצות:

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

בחירה או בידוד של תצוגה

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

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

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

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

הסתרת גבולות הפריסה והצגת תוויות

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

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

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

תמונות המצב כוללות את הנתונים שמוצגים בדרך כלל כשמשתמשים בכלי Layout Inspector, כולל עיבוד תלת-ממדי מפורט של הפריסה, עץ הרכיבים של הפריסה מסוג View,‏ Compose או היברידית, ומאפיינים מפורטים של כל רכיב בממשק המשתמש. כדי לשמור תמונת מצב, לוחצים על ייצוא/ייבוא של תמונת מצב ייצוא או ייבוא של תמונת מצב ואז על ייצוא תמונת מצב.

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

מצב תלת-ממד

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

כלי לבדיקת פריסות: תצוגת תלת-ממד
איור 2. תצוגת תלת-ממד מסובבת של פריסה.
כלי לבדיקת פריסות: תצוגת הריווח בין השכבות
איור 3. כדי להרחיב או לכווץ את השכבות של הפריסה, משתמשים בפס ההזזה מרווח בין השכבות.

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

כדי להשוות את פריסת האפליקציה לתמונת הפניה, כמו מוקאפ של ממשק משתמש, אפשר לטעון שכבת-על של תמונת bitmap בכלי Layout Inspector.

  • כדי לטעון שכבת-על, בוחרים באפשרות Load Overlay (טעינת שכבת-על) בסרגל הכלים של Layout Inspector (כלי לבדיקת פריסה). גודל שכבת-העל מותאם לפריסה.
  • כדי לשנות את השקיפות של השכבה, משתמשים בפס ההזזה Overlay Alpha.
  • כדי להסיר את שכבת העל, לוחצים על הסרת שכבת העל

בדיקת הכתיבה

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

מידע נוסף על הכלי לבדיקת פריסה בכתיבת הודעות

צפייה בבדיקת מאפיינים

כדי שהכלי Layout Inspector יפעל בצורה תקינה, צריך להגדיר את ההגדרה הגלובלית הבאה:

adb shell settings put global debug_view_attributes 1

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

ההגדרה מופעלת אוטומטית כשמפעילים את Layout Inspector. הפעולה הזו גורמת להפעלה מחדש של הפעילות הנוכחית בחזית. לא תראו הפעלה מחדש של פעילות אלא אם תשביתו את ההגדרה במכשיר באופן ידני.

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

adb shell settings delete global debug_view_attributes

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

כלי עצמאי לבדיקת פריסות

כדי להשיג ביצועים אופטימליים, מומלץ להשתמש בכלי לבדיקת פריסה במצב המוטמע שמוגדר כברירת מחדל. כדי לבטל את ההטמעה של Layout Inspector, עוברים אל File (קובץ) (Android Studio ב-macOS)> Settings (הגדרות) > Tools (כלים) > Layout Inspector (כלי לבדיקת פריסה) ומבטלים את הסימון של תיבת הסימון Enable embedded Layout Inspector (הפעלת כלי מוטמע לבדיקת פריסה).

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