ImageBitmap לעומת ImageVector

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

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

פורמט של גרפיקה רסטר מכיל פיקסלים: ריבועים קטנים שכל אחד מהם מכיל צבע (שמורכב מערכים של אדום, ירוק, כחול ואלפא). כשממקמים הרבה פיקסלים ביחד, אפשר ליצור תמונה מפורטת מאוד, כמו תמונה. לגרפיקה רסטר יש רזולוציה קבועה (מספר קבוע של פיקסלים). המשמעות היא שככל שמגדילים את התמונה, היא מאבדת פרטים ועלולה להופיע בה פיקסליזציה. דוגמאות לפורמטים של גרפיקה רסטרית הם JPEG,‏ PNG ו-WEBP.

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

ImageBitmap

ב-Compose, אפשר לטעון תמונת רסטר (שנקראת לעיתים קרובות Bitmap) למופע ImageBitmap, ו-BitmapPainter הוא מה שאחראי לציור מפת הסיביות על המסך.

לתרחישי שימוש פשוטים, אפשר להשתמש ב-painterResource(), שיוצר ImageBitmap ומחזיר אובייקט Painter (במקרה הזה – BitmapPainter):

Image(
    painter = painterResource(id = R.drawable.dog),
    contentDescription = stringResource(id = R.string.dog_content_description)
)
VectorVsBitmapSnippets.kt

אם אתם צריכים התאמה אישית נוספת (למשל הטמעה של צייר בהתאמה אישית) וצריכים גישה אל ImageBitmap עצמו, אתם יכולים לטעון אותו באופן הבא:

val imageBitmap = ImageBitmap.imageResource(R.drawable.dog)
VectorVsBitmapSnippets.kt

ImageVector

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

אפשר ליצור ImageVector מותאם אישית על ידי ייבוא של קובץ XML קיים של וקטור (שייוב ל-Android Studio באמצעות כלי הייבוא) או על ידי הטמעה של המחלקה והנפקת פקודות נתיב באופן ידני.

במקרים פשוטים, הפונקציה painterResource() פועלת עבור המחלקה ImageBitmap באותה דרך שבה היא פועלת עבור ImageVectors, ומחזירה את VectorPainter כתוצאה. ‫painterResource() מטפל בטעינה של VectorDrawables ושל BitmapDrawables אל VectorPainter ו-BitmapPainter בהתאמה. כדי לטעון VectorDrawable לתמונה, משתמשים בפקודה:

Image(
    painter = painterResource(id = R.drawable.baseline_shopping_cart_24),
    contentDescription = stringResource(id = R.string.shopping_cart_content_desc)
)
VectorVsBitmapSnippets.kt

אם אתם צריכים התאמה אישית נוספת וגישה אל ImageVector עצמו, אתם יכולים לטעון אותו באופן הבא:

val imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)
VectorVsBitmapSnippets.kt