ComposeImageBlurhash is a Jetpack Compose component with the necessary implementation to display a blurred image

Overview

compose-image-blurhash

ComposeImageBlurhash is a Jetpack Compose component with the necessary implementation to display a blurred image while the real image is loaded from the internet. Use blurhash and coil to ensure good performance.

Coil

The Coil library is used to load the images asynchronously

You can find more information here github!

More from Blurhash

BlurHash is a compact representation of a placeholder for an image.

You can also see nice examples and try it out yourself at blurha.sh!

All blurhash code is here github!

Users

Who uses ComposeImageBlurhash? :

Inmersoft - At Immersoft we use ComposeImageBlurhash for a better user experience when loading and displaying images to the end user.

#How to use

  • In the AndroidManifest add the permissions to use the Internet

    ">
      
        
    
  • In the build.gradle add the necessary dependencies

      implementation 'com.github.orlando-dev-code:compose-image-blurhash:1.0.0-alpha02'
    
  • Add component as required

      class MainActivity : ComponentActivity() {
      @ExperimentalCoilApi
      override fun onCreate(savedInstanceState: Bundle?) {
          super.onCreate(savedInstanceState)
          setContent {
              TestImageBlurLibraryTheme {
                  // A surface container using the 'background' color from the theme
                    Surface(color = MaterialTheme.colors.background) {
                       TestImageBlurhash(resources)
                    }
                }
            }
        }
     }
    
      @ExperimentalCoilApi
      @Composable
      fun TestImageBlurhash(resources: Resources) {
            val imageUrl = "https://blurha.sh/assets/images/img1.jpg"
            val blurhash = "LEHV6nWB2yk8pyo0adR*.7kCMdnj"
            Card(
                modifier = Modifier
                .height(300.dp)
                .fillMaxWidth()
                .padding(8.dp),
                shape = MaterialTheme.shapes.small
            ) {
              ImageBlur(
                    modifier = Modifier.fillMaxSize(),
                    blurhash = blurhash,
                    imageUrl = imageUrl,
                    resources = resources,
                    contentDescription = "Image content description"
                )
            }
      }
    
You might also like...
An Android transformation library providing a variety of image transformations for Picasso
An Android transformation library providing a variety of image transformations for Picasso

Picasso Transformations An Android transformation library providing a variety of image transformations for Picasso. Please feel free to use this. Are

Library to handle asynchronous image loading on Android.

WebImageLoader WebImageLoader is a library designed to take to hassle out of handling images on the web. It has the following features: Images are dow

Luban(鲁班)—Image compression with efficiency very close to WeChat Moments/可能是最接近微信朋友圈的图片压缩算法

Luban 📖 English Documentation Luban(鲁班) —— Android图片压缩工具,仿微信朋友圈压缩策略。 Luban-turbo —— 鲁班项目的turbo版本,查看trubo分支。 写在前面 家境贫寒,工作繁忙。只能不定期更新,还望网友们见谅! 项目描述 目前做A

Image Picker for Android 🤖
Image Picker for Android 🤖

Image Picker for Android 🤖

Easy to use, lightweight custom image view with rounded corners.
Easy to use, lightweight custom image view with rounded corners.

RoundedImageView Easy to use, lightweight custom image view with rounded corners. Explore the docs » View Demo · Report Bug · Request Feature About Th

🦄 Android Pokedex-AR using ARCore, Sceneform, Hilt, Coroutines, Flow, Jetpack based on MVVM architecture.
🦄 Android Pokedex-AR using ARCore, Sceneform, Hilt, Coroutines, Flow, Jetpack based on MVVM architecture.

Pokedex-AR Pokedex-AR is a small demo application based on AR, modern Android application tech-stacks, and MVVM architecture. This project focuses on

ComposeImageBlurhash is a Jetpack Compose component with the necessary implementation to display a blurred image
ComposeImageBlurhash is a Jetpack Compose component with the necessary implementation to display a blurred image

compose-image-blurhash ComposeImageBlurhash is a Jetpack Compose component with the necessary implementation to display a blurred image while the real

A library for Android provides blurred drop shadows to ImageView similar to iOS image backdrop shadows
A library for Android provides blurred drop shadows to ImageView similar to iOS image backdrop shadows

A library for Android provides blurred drop shadows to ImageView similar to iOS image backdrop shadows.Provides fast canvas draw as no renderscript needed .The similar shadow blurred effects can also be seen in iOS Music App.

This is a sample Android Studio project that shows the necessary code to create a note list widget, And it's an implementation of a lesson on the Pluralsight platform, but with some code improvements
This is a sample Android Studio project that shows the necessary code to create a note list widget, And it's an implementation of a lesson on the Pluralsight platform, but with some code improvements

NoteKeeper-Custom-Widgets This is a sample Android Studio project that shows the necessary code to create a note list widget, And it's an implementati

Jenci - a project that includes necessary actions for Jenkins developed with Android Jetpack Compose.
Jenci - a project that includes necessary actions for Jenkins developed with Android Jetpack Compose.

Jenci is a project that includes necessary actions for Jenkins developed with Android Jetpack Compose. Jenci, Jenkis API services include some actions

[] Easily have blurred and transparent background effect on your Android views.
[] Easily have blurred and transparent background effect on your Android views.

##[DEPRECATED] BlurBehind Easily have blurred and transparent background effect on your Android views. Before API level 14 there was a Window flag cal

Android Blurred ImageSwitcher Library
Android Blurred ImageSwitcher Library

Android Blurred ImageSwitcher Library

:bouquet: An easy way to persist and run code block only as many times as necessary on Android.
:bouquet: An easy way to persist and run code block only as many times as necessary on Android.

Only 💐 An easy way to persist and run code block only as many times as necessary on Android. Download Gradle Add below codes to your root build.gradl

:bouquet: An easy way to persist and run code block only as many times as necessary on Android.
:bouquet: An easy way to persist and run code block only as many times as necessary on Android.

Only 💐 An easy way to persist and run code block only as many times as necessary on Android. Download Gradle Add below codes to your root build.gradl

Basic-Android-Project - A Basic Android Project with proper structure and all necessary dependencies

Basic-Android-Project A Basic Android Project with proper structure and all nece

Examples of ParallaxView and ParallaxScrollEfect are in the repo. You can find the necessary titles and outputs in the continuation of the Readme file. 🪞
Examples of ParallaxView and ParallaxScrollEfect are in the repo. You can find the necessary titles and outputs in the continuation of the Readme file. 🪞

Parallax Examples : Examples of ParallaxView and ParallaxScrollEfect are in the repo. You can find the necessary titles and outputs in the continuatio

Awesome Image Picker library will pick images/gifs with beautiful interface. Supports image or gif, Single and Multiple Image selection.

Awesome Image Picker Awesome Image Picker library will pick images/gifs with beautiful interface. Supports image or gif, Single and Multiple Image sel

Big image viewer supporting pan and zoom, with very little memory usage and full featured image loading choices. Powered by Subsampling Scale Image View, Fresco, Glide, and Picasso. Even with gif and webp support! 🍻
Big image viewer supporting pan and zoom, with very little memory usage and full featured image loading choices. Powered by Subsampling Scale Image View, Fresco, Glide, and Picasso. Even with gif and webp support! 🍻

BigImageViewer Big image viewer supporting pan and zoom, with very little memory usage and full featured image loading choices. Powered by Subsampling

🍂 Jetpack Compose image loading library which can fetch and display network images using Glide, Coil, and Fresco.
🍂 Jetpack Compose image loading library which can fetch and display network images using Glide, Coil, and Fresco.

Landscapist 🍂 Jetpack Compose image loading library which can fetch and display network images using Glide, Coil, Fresco Usecase You can see the use

Comments
  • Can I only display the blurred image always displayed?

    Can I only display the blurred image always displayed?

    I'm asking if I can use this library to keep the blurred image displayed because I need to achieve this scenario:

    I need to display a blurred image in the background and in the front of it the real image.

    opened by ahmed-shehataa 2
Releases(2.1.0)
Owner
Orlando Novas Rodriguez
Android Developer && Frontend | Kotlin | Java | ReactJS | HTML | CSS | JavaScript and coffee lover. Android Developer at @inmersoft-dev
Orlando Novas Rodriguez
ZoomableComposeImage - A zoomable image for jetpack compose

ZoomableComposeImage - A zoomable image for jetpack compose

RERERE 10 Dec 11, 2022
load-the-image Apply to compose-jb(desktop), Used to load network and local pictures.

load-the-image load-the-image Apply to compose-jb(desktop), Used to load network and local pictures. ?? Under construction It may change incompatibly

lt_taozi 13 Dec 29, 2022
Compose Image library for Kotlin Multiplatform.

Compose ImageLoader Compose Image library for Kotlin Multiplatform. Setup Add the dependency in your common module's commonMain sourceSet kotlin {

Seiko 45 Dec 29, 2022
a solution that can help developers display pictures in any shape.

android-anyshape With the solution, pictures can be displayed in any shape on Android platform. Effect The left is the UI using normal ImageViews, and

Lankton 190 Dec 22, 2022
An image loading and caching library for Android focused on smooth scrolling

Glide | View Glide's documentation | 简体中文文档 | Report an issue with Glide Glide is a fast and efficient open source media management and image loading

Bump Technologies 33.2k Jan 7, 2023
Android Asynchronous Networking and Image Loading

Android Asynchronous Networking and Image Loading Download Maven Git Features Kotlin coroutine/suspend support Asynchronously download: Images into Im

Koushik Dutta 6.3k Dec 27, 2022
A powerful image downloading and caching library for Android

Picasso A powerful image downloading and caching library for Android For more information please see the website Download Download the latest AAR from

Square 18.4k Jan 6, 2023
Image loading for Android backed by Kotlin Coroutines.

An image loading library for Android backed by Kotlin Coroutines. Coil is: Fast: Coil performs a number of optimizations including memory and disk cac

Coil 8.8k Jan 8, 2023
An Android transformation library providing a variety of image transformations for Glide.

Glide Transformations An Android transformation library providing a variety of image transformations for Glide. Please feel free to use this. Are you

Daichi Furiya 9.7k Dec 30, 2022
An android image compression library.

Compressor Compressor is a lightweight and powerful android image compression library. Compressor will allow you to compress large photos into smaller

Zetra 6.7k Jan 9, 2023