دو نوع رایج از فرمت های تصویر، تصاویر شطرنجی و برداری هستند.
یک قالب گرافیکی شطرنجی حاوی پیکسلها است: مربعهای کوچکی که حاوی یک رنگ هستند (از مقادیر قرمز، سبز، آبی و آلفا تشکیل شدهاند). هنگام قرار دادن تعداد زیادی پیکسل در کنار هم، می توان یک تصویر بسیار دقیق مانند یک عکس ایجاد کرد. یک گرافیک شطرنجی دارای وضوح ثابت (تعداد ثابت پیکسل) است. این به این معنی است که وقتی اندازه تصویر را افزایش می دهید، جزئیات آن از بین می رود و پیکسل شدن می تواند رخ دهد. نمونه هایی از فرمت های گرافیکی شطرنجی JPEG، PNG و WEBP هستند.
![نمونه فایل JPEG](https://developer.android.com/static/develop/ui/compose/images/graphics-sourceimage.jpg?hl=fa)
از سوی دیگر، تصاویر برداری، نمایشهای ریاضی مقیاسپذیری از یک عنصر بصری روی صفحه هستند. وکتور مجموعه ای از دستورات است که نحوه رسم تصویر را بر روی صفحه توصیف می کند - به عنوان مثال، یک خط، نقطه، یا پر کردن. هنگام مقیاس بندی یک برداری روی صفحه، کیفیت آن را از دست نمی دهد زیرا فرمول ریاضی رابطه بین دستورات مختلف را حفظ می کند. یک مثال خوب از ImageVector نمادهای مواد هستند، زیرا همه آنها را می توان با فرمول های ریاضی تعریف کرد.
![مثال برداری (پسوندهای فایل xml. هستند یا با کد Kotlin تعریف شده اند)](https://developer.android.com/static/develop/ui/compose/images/graphics-shopping.png?hl=fa)
ImageBitmap
در Compose، یک تصویر شطرنجی (اغلب به عنوان 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 Studio با استفاده از ابزار import ) یا پیاده سازی کلاس و صدور دستورات مسیر به صورت دستی.
برای موارد استفاده ساده، همان روشی که 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) )
اگر به سفارشی سازی بیشتر نیاز دارید و نیاز به دسترسی به خود ImageVector
دارید، می توانید آن را به روش زیر بارگذاری کنید:
val imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)
برای شما توصیه می شود
- توجه: وقتی جاوا اسکریپت خاموش است، متن پیوند نمایش داده می شود
- نقاش سفارشی {:#custom-painter}
- منابع در Compose
- در حال بارگذاری تصاویر {:#loading-images}