جارٍ تحميل الصور
تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
تحميل صورة من القرص
استخدِم العنصر القابل للإنشاء Image
لعرض رسم على الشاشة. لتحميل صورة (مثل PNG أو JPEG أو WEBP) أو مورد متّجه من القرص، استخدِم واجهة برمجة التطبيقات painterResource
مع مرجع الصورة. لست بحاجة إلى معرفة نوع مادة العرض، ما عليك سوى استخدام painterResource
في المعدّلات Image
أو paint
.
DrawScope
:
Image(
painter = painterResource(id = R.drawable.dog),
contentDescription = stringResource(id = R.string.dog_content_description)
)
لضمان سهولة استخدام تطبيقك، يجب توفير contentDescription
للعناصر المرئية على الشاشة. تقرأ ميزة TalkBack وصف المحتوى بصوت عالٍ، لذا عليك التأكّد من أنّ النص مفهوم عند قراءته بصوت عالٍ وترجمته. في المثال أعلاه، يتم استخدام stringResource()
لتحميل وصف المحتوى المترجَم من الملف strings.xml
. إذا كان العنصر المرئي على الشاشة مخصّصًا للزخرفة فقط، اضبط قيمة contentDescription
على null
لكي يتجاهله قارئ الشاشة.
إذا كنت بحاجة إلى وظيفة ImageBitmap
محددة على مستوى أدنى، يمكنك استخدام
ImageBitmap.imageResource()
لتحميل صورة نقطية. لمزيد من المعلومات حول ImageBitmaps، يُرجى قراءة قسم ImageBitmap مقابل ImageVector.
توافق العناصر القابلة للرسم
تتيح السمة painterResource
حاليًا أنواع العناصر القابلة للرسم التالية:
تحميل صورة من الإنترنت
لتحميل صورة من الإنترنت، تتوفّر العديد من المكتبات التابعة لجهات خارجية
لمساعدتك في إتمام هذه العملية. تتولّى مكتبات تحميل الصور الكثير من العمل الشاق نيابةً عنك، فهي تتعامل مع التخزين المؤقت (حتى لا يتم تنزيل الصورة عدة مرات) ومنطق الشبكة لتنزيل الصورة وعرضها على الشاشة.
على سبيل المثال، لتحميل صورة باستخدام Coil
من Instacart، أضِف المكتبة إلى ملف Gradle، واستخدِم AsyncImage
لتحميل صورة من عنوان URL:
AsyncImage(
model = "https://example.com/image.jpg",
contentDescription = "Translated description of what the image contains"
)
ملف
مكتبة لتحميل الصور تستند إلى Kotlin Coroutines (Instacart)
Glide
مكتبة سريعة وفعّالة لتحميل الصور على Android تركّز على التمرير السلس (Google)
مراجع إضافية
أفلام مُقترَحة لك
يخضع كل من المحتوى وعيّنات التعليمات البرمجية في هذه الصفحة للتراخيص الموضحّة في ترخيص استخدام المحتوى. إنّ Java وOpenJDK هما علامتان تجاريتان مسجَّلتان لشركة Oracle و/أو الشركات التابعة لها.
تاريخ التعديل الأخير: 2025-08-25 (حسب التوقيت العالمي المتفَّق عليه)
[[["يسهُل فهم المحتوى.","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-25 (حسب التوقيت العالمي المتفَّق عليه)"],[],[],null,["Load an image from the disk\n\nUse the [`Image`](/reference/kotlin/androidx/compose/foundation/package-summary#Image) composable to display a graphic on screen. To load an image\n(for example: PNG, JPEG, WEBP) or vector resource from the disk, use the\n[`painterResource`](/develop/ui/compose/quick-guides/content/load-images?hl=en) API with your image reference. You don't need to know the type\nof the asset, just use `painterResource` in `Image` or `paint` modifiers.\n\n`DrawScope`:\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/5673ffc60b614daf028ee936227128eb8c4f9781/compose/snippets/src/main/java/com/example/compose/snippets/images/LoadingImagesSnippets.kt#L49-L52\n```\n\n\u003cbr /\u003e\n\nTo ensure that your app is [accessible](/develop/ui/compose/accessibility), supply a `contentDescription` for\nvisual elements on screen. TalkBack reads out the content description, so you\nmust ensure that the text is meaningful if read out loud and translated. In the\nabove example, a `stringResource()` is used to load up the translated content\ndescription from the `strings.xml` file. If your visual element on screen is\npurely for visual decoration, set your `contentDescription` to `null` for the\nscreen reader to ignore it.\n\nIf you need lower-level `ImageBitmap` specific functionality, you can use\n`ImageBitmap.imageResource()` to load up a Bitmap. For more information on\nImageBitmaps, read the [ImageBitmap versus ImageVector](/develop/ui/compose/graphics/images/compare) section.\n\nDrawable support\n\n`painterResource` currently supports the following drawable types:\n\n- [`AnimatedVectorDrawable`](/reference/android/graphics/drawable/AnimatedVectorDrawable)\n- [`BitmapDrawable`](/reference/android/graphics/drawable/BitmapDrawable) (PNG, JPG, WEBP)\n- [`ColorDrawable`](/reference/android/graphics/drawable/ColorDrawable)\n- [`VectorDrawable`](/reference/android/graphics/drawable/VectorDrawable)\n\nLoad an image from the internet\n\nTo load an image from the internet, there are several third-party libraries\navailable to help you handle the process. Image loading libraries do a lot of\nthe heavy lifting for you; they handle both caching (so you don't download the\nimage multiple times) and networking logic to download the image and display it\non screen.\n\nFor example, to load an image with [Coil](https://github.com/coil-kt/coil#jetpack-compose)\nfrom Instacart, add the library to your gradle file, and use an `AsyncImage` to load an image from a URL:\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/5673ffc60b614daf028ee936227128eb8c4f9781/compose/snippets/src/main/java/com/example/compose/snippets/images/LoadingImagesSnippets.kt#L60-L63\n```\n\n\u003cbr /\u003e\n\n[Coil](https://github.com/coil-kt/coil#jetpack-compose)\n\nAn image loading library backed by Kotlin Coroutines (Instacart). \n[](https://search.maven.org/artifact/io.coil-kt/coil-compose \"Maven version of the library\") \n[Glide](https://bumptech.github.io/glide/int/compose.html)\n\nA fast and efficient image loading library for Android focused on smooth scrolling (Google). \n[](https://search.maven.org/artifact/com.github.bumptech.glide/compose \"Maven version of the library\")\n\nAdditional resources\n\n- [Load and display images](/develop/ui/compose/quick-guides/content/load-images?hl=en)\n\nRecommended for you\n\n- Note: link text is displayed when JavaScript is off\n- [Resources in Compose](/develop/ui/compose/resources)\n- [Accessibility in Compose](/develop/ui/compose/accessibility)\n- [Graphics in Compose](/develop/ui/compose/graphics/draw/overview)"]]