From f9b065f3161b2eef7037143e13ff7d43c90728d4 Mon Sep 17 00:00:00 2001 From: Mihai-Cristian Condrea Date: Mon, 25 Nov 2024 07:22:15 +0200 Subject: [PATCH] fix: Eliminate image loading flicker Fixed an issue where images would flicker during loading, providing a smoother visual experience. --- app/build.gradle.kts | 2 +- .../ui/components/lessons/LessonItem.kt | 28 +++---------------- 2 files changed, 5 insertions(+), 25 deletions(-) diff --git a/app/build.gradle.kts b/app/build.gradle.kts index c414675..bbe01f8 100644 --- a/app/build.gradle.kts +++ b/app/build.gradle.kts @@ -17,7 +17,7 @@ android { applicationId = "com.d4rk.androidtutorials" minSdk = 23 targetSdk = 35 - versionCode = 89 + versionCode = 90 versionName = "1.0.0" testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner" resourceConfigurations += listOf( diff --git a/app/src/main/kotlin/com/d4rk/androidtutorials/ui/components/lessons/LessonItem.kt b/app/src/main/kotlin/com/d4rk/androidtutorials/ui/components/lessons/LessonItem.kt index 3530da2..1d6824c 100644 --- a/app/src/main/kotlin/com/d4rk/androidtutorials/ui/components/lessons/LessonItem.kt +++ b/app/src/main/kotlin/com/d4rk/androidtutorials/ui/components/lessons/LessonItem.kt @@ -1,7 +1,6 @@ package com.d4rk.androidtutorials.ui.components.lessons import android.content.Context -import android.os.Build.VERSION.SDK_INT import android.view.SoundEffectConstants import android.view.View import androidx.compose.foundation.clickable @@ -38,10 +37,7 @@ import androidx.compose.ui.platform.LocalView import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.unit.dp import androidx.lifecycle.viewmodel.compose.viewModel -import coil3.ImageLoader import coil3.compose.AsyncImage -import coil3.gif.AnimatedImageDecoder -import coil3.gif.GifDecoder import com.d4rk.androidtutorials.constants.ui.lessons.LessonConstants import com.d4rk.androidtutorials.data.model.ui.screens.UiLesson import com.d4rk.androidtutorials.ui.components.animations.bounceClick @@ -51,34 +47,20 @@ import com.d4rk.androidtutorials.ui.screens.home.HomeViewModel @Composable fun LessonItem(lesson : UiLesson , context : Context , modifier : Modifier = Modifier) { val viewModel : HomeViewModel = viewModel() - val imageLoader = ImageLoader.Builder(context).components { - if (SDK_INT >= 28) { - add(AnimatedImageDecoder.Factory()) - } - else { - add(GifDecoder.Factory()) - } - }.build() Card( modifier = modifier.fillMaxWidth() ) { when (lesson.lessonType) { LessonConstants.TYPE_FULL_IMAGE_BANNER -> { FullImageBannerLessonItem( - lesson = lesson , - context = context , - viewModel = viewModel , - imageLoader = imageLoader + lesson = lesson , context = context , viewModel = viewModel ) Spacer(modifier = Modifier.width(8.dp)) } LessonConstants.TYPE_SQUARE_IMAGE -> { SquareImageLessonItem( - lesson = lesson , - context = context , - viewModel = viewModel , - imageLoader = imageLoader + lesson = lesson , context = context , viewModel = viewModel ) Spacer(modifier = Modifier.width(8.dp)) } @@ -88,7 +70,7 @@ fun LessonItem(lesson : UiLesson , context : Context , modifier : Modifier = Mod @Composable fun FullImageBannerLessonItem( - lesson : UiLesson , context : Context , viewModel : HomeViewModel , imageLoader : ImageLoader + lesson : UiLesson , context : Context , viewModel : HomeViewModel ) { Card(modifier = Modifier .fillMaxWidth() @@ -97,7 +79,6 @@ fun FullImageBannerLessonItem( }) { Column { AsyncImage( - imageLoader = imageLoader , model = lesson.thumbnailImageUrl , contentDescription = null , modifier = Modifier @@ -130,7 +111,7 @@ fun FullImageBannerLessonItem( @Composable fun SquareImageLessonItem( - lesson : UiLesson , context : Context , viewModel : HomeViewModel , imageLoader : ImageLoader + lesson : UiLesson , context : Context , viewModel : HomeViewModel ) { Card(modifier = Modifier .fillMaxWidth() @@ -146,7 +127,6 @@ fun SquareImageLessonItem( horizontalArrangement = Arrangement.SpaceBetween ) { AsyncImage( - imageLoader = imageLoader , model = lesson.squareImageUrl , contentDescription = null , modifier = Modifier