Sketch 是 Android 上一个强大且全面的图片加载器,支持 GIF,手势缩放以及分块显示超大图片。Sketch is a powerful and comprehensive image loader on Android, with support for GIF, gesture zooming, block display super large image
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,Powerful functions
: Supports three-level caching, automatically cancels requests, automaticallyRich functions
: Supports Animated image, SVG images, Base64 images, and video framesEasy to expand
: Supports expansion of various aspects such as caching, decoding, transformation,Extended functions
: Practical extensions such as pausing downloads when cellular data isModern
: Completely based on Kotlin and Kotlin coroutine designPublished to mavenCentral
${LAST_VERSION}
: (Not included ‘v’)
Import the required Compose and network modules:
// 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}")
// Provides the ability to load network images
implementation("io.github.panpf.sketch4:sketch-http:${LAST_VERSION}")
[!IMPORTANT]
To improve the performance of compose, please copy compose_compiler_config.conf under
thesketch-core
module file to your project and configure it according to
the Compose Stability Configuration documentation
Import the required View and network modules:
// 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}")
// Provides the ability to load network images
implementation("io.github.panpf.sketch4:sketch-http:${LAST_VERSION}")
// Use Android or Skia's built-in decoder to decode gif animations and play them
implementation("io.github.panpf.sketch4:sketch-animated-gif:${LAST_VERSION}")
// [Android only] Use the GifDrawable of the android-gif-drawable library to decode and play gif animations
implementation("io.github.panpf.sketch4:sketch-animated-gif-koral:${LAST_VERSION}")
// [Android only] Android or Skia's built-in decoder decodes heif animations and plays them
implementation("io.github.panpf.sketch4:sketch-animated-heif:${LAST_VERSION}")
// Use Android or Skia's built-in decoder to decode webp animations and play them
implementation("io.github.panpf.sketch4:sketch-animated-webp:${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, image type icons,
// pausing loading during list scrolling, and saving cellular traffic.
implementation("io.github.panpf.sketch4:sketch-extensions-compose:${LAST_VERSION}")
implementation("io.github.panpf.sketch4:sketch-extensions-view:${LAST_VERSION}")
// [Android only] Support icon loading of apk files via file path
implementation("io.github.panpf.sketch4:sketch-extensions-apkicon:${LAST_VERSION}")
// [Android only] Support loading icons of installed apps by package name and version code
implementation("io.github.panpf.sketch4:sketch-extensions-appicon:${LAST_VERSION}")
// [JVM only] Support using HttpURLConnection to access network images
implementation("io.github.panpf.sketch4:sketch-http-hurl:${LAST_VERSION}")
// [JVM only] Support using OkHttp to access network images
implementation("io.github.panpf.sketch4:sketch-http-okhttp:${LAST_VERSION}")
// Supports using ktor version 2.x to access network images
implementation("io.github.panpf.sketch4:sketch-http-ktor2:${LAST_VERSION}")
// Supports using ktor version 3.x to access network images
implementation("io.github.panpf.sketch4:sketch-http-ktor3:${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.- The
sketch-http
module depends onsketch-http-hurl
on jvm platforms andsketch-http-ktor3
on non-jvm platforms.
Sketch supports automatic discovery and registration of Fetcher and Decoder components, which are
implemented through ServiceLoader on the JVM platform and through the @EagerInitialization
annotation on non-JVM platforms.
All built-in modules support automatic registration. If you want to disable automatic registration,
please refer to the documentation for manual
registration: 《Register component》
# -------------------------- Sketch Privider ---------------------------- #
-keep class * implements com.github.panpf.sketch.util.DecoderProvider { *; }
-keep class * implements com.github.panpf.sketch.util.FetcherProvider { *; }
// val imageUri = "/Users/my/Downloads/image.jpg"
// val imageUri = file:///compose_resource/composeResources/com.github.panpf.sketch.sample.resources/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
// val imageUri = "/sdcard/download/image.jpg"
// val imageUri = "file:///android_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)
Basic functions:
Featured functions:
Please review the CHANGELOG.md file
Prepare the environment:
Kotlin Multiplatform
and Compose Multiplatform IDE Support
pluginsRun the sample app:
.run
directory. After.run/iosSample.run.template.xml
file and remove the .template
suffix..ignore
file has been configured to ignore iosSample.run.xml
Edit Configurations
in the run configuration drop-down box at the top,iosSample
and then configure Execute target
io.github.panpf.sketch4
, so versions 2.* and 3.* will notThe 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.