יצירת כיתה לצפייה

רוצה לנסות את שיטת הכתיבה?
'Jetpack פיתוח נייטיב' היא ערכת הכלים המומלצת לממשק המשתמש ל-Android. הסבר איך עובדים עם פריסות ב'כתיבה'.
פריסות מותאמות אישית ב'כתיבה' ←

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

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

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

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

תצוגה לפי סיווג משנה

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

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

Kotlin

class PieChart(context: Context, attrs: AttributeSet) : View(context, attrs)

Java

class PieChart extends View {
    public PieChart(Context context, AttributeSet attrs) {
        super(context, attrs);
    }
}

הגדרת מאפיינים מותאמים אישית

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

  • אפשר להגדיר מאפיינים מותאמים אישית לתצוגה ברכיב משאב <declare-styleable> .
  • מציינים ערכים למאפיינים בפריסת ה-XML.
  • אחזור ערכי מאפיינים בזמן ריצה.
  • מחילים על התצוגה המפורטת את ערכי המאפיינים שאוחזרו.

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

כדי להגדיר מאפיינים מותאמים אישית, צריך להוסיף משאבים מסוג <declare-styleable> לפרויקט. מקובל להכניס את המשאבים האלה קובץ res/values/attrs.xml. הנה דוגמה לקובץ attrs.xml: 

<resources>
   <declare-styleable name="PieChart">
       <attr name="showText" format="boolean" />
       <attr name="labelPosition" format="enum">
           <enum name="left" value="0"/>
           <enum name="right" value="1"/>
       </attr>
   </declare-styleable>
</resources>

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

אחרי שמגדירים מאפיינים מותאמים אישית, אפשר להשתמש בהם בפריסה של קובצי XML בדיוק כמו המאפיינים המובנים. . היחיד ההבדל הוא שהמאפיינים המותאמים אישית שייכים למרחב שמות אחר. במקום תחושת שייכות למרחב השמות http://schemas.android.com/apk/res/android, הם שייכים ל-http://schemas.android.com/apk/res/[your package name]. לדוגמה, כך אתם יכולים להשתמש מאפיינים שהוגדרו עבור PieChart: 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:custom="http://schemas.android.com/apk/res-auto">
 <com.example.customviews.charting.PieChart
     custom:showText="true"
     custom:labelPosition="left" />
</LinearLayout>

כדי להימנע מהצורך לחזור על ה-URI הארוך של מרחב השמות, הדוגמה משתמשת ב- ההוראה xmlns. ההוראה הזו תקצה את הכינוי custom ל מרחב השמות http://schemas.android.com/apk/res/com.example.customviews. אפשר לבחור כל כתובת אימייל חלופית שרוצים למרחב השמות.

שימו לב לשם של תג ה-XML שמוסיף את התצוגה המותאמת אישית לפריסה. זו לחלוטין השם המוסמך של שיעור צפייה בהתאמה אישית. אם הכיתה של הצופה היא כיתה פנימית, צריך לשפר את ההתאמה שלה בשם המחלקה החיצונית של התצוגה. לדוגמה, בכיתה PieChart יש כיתה פנימית בשם PieView. כדי להשתמש מהכיתה הזו, משתמשים בתג com.example.customviews.charting.PieChart$PieView.

החלת מאפיינים מותאמים אישית

כשנוצרת תצוגה מפריסת XML, כל המאפיינים בתג ה-XML נקראים מהמשאב מקובצות ומועברות ל-constructor של התצוגה AttributeSet למרות שזה לקרוא ערכים ישירות מ-AttributeSet, ככה יש כמה חסרונות:

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

במקום זאת, מעבירים את AttributeSet אל obtainStyledAttributes(). השיטה הזו מחזירה TypedArray מערך של ערכים כבר בוטלה והסגנון שלה.

מהדר המשאבים של Android משקיע הרבה מאמץ כדי לבצע שיחות obtainStyledAttributes() יותר קל. לכל <declare-styleable> בספרייה res/, השדה R.java שנוצר מגדיר גם מערך של מאפיינים מזהים וקבוצת של קבועים שמגדירים את האינדקס לכל מאפיין במערך. תשתמשו קבועים לקרוא את המאפיינים מהשדה TypedArray. כך עושים את זה הכיתה PieChart קורא את המאפיינים שלו:

Kotlin

init {
    context.theme.obtainStyledAttributes(
            attrs,
            R.styleable.PieChart,
            0, 0).apply {

        try {
            mShowText = getBoolean(R.styleable.PieChart_showText, false)
            textPos = getInteger(R.styleable.PieChart_labelPosition, 0)
        } finally {
            recycle()
        }
    }
}

Java

public PieChart(Context context, AttributeSet attrs) {
   super(context, attrs);
   TypedArray a = context.getTheme().obtainStyledAttributes(
        attrs,
        R.styleable.PieChart,
        0, 0);

   try {
       mShowText = a.getBoolean(R.styleable.PieChart_showText, false);
       textPos = a.getInteger(R.styleable.PieChart_labelPosition, 0);
   } finally {
       a.recycle();
   }
}

הערה: TypedArray אובייקטים הן משאב משותף וצריך למחזר אותן לאחר השימוש.

הוספת נכסים ואירועים

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

Kotlin

fun isShowText(): Boolean {
    return mShowText
}

fun setShowText(showText: Boolean) {
    mShowText = showText
    invalidate()
    requestLayout()
}

Java

public boolean isShowText() {
   return mShowText;
}

public void setShowText(boolean showText) {
   mShowText = showText;
   invalidate();
   requestLayout();
}

לתשומת ליבך, setShowText קוראת ל-invalidate() ו-requestLayout(). השיחות האלה חיוניות כדי להבטיח שהתצוגה תפעל באופן מהימן. צריך כדי לבטל את תוקף התצוגה אחרי כל שינוי במאפיינים שלה שעשוי לשנות את המראה, המערכת יודעת שצריך לשרטט אותו מחדש. באופן דומה, תצטרכו לבקש פריסה חדשה אם משתנה באופן מסוים שעשויים להשפיע על הגודל או הצורה של התצוגה. השכיחה של קריאות ה-method האלה עלולה לגרום קשה למצוא באגים.

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

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

תכנון תוך התחשבות בנגישות

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

  • מוסיפים תוויות לשדות להזנת קלט באמצעות android:contentDescription .
  • שליחת אירועי נגישות באמצעות התקשרות אל sendAccessibilityEvent() כשיש צורך.
  • תמיכה בבקרים חלופיים, כמו לחצני החיצים (D-pad) או כדור עקיבה.

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