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 :
AnimatedVectorDrawable
BitmapDrawable
(PNG, JPG, WEBP)ColorDrawable
VectorDrawable
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