با مجموعهها، منظم بمانید
ذخیره و طبقهبندی محتوا براساس اولویتهای شما.
دو نوع رایج از فرمت های تصویر، تصاویر شطرنجی و برداری هستند.
یک قالب گرافیکی شطرنجی حاوی پیکسلها است: مربعهای کوچکی که حاوی یک رنگ هستند (از مقادیر قرمز، سبز، آبی و آلفا تشکیل شدهاند). هنگام قرار دادن تعداد زیادی پیکسل در کنار هم، می توان یک تصویر بسیار دقیق مانند یک عکس ایجاد کرد. یک گرافیک شطرنجی دارای وضوح ثابت (تعداد ثابت پیکسل) است. این به این معنی است که وقتی اندازه تصویر را افزایش می دهید، جزئیات آن از بین می رود و پیکسل شدن می تواند رخ دهد. نمونه هایی از فرمت های گرافیکی شطرنجی JPEG، PNG و WEBP هستند.
شکل 1 : نمونه فایل JPEG
از سوی دیگر، تصاویر برداری، نمایشهای ریاضی مقیاسپذیری از یک عنصر بصری روی صفحه هستند. وکتور مجموعه ای از دستورات است که نحوه رسم تصویر را بر روی صفحه توصیف می کند - به عنوان مثال، یک خط، نقطه، یا پر کردن. هنگام مقیاس بندی یک برداری روی صفحه، کیفیت آن را از دست نمی دهد زیرا فرمول ریاضی رابطه بین دستورات مختلف را حفظ می کند. یک مثال خوب از ImageVector نمادهای مواد هستند، زیرا همه آنها را می توان با فرمول های ریاضی تعریف کرد.
شکل 2 : نمونه برداری (پسوندهای فایل xml. هستند یا با کد Kotlin تعریف شده اند)
ImageBitmap
در Compose، یک تصویر شطرنجی (اغلب به عنوان Bitmap از آن یاد میشود) را میتوان در یک نمونه ImageBitmap بارگذاری کرد، و یک BitmapPainter چیزی است که مسئول ترسیم بیت مپ روی صفحه است.
برای موارد استفاده ساده، می توان از painterResource() استفاده کرد که از ایجاد یک ImageBitmap مراقبت می کند و یک شی Painter را برمی گرداند (در این مورد - BitmapPainter ):
یک VectorPainter وظیفه ترسیم ImageVector روی صفحه را بر عهده دارد. ImageVector از زیر مجموعه ای از دستورات SVG پشتیبانی می کند. همه تصاویر را نمی توان به صورت وکتور نشان داد (برای مثال، عکس هایی که با دوربین خود می گیرید نمی توانند به وکتور تبدیل شوند).
می توانید یک ImageVector سفارشی ایجاد کنید یا با وارد کردن یک فایل XML قابل ترسیم برداری موجود (وارد شده به Android Studio با استفاده از ابزار import ) یا پیاده سازی کلاس و صدور دستورات مسیر به صورت دستی.
برای موارد استفاده ساده، همان روشی که painterResource() برای کلاس ImageBitmap کار میکند، برای ImageVectors نیز کار میکند و یک VectorPainter به عنوان نتیجه برمیگرداند. painterResource() بارگذاری VectorDrawables و BitmapDrawables را به ترتیب در VectorPainter و BitmapPainter انجام می دهد. برای بارگذاری VectorDrawable در یک تصویر، از:
محتوا و نمونه کدها در این صفحه مشمول پروانههای توصیفشده در پروانه محتوا هستند. جاوا و OpenJDK علامتهای تجاری یا علامتهای تجاری ثبتشده Oracle و/یا وابستههای آن هستند.
تاریخ آخرین بهروزرسانی 2025-08-28 بهوقت ساعت هماهنگ جهانی.
[[["درک آسان","easyToUnderstand","thumb-up"],["مشکلم را برطرف کرد","solvedMyProblem","thumb-up"],["غیره","otherUp","thumb-up"]],[["اطلاعاتی که نیاز دارم وجود ندارد","missingTheInformationINeed","thumb-down"],["بیشازحد پیچیده/ مراحل بسیار زیاد","tooComplicatedTooManySteps","thumb-down"],["قدیمی","outOfDate","thumb-down"],["مشکل ترجمه","translationIssue","thumb-down"],["مشکل کد / نمونهها","samplesCodeIssue","thumb-down"],["غیره","otherDown","thumb-down"]],["تاریخ آخرین بهروزرسانی 2025-08-28 بهوقت ساعت هماهنگ جهانی."],[],[],null,["The two most common kinds of image formats are raster and vector images.\n\nA raster graphic format contains pixels: tiny individual squares that contain a\ncolor (made up of red, green, blue, and alpha values). When placing a lot of\npixels together, a very detailed image can be formed, such as a photograph. A\nraster graphic has a fixed resolution (fixed number of pixels). This means that\nwhen you increase the size of the image, it loses detail, and pixelation can\noccur. Examples of raster graphic formats are JPEG, PNG, and WEBP.\n**Figure 1**: JPEG file example\n\nVector images, on the other hand, are scalable mathematical representations of a\nvisual element on screen. A vector is a set of commands describing how to draw\nthe image on screen- for instance, a line, point, or fill. When scaling a vector\non screen, it will not lose quality as the mathematical formula will maintain\nthe relationship between the different commands. A good example of ImageVector\nare the Material [Symbols](https://fonts.google.com/icons), as they can all be defined with\nmathematical formulas.\n**Figure 2**: Vector example (file extensions are .xml or defined in Kotlin code)\n\n`ImageBitmap`\n\nIn Compose, a raster image (often referred to as a `Bitmap`) can be loaded up\ninto an `ImageBitmap` instance, and a `BitmapPainter` is what is responsible for\ndrawing the bitmap to screen.\n\nFor simple use cases, the `painterResource()` can be used which takes care of\ncreating an `ImageBitmap` and returns a `Painter` object (in this case - a\n`BitmapPainter`):\n\n\n```kotlin\nImage(\n painter = painterResource(id = R.drawable.dog),\n contentDescription = stringResource(id = R.string.dog_content_description)\n)https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/images/VectorVsBitmapSnippets.kt#L49-L52\n```\n\n\u003cbr /\u003e\n\nIf you require further customization (for instance a [custom painter\nimplementation](/develop/ui/compose/graphics/images/custompainter)) and need access to the `ImageBitmap` itself, you can load it\nin the following way:\n\n\n```kotlin\nval imageBitmap = ImageBitmap.imageResource(R.drawable.dog)https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/images/VectorVsBitmapSnippets.kt#L56-L56\n```\n\n\u003cbr /\u003e\n\n`ImageVector`\n\nA `VectorPainter` is responsible for drawing an `ImageVector` to screen.\n`ImageVector` supports a subset of SVG commands. Not all images can be\nrepresented as vectors (for example, the photos you take with your camera cannot\nbe transformed into a vector).\n\nYou can create a custom `ImageVector` either by importing an existing vector\ndrawable XML file (imported into Android Studio using the [import tool](/studio/write/vector-asset-studio#running)) or\nimplementing the class and issuing path commands manually.\n\nFor simple use cases, the same way in which `painterResource()` works for the\n`ImageBitmap` class, it also works for `ImageVectors`, returning a\n`VectorPainter` as the result. `painterResource()` handles the loading of\n`VectorDrawables` and `BitmapDrawables` into `VectorPainter` and `BitmapPainter`\nrespectively. To load a `VectorDrawable` into an image, use:\n\n\n```kotlin\nImage(\n painter = painterResource(id = R.drawable.baseline_shopping_cart_24),\n contentDescription = stringResource(id = R.string.shopping_cart_content_desc)\n)https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/images/VectorVsBitmapSnippets.kt#L64-L67\n```\n\n\u003cbr /\u003e\n\nIf you'd require further customization and need to access to the `ImageVector`\nitself, you can load it in the following way:\n\n\n```kotlin\nval imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/images/VectorVsBitmapSnippets.kt#L71-L71\n```\n\n\u003cbr /\u003e\n\nRecommended for you\n\n- Note: link text is displayed when JavaScript is off\n- [Custom painter {:#custom-painter}](/develop/ui/compose/graphics/images/custompainter)\n- [Resources in Compose](/develop/ui/compose/resources)\n- [Loading images {:#loading-images}](/develop/ui/compose/graphics/images/loading)"]]