بیت‌مپ تصویر دربرابر بردار تصویر

دو نوع رایج قالب تصویر، تصویر شطرنجی و تصویر برداری است.

قالب گرافیک شطرنجی حاوی پیکسل است: مربع‌های کوچک منفردی که حاوی رنگ (ساخته‌شده از مقادیر قرمز، سبز، آبی، و آلفا) هستند. وقتی تعداد زیادی پیکسل در کنار هم قرار می‌گیرند، می‌توان تصویر بسیار دقیقی مانند عکس ایجاد کرد. گرافیک شطرنجی وضوح ثابتی دارد (تعداد پیکسل ثابت). این یعنی وقتی اندازه تصویر را افزایش می‌دهید، جزئیات آن ازدست می‌رود و ممکن است پیکسل‌بندی رخ دهد. نمونه‌هایی از قالب‌های گرافیک شطرنجی عبارت‌اند از JPEG،‏ PNG، و WEBP.

عکس نمای نزدیک از یک سگ گلدن رتریور.
شکل ۱. نمونه فایل JPEG.

از سوی دیگر، تصاویر برداری نمایش‌های ریاضی مقیاس‌پذیر از یک عنصر بصری روی صفحه هستند. بردار مجموعه‌ای از دستورات است که نحوه ترسیم تصویر روی صفحه را توصیف می‌کند—برای مثال، خط، نقطه، یا پر کردن. وقتی بردار روی صفحه مقیاس‌بندی می‌شود، کیفیت آن ازدست نمی‌رود، زیرا فرمول ریاضی رابطه بین دستورات مختلف را حفظ می‌کند. نمونه‌های خوب ImageVector عبارت‌اند از نمادهای «مواد»، زیرا همه آن‌ها را می‌توان با فرمول‌های ریاضی تعریف کرد.

نماد ساده‌ای با خطوط هنری از سبد خرید با دسته، سبد، و دو چرخ.
شکل ۲. مثال برداری (پسوند فایل‌ها .xml است یا در کد Kotlin تعریف شده است).

ImageBitmap

در «نوشتن»، تصویر شطرنجی (که اغلب به‌عنوان Bitmap شناخته می‌شود) می‌تواند در نمونه ImageBitmap بار شود، و BitmapPainter مسئول رسم کردن بیت‌مپ روی صفحه است.

برای موارد استفاده پایه، از painterResource() می‌توان برای ایجاد ImageBitmap استفاده کرد و شیء Painter (در این مورد - BitmapPainter) را برمی‌گرداند:

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

اگر به سفارشی‌سازی بیشتری نیاز دارید (برای نمونه، پیاده‌سازی نقاش سفارشی) و باید به خود ImageBitmap دسترسی داشته باشید، می‌توانید آن را به این روش بار کنید:

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

ImageVector

VectorPainter مسئول رسم ImageVector روی صفحه‌نمایش است. ‫ImageVector از زیرمجموعه‌ای از فرمان‌های «نگاره‌سازی برداری مقیاس‌پذیر» (SVG) پشتیبانی می‌کند. همه تصاویر را نمی‌توان به‌صورت برداری نمایش داد (برای مثال، عکس‌هایی که با دوربین می‌گیرید را نمی‌توان به بردار تبدیل کرد).

می‌توانید ImageVector را با وارد کردن فایل XML بردار کشیدنی موجود (واردشده به «استودیو Android» بااستفاده از ابزار وارد کردن) یا پیاده‌سازی کلاس و صادر کردن دستی دستورات مسیر ایجاد کنید.

برای موارد استفاده پایه، painterResource() برای ImageVectors به همان روشی که برای کلاس ImageBitmap کار می‌کند، عمل می‌کند و 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)
)

اگر به سفارشی‌سازی بیشتری نیاز دارید و باید به خود ImageVector دسترسی داشته باشید، می‌توانید آن را به روش زیر بار کنید:

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