Sketch is an image loading library designed for Compose Multiplatform and Android View. It is powerful and rich in functions. In addition to basic functions, it also supports GIF, SVG, video thumbnails, Exif Orientation, etc.
Translations: 简体中文
Sketch is an image loading library specially designed for Compose Multiplatform and Android View. It has the following features:
Multiple sources
: Supports loading images from multiple sources such as http, file,
compose.resource, android asset/content/resource, etc.Powerful functions
: Supports three-level caching, automatically cancels requests, automatically
adjusts image size, automatically rotates images according to Exif Orientation, etc.Rich functions
: Supports Animated image, SVG images, Base64 images, and video framesEasy to expand
: Supports expansion of various aspects such as caching, decoding, transformation,
transition, placeholder, etc.Special functions
: Practical extensions such as pausing downloads when cellular data is
provided, pausing loading during list scrolling, image type badges, download progress indicators,
etc.Modern
: Completely based on Kotlin and Kotlin coroutine designPublished to mavenCentral
${LAST_VERSION}
: (Not included 'v')
Compose Multiplatform:
// Provides the core functions of Sketch as well as singletons and extension
// functions that rely on singleton implementations
implementation("io.github.panpf.sketch4:sketch-compose:${LAST_VERSION}")
[!IMPORTANT] To improve the performance of compose, please copy compose_compiler_config.conf under the
sketch-core
module file to your project and configure it according to the Compose Stability Configuration documentation
Android View:
// Provides the core functions of Sketch as well as singletons and extension
// functions that rely on singleton implementations
implementation("io.github.panpf.sketch4:sketch-view:${LAST_VERSION}")
There are also some optional modules:
// Use Android or Skia's built-in decoder to decode gif, webp, heif and other animated images and play them
implementation("io.github.panpf.sketch4:sketch-animated:${LAST_VERSION}")
// [Android only] Use GifDrawable of the android-gif-drawable library to decode gif and play it
implementation("io.github.panpf.sketch4:sketch-animated-koralgif:${LAST_VERSION}")
// Support accessing compose resources through uri or placeholder, fallback, error, etc.
implementation("io.github.panpf.sketch4:sketch-compose-resources:${LAST_VERSION}")
implementation("io.github.panpf.sketch4:sketch-extensions-compose-resources:${LAST_VERSION}")
// Provides practical functions such as download progress, pausing loading during list scrolling,
// saving cellular data, image type badge, loading apk icons and installed app icons, etc.
implementation("io.github.panpf.sketch4:sketch-extensions-compose:${LAST_VERSION}")
implementation("io.github.panpf.sketch4:sketch-extensions-view:${LAST_VERSION}")
// [JVM only] Supports using OkHttp to download images
implementation("io.github.panpf.sketch4:sketch-http-okhttp:${LAST_VERSION}")
// [JVM only] Supports using ktor to download images
implementation("io.github.panpf.sketch4:sketch-http-ktor:${LAST_VERSION}")
// Support SVG images
implementation("io.github.panpf.sketch4:sketch-svg:${LAST_VERSION}")
// [Android only] Use Android's built-in MediaMetadataRetriever class to decode video frames
implementation("io.github.panpf.sketch4:sketch-video:${LAST_VERSION}")
// [Android only] Decoding video frames using wseemann's FFmpegMediaMetadataRetriever library
implementation("io.github.panpf.sketch4:sketch-video-ffmpeg:${LAST_VERSION}")
[!TIP]
sketch-compose
,sketch-view
Modules all depend on the singleton provided by thesketch-singleton
module. If you don’t need the singleton, you can directly rely on their*-core
version.- On Android
sketch-compose
andsketch-view
can be used together
Sketch itself does not need to configure any obfuscation rules, but you may need to configure it for the indirectly dependent Kotlin Coroutines, OkHttp, Okio Add obfuscation configuration
Compose Multiplatform:
// val imageUri = "/Users/my/Downloads/image.jpg"
// val imageUri = "compose.resource://files/sample.png"
val imageUri = "https://www.sample.com/image.jpg"
AsyncImage(
uri = imageUri,
contentDescription = "photo"
)
AsyncImage(
uri = imageUri,
state = rememberAsyncImageState(ComposableImageOptions {
placeholder(Res.drawable.placeholder)
error(Res.drawable.error)
crossfade()
// There is a lot more...
}),
contentDescription = "photo"
)
AsyncImage(
rqeuest = ComposableImageRequest(imageUri) {
placeholder(Res.drawable.placeholder)
error(Res.drawable.error)
crossfade()
// There is a lot more...
},
contentDescription = "photo"
)
Image(
painter = rememberAsyncImagePainter(
request = ComposableImageRequest(imageUri) {
placeholder(Res.drawable.placeholder)
error(Res.drawable.error)
crossfade()
// There is a lot more...
}
),
contentDescription = "photo"
)
[!TIP]
placeholder(Res.drawable.placeholder)
needs to import thesketch-compose-resources
module
Android View:
// val imageUri = "/sdcard/download/image.jpg"
// val imageUri = "asset://image.jpg"
// val imageUri = "content://media/external/images/media/88484"
val imageUri = "https://www.sample.com/image.jpg"
imageView.loadImage(imageUri)
imageView.loadImage(imageUri) {
placeholder(R.drawable.placeholder)
error(R.drawable.error)
crossfade()
// There is a lot more...
}
val request = ImageRequest(context, imageUri) {
placeholder(R.drawable.placeholder)
error(R.drawable.error)
crossfade()
target(imageView)
// There is a lot more...
}
context.sketch.enqueue(request)
For more information about Uri, image types, platform differences, Sketch customization, ImageRequest, etc., please view the 《Getting Started》 document
Basic functions:
Featured functions:
Please review the CHANGELOG.md file
io.github.panpf.sketch4
, so versions 2.* and 3.* will not
prompt for upgradePrepare the environment:
Kotlin Multiplatform
and Compose Multiplatform IDE Support
pluginsExecute code:
.run
directory. After
synchronization is completed, directly select the running configuration of the corresponding
platform in the running configuration drop-down box at the top of Android Studio and click Run.The following are my other open source projects. If you are interested, you can learn about them:
Apache 2.0. See the LICENSE file for details.