با مجموعهها، منظم بمانید
ذخیره و طبقهبندی محتوا براساس اولویتهای شما.
برای نمایش تصاویر در برنامه خود برای محتوا و برای پاسخ به اقدامات کاربر، تصاویر را از دیسک یا از یک منبع خارجی در اینترنت بارگیری کنید. شما می توانید تصاویر را به روش های زیر بارگذاری کنید:
از دیسک
از یک شبکه با استفاده از کویل
از یک شبکه با استفاده از Glide
سازگاری نسخه
این پیاده سازی مستلزم آن است که minSDK پروژه شما روی سطح API 21 یا بالاتر تنظیم شود.
یک تصویر از دیسک بارگیری کنید
می توانید تصاویر ذخیره شده محلی را از دیسک بارگیری کنید تا آنها را برای محتوا در برنامه خود نمایش دهید و به اقدامات کاربر پاسخ دهید.
وابستگی ها
تصویر را بارگذاری کنید
از کد زیر برای بارگیری یک تصویر ذخیره شده محلی از دیسک برای نمایش در برنامه خود استفاده کنید:
یک شیء Compose Image تعریف شده با ویژگی painter که روی یک painterResource() تنظیم شده است که یک تصویر را از منابع برنامه بارگیری می کند.
contentDescription که TalkBack می‌تواند آن را بخواند تا برنامه شما را در دسترس‌تر کند.
یک stringResource() برای بارگیری توضیحات محتوای ترجمه شده از فایل strings.xml .
یک تصویر را از طریق شبکه بارگیری کنید
می توانید تصاویر ذخیره شده خارجی در اینترنت را با استفاده از Coil یا Glide بارگیری کنید. برای انتخاب کتابخانه ای که برای پروژه خود استفاده کنید، عواملی مانند الزامات پروژه و محدودیت های عملکرد را در نظر بگیرید.
یک تصویر را با استفاده از کویل بارگذاری کنید
می‌توانید با استفاده از Coil ، یک کتابخانه شخص ثالث، تصاویر را از اینترنت بارگیری کنید. کویل توسط کوروتین های Kotlin پشتیبانی می شود و مسئولیت بارگذاری تصویر را به دور از موضوع اصلی بر عهده می گیرد و پس از بارگذاری آن را نمایش می دهد. برای بارگیری تصاویر از اینترنت با استفاده از کویل، این دستورالعمل را دنبال کنید.
وابستگی ها
تصویر را بارگذاری کنید
برای بارگذاری تصاویر با استفاده از کویل از کد زیر استفاده کنید:
AsyncImage(model="https://example.com/image.jpg",contentDescription="Translated description of what the image contains")
می توانید تصاویر ذخیره شده خارجی در اینترنت را با استفاده از Glide بارگیری کنید تا در فید برنامه خود نمایش داده شوند. Glide یک کتابخانه بارگذاری تصویر سریع و کارآمد برای اندروید است که بر روی پیمایش روان تمرکز دارد و مسئولیت بارگیری تصویر را به دور از موضوع اصلی بر عهده می گیرد و پس از بارگیری آن را نمایش می دهد.
وابستگی ها
تصویر را بارگذاری کنید
برای بارگذاری تصاویر با استفاده از Glide از کد زیر استفاده کنید:
GlideImage(model="https://example.com/image.jpg",contentDescription="Translated description of what the image contains")
محتوا و نمونه کدها در این صفحه مشمول پروانههای توصیفشده در پروانه محتوا هستند. جاوا و OpenJDK علامتهای تجاری یا علامتهای تجاری ثبتشده Oracle و/یا وابستههای آن هستند.
تاریخ آخرین بهروزرسانی 2025-02-22 بهوقت ساعت هماهنگ جهانی.
[[["درک آسان","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-02-22 بهوقت ساعت هماهنگ جهانی."],[],[],null,["# Load and display images\n\n\u003cbr /\u003e\n\nTo display images in your app for content and for responses to user actions,\nload the images from the disk or from an external source on the internet. You\ncan load images the following ways:\n\n- From the disk\n- From a network using Coil\n- From a network using Glide\n\nVersion compatibility\n---------------------\n\nThis implementation requires that your project minSDK be set to API level 21 or\nhigher.\n\nLoad an image from the disk\n---------------------------\n\nYou can load locally stored images from the disk to display them in your app for\ncontent and to respond to user actions.\n\n### Dependencies\n\n### Kotlin\n\n\u003cbr /\u003e\n\n```kotlin\n implementation(platform(\"androidx.compose:compose-bom:2025.08.00\"))\n \n```\n\n\u003cbr /\u003e\n\n### Groovy\n\n\u003cbr /\u003e\n\n```groovy\n implementation platform('androidx.compose:compose-bom:2025.08.00')\n \n```\n\n\u003cbr /\u003e\n\n### Load the image\n\nUse the following code to load a locally stored image from the disk to display\nin your app:\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/LoadingImagesSnippets.kt#L49-L52\n```\n\n\u003cbr /\u003e\n\n#### Key points about the code\n\n- A defined Compose [`Image`](/reference/kotlin/androidx/compose/foundation/package-summary#Image) object with a `painter` attribute set to a [`painterResource()`](/reference/kotlin/androidx/compose/ui/res/package-summary#painterresource) that loads an image from app resources.\n- A `contentDescription` that `TalkBack` can read to make your app more accessible.\n- A `stringResource()` to load translated content description from the `strings.xml` file.\n\nLoad an image over the network\n------------------------------\n\nYou can load images stored externally on the internet using either Coil or\nGlide. To choose which library to use for your project, consider factors such as\nproject requirements and performance constraints.\n\n### Load an image using Coil\n\nYou can load images from the internet using [Coil](https://coil-kt.github.io/coil/), a third-party\nlibrary. Coil is backed by Kotlin coroutines, and takes responsibility for\nloading the image away from the Main thread, and displays it once loaded. Follow\nthis guidance to load images from the internet using Coil.\n\n### Dependencies\n\n### Kotlin\n\n\u003cbr /\u003e\n\n```kotlin\n implementation(platform(\"androidx.compose:compose-bom:2025.08.00\"))\n implementation(\"io.coil-kt:coil-compose:2.6.0\")\n \n```\n\n\u003cbr /\u003e\n\n### Groovy\n\n\u003cbr /\u003e\n\n```groovy\n implementation platform('androidx.compose:compose-bom:2025.08.00')\n implementation 'io.coil-kt:coil-compose:2.6.0'\n \n```\n\n\u003cbr /\u003e\n\n#### Load the image\n\nUse the following code to load images using Coil:\n\n\n```kotlin\nAsyncImage(\n model = \"https://example.com/image.jpg\",\n contentDescription = \"Translated description of what the image contains\"\n)https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/images/LoadingImagesSnippets.kt#L60-L63\n```\n\n\u003cbr /\u003e\n\n### Load an image using Glide\n\nYou can load images stored externally on the internet using\n[Glide](https://github.com/bumptech/glide) to display them in your app's feed. Glide is a fast and\nefficient image loading library for Android focused on smooth scrolling, and\ntakes responsibility for loading the image away from the Main thread, and\ndisplays it once loaded.\n\n#### Dependencies\n\n### Kotlin\n\n\u003cbr /\u003e\n\n```kotlin\n implementation(platform(\"androidx.compose:compose-bom:2025.08.00\"))\n implementation(\"com.github.bumptech.glide:compose:1.0.0-beta01\")\n \n```\n\n\u003cbr /\u003e\n\n### Groovy\n\n\u003cbr /\u003e\n\n```groovy\n implementation platform('androidx.compose:compose-bom:2025.08.00')\n implementation 'com.github.bumptech.glide:compose:1.0.0-beta01'\n \n```\n\n\u003cbr /\u003e\n\n#### Load the image\n\nUse the following code to load images using Glide:\n\n\n```kotlin\nGlideImage(\n model = \"https://example.com/image.jpg\",\n contentDescription = \"Translated description of what the image contains\"\n)https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/images/LoadingImagesSnippets.kt#L72-L75\n```\n\n\u003cbr /\u003e\n\nResults\n-------\n\n:dog: **Figure 1.** An image loaded and displayed.\n\nCollections that contain this guide\n-----------------------------------\n\nThis guide is part of these curated Quick Guide collections that cover\nbroader Android development goals: \n\n### Display images\n\nDiscover techniques for using bright, engaging visuals to give your Android app a beautiful look and feel. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/display-images) \n\nHave questions or feedback\n--------------------------\n\nGo to our frequently asked questions page and learn about quick guides or reach out and let us know your thoughts. \n[Go to FAQ](/quick-guides/faq) [Leave feedback](https://issuetracker.google.com/issues/new?component=1573691&template=1993320)"]]
