Charger une image à partir du disque
Utilisez le composable Image pour afficher une image à l'écran. Pour charger une image (par exemple, PNG, JPEG, WEBP) ou une ressource vectorielle à partir du disque, utilisez l'API painterResource avec la référence de votre image. Vous n'avez pas besoin de connaître le type de l'élément, il vous suffit d'utiliser painterResource dans les modificateurs Image ou paint.
DrawScope :
Image(
painter = painterResource(id = R.drawable.dog),
contentDescription = stringResource(id = R.string.dog_content_description)
)
Afin de vous assurer que votre application est accessible, utilisez une contentDescription pour les éléments visuels à l'écran. TalkBack lit la description du contenu, vous devez donc vous assurer que le texte est compréhensible lorsqu'il est lu à haute voix. Dans l'exemple ci-dessus, une stringResource() est utilisé pour charger la traduction de la description du contenu à partir du fichier strings.xml. Si votre élément visuel à l'écran ne remplit qu'une fonction cosmétique, définissez contentDescription sur null pour que le lecteur d'écran l'ignore.
Si vous avez besoin de fonctionnalités ImageBitmap spécifiques de niveau inférieur, vous pouvez utiliser ImageBitmap.imageResource() pour charger un bitmap. Pour en savoir plus sur ImageBitmaps, consultez la section ImageBitmap et ImageVector.
Compatibilité avec les drawables
painterResource est actuellement compatible avec les types de drawables suivants :
AnimatedVectorDrawableBitmapDrawable(PNG, JPG, WEBP)ColorDrawableVectorDrawable
Charger une image depuis Internet
Pour charger une image depuis Internet, plusieurs bibliothèques tierces peuvent vous aider à gérer le processus. Les bibliothèques de chargement d'images font le plus gros du travail pour vous. Elles gèrent à la fois la mise en cache (afin de ne pas télécharger l'image plusieurs fois) et la logique réseau pour télécharger l'image et l'afficher à l'écran.
Par exemple, pour charger une image avec Coil à partir d'Instacart, ajoutez la bibliothèque à votre fichier Gradle, puis utilisez une AsyncImage pour charger une image à partir d'une URL:
AsyncImage(
model = "https://example.com/image.jpg",
contentDescription = "Translated description of what the image contains"
)
Coil
Bibliothèque de chargement d'images reposant sur des coroutines Kotlin (Instacart).
Glide
Bibliothèque de chargement d'images rapide et efficace pour Android axée sur le défilement fluide (Google).
Recommandations personnalisées
- Remarque : Le texte du lien s'affiche lorsque JavaScript est désactivé
- Ressources disponibles dans Compose
- Accessibilité dans Compose
- Éléments graphiques dans Compose