Skip to content

Commit

Permalink
No Data animation showing in case of empty data from API response (#6)
Browse files Browse the repository at this point in the history
* No Data animation showing when there is empty data coming from API response

* Unnecessary spaces generated by studio templated are reset now
  • Loading branch information
AbdulRehmanNazar authored Jun 11, 2024
1 parent 8b2a107 commit ed1d9df
Show file tree
Hide file tree
Showing 5 changed files with 111 additions and 63 deletions.
15 changes: 9 additions & 6 deletions buildSrc/src/main/java/Dependencies.kt
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ object Versions {
const val compose_activity = "1.8.2"
const val nav_version = "2.7.7"
const val appCompat = "1.6.1"
const val material = "1.11.0"
const val material = "1.11.0"
const val lifecycle = "2.7.0"
const val hilt = "2.51.1"
const val hiltCompose = "1.2.0"
Expand All @@ -24,6 +24,7 @@ object Versions {
const val browser = "1.8.0"
const val room_version = "2.6.1"
const val annotation = "1.7.1"
const val lottie_compose = "4.0.0"
}

object AppMetaData {
Expand Down Expand Up @@ -94,19 +95,21 @@ object Deps {
const val moshiCodegen = "com.squareup.moshi:moshi-kotlin-codegen:${Versions.moshi}"

// Coroutines
const val coroutinesCore =
"org.jetbrains.kotlinx:kotlinx-coroutines-core:${Versions.coroutines}"
const val coroutinesAndroid =
"org.jetbrains.kotlinx:kotlinx-coroutines-android:${Versions.coroutines}"
const val coroutinesCore = "org.jetbrains.kotlinx:kotlinx-coroutines-core:${Versions.coroutines}"
const val coroutinesAndroid = "org.jetbrains.kotlinx:kotlinx-coroutines-android:${Versions.coroutines}"

// Coil
const val coil = "io.coil-kt:coil-compose:${Versions.coil}"

// Gson
const val gson = "com.google.code.gson:gson:${Versions.gson}"
const val gson = "com.google.code.gson:gson:${Versions.gson}"

// Room
const val room = "androidx.room:room-runtime:${Versions.room_version}"
const val roomKtx = "androidx.room:room-ktx:${Versions.room_version}"
const val roomCompiler = "androidx.room:room-compiler:${Versions.room_version}"


const val lottieCompose = "com.airbnb.android:lottie-compose:${Versions.lottie_compose}"

}
1 change: 1 addition & 0 deletions features/feature-paging/build.gradle.kts
Original file line number Diff line number Diff line change
Expand Up @@ -50,4 +50,5 @@ dependencies {
implementation(Deps.hilt)
ksp(Deps.hilt_compiler)
implementation(Deps.hilt_compose)
implementation(Deps.lottieCompose)
}
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,15 @@ import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.navigationBars
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.statusBars
import androidx.compose.foundation.layout.windowInsetsTopHeight
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.GridItemSpan
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalDensity
Expand All @@ -26,6 +29,11 @@ import androidx.navigation.NavController
import androidx.paging.LoadState
import androidx.paging.compose.LazyPagingItems
import androidx.paging.compose.collectAsLazyPagingItems
import com.airbnb.lottie.compose.LottieAnimation
import com.airbnb.lottie.compose.LottieCompositionSpec
import com.airbnb.lottie.compose.LottieConstants
import com.airbnb.lottie.compose.animateLottieCompositionAsState
import com.airbnb.lottie.compose.rememberLottieComposition
import com.sample.tmdb.common.MainDestinations
import com.sample.tmdb.common.model.TMDbItem
import com.sample.tmdb.common.ui.Dimens
Expand Down Expand Up @@ -88,70 +96,104 @@ private fun <T : TMDbItem> LazyTMDbItemGrid(
lazyTMDbItems: LazyPagingItems<T>,
onClick: (TMDbItem) -> Unit,
) {
LazyVerticalGrid(
columns = GridCells.Adaptive(minSize = 140.dp),
contentPadding = PaddingValues(
start = Dimens.PaddingMedium,
end = Dimens.PaddingMedium,
bottom = WindowInsets.navigationBars.getBottom(LocalDensity.current)
.toDp().dp.plus(
Dimens.PaddingMedium
)
),
horizontalArrangement = Arrangement.spacedBy(
Dimens.PaddingMedium,
Alignment.CenterHorizontally
),
content = {

item(span = {
GridItemSpan(maxLineSpan)
}) {
Spacer(
Modifier.windowInsetsTopHeight(
WindowInsets.statusBars.add(WindowInsets(top = 56.dp))
if (lazyTMDbItems.itemCount == 0) {
Box(
modifier = Modifier.fillMaxSize(),
contentAlignment = Alignment.Center
) {
NoDataFoundAnimation(
modifier = Modifier
.size(200.dp)
)
}
} else {
LazyVerticalGrid(
columns = GridCells.Adaptive(minSize = 140.dp),
contentPadding = PaddingValues(
start = Dimens.PaddingMedium,
end = Dimens.PaddingMedium,
bottom = WindowInsets.navigationBars.getBottom(LocalDensity.current)
.toDp().dp.plus(
Dimens.PaddingMedium
)
)
}

items(lazyTMDbItems.itemCount) { index ->
val tmdbItem = lazyTMDbItems[index]
tmdbItem?.let {
TMDbItemContent(
it,
Modifier
.height(320.dp)
.padding(vertical = Dimens.PaddingMedium),
onClick
),
horizontalArrangement = Arrangement.spacedBy(
Dimens.PaddingMedium,
Alignment.CenterHorizontally
),
content = {

item(span = {
GridItemSpan(maxLineSpan)
}) {
Spacer(
Modifier.windowInsetsTopHeight(
WindowInsets.statusBars.add(WindowInsets(top = 56.dp))
)
)
}
}

when (lazyTMDbItems.loadState.append) {
is LoadState.Loading -> {
item(span = {
GridItemSpan(maxLineSpan)
}) {
LoadingRow(modifier = Modifier.padding(vertical = Dimens.PaddingMedium))

items(lazyTMDbItems.itemCount) { index ->
val tmdbItem = lazyTMDbItems[index]
tmdbItem?.let {
TMDbItemContent(
it,
Modifier
.height(320.dp)
.padding(vertical = Dimens.PaddingMedium),
onClick
)
}
}

is LoadState.Error -> {
val message =
(lazyTMDbItems.loadState.append as? LoadState.Error)?.error?.message
?: return@LazyVerticalGrid

item(span = {
GridItemSpan(maxLineSpan)
}) {
ErrorScreen(
message = message,
modifier = Modifier.padding(vertical = Dimens.PaddingMedium),
refresh = { lazyTMDbItems.retry() })
when (lazyTMDbItems.loadState.append) {
is LoadState.Loading -> {
item(span = {
GridItemSpan(maxLineSpan)
}) {
LoadingRow(modifier = Modifier.padding(vertical = Dimens.PaddingMedium))
}
}

is LoadState.Error -> {
val message =
(lazyTMDbItems.loadState.append as? LoadState.Error)?.error?.message
?: return@LazyVerticalGrid

item(span = {
GridItemSpan(maxLineSpan)
}) {
ErrorScreen(
message = message,
modifier = Modifier.padding(vertical = Dimens.PaddingMedium),
refresh = { lazyTMDbItems.retry() })
}
}

else -> {}
}
})
}
}

@Composable
fun NoDataFoundAnimation(modifier: Modifier = Modifier) {
val preloaderLottieComposition by rememberLottieComposition(
LottieCompositionSpec.RawRes(
R.raw.no_data_found
)
)

val preloaderProgress by animateLottieCompositionAsState(
preloaderLottieComposition,
iterations = LottieConstants.IterateForever,
isPlaying = true
)


else -> {}
}
})
LottieAnimation(
composition = preloaderLottieComposition,
progress = preloaderProgress,
modifier = modifier
)
}
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.sizeIn
import androidx.compose.foundation.layout.statusBarsPadding
import androidx.compose.foundation.layout.width
Expand Down

Large diffs are not rendered by default.

0 comments on commit ed1d9df

Please sign in to comment.