Merge pull request #1492 from joreilly/image_loading_indicator

progress indicator when showing speaker images
joreilly · Dec 1, 2024 · 3e30172 · 3e30172
2 parents 7bf551e + 0b33261
commit 3e30172
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 6 deletions.
diff --git a/fastlane/Fastfile b/fastlane/Fastfile
@@ -4,7 +4,7 @@ default_platform :android
 
 platform :android do
 
-    androidVersionNum = 252
+    androidVersionNum = 253
     wearVersionNum = 328
 
     before_all do

diff --git a/...ed/src/commonMain/kotlin/dev/johnoreilly/confetti/ui/sessions/SessionDetailsViewShared.kt b/...ed/src/commonMain/kotlin/dev/johnoreilly/confetti/ui/sessions/SessionDetailsViewShared.kt
@@ -19,6 +19,7 @@ import androidx.compose.foundation.text.selection.SelectionContainer
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Person
+import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
@@ -34,7 +35,7 @@ import androidx.compose.ui.semantics.Role
 import androidx.compose.ui.text.font.FontStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
-import coil3.compose.AsyncImage
+import coil3.compose.SubcomposeAsyncImage
 import confetti.shared.generated.resources.Res
 import confetti.shared.generated.resources.speakers
 import dev.johnoreilly.confetti.fragment.SessionDetails
@@ -152,11 +153,15 @@ internal fun SessionSpeakerInfo(
         Row {
             speaker.photoUrl?.let {
                 val url = "https://confetti-app.dev/images/avatar/${conference}/${speaker.id}"
-                AsyncImage(
+                SubcomposeAsyncImage(
                     model = url,
                     contentDescription = speaker.name,
+                    loading = {
+                        CircularProgressIndicator()
+                    },
                     contentScale = ContentScale.Crop,
-                    modifier = Modifier.size(64.dp)
+                    modifier = Modifier
+                        .size(64.dp)
                         .clip(CircleShape)
                 )
             }

diff --git a/shared/src/commonMain/kotlin/dev/johnoreilly/confetti/ui/speakers/SpeakersGridView.kt b/shared/src/commonMain/kotlin/dev/johnoreilly/confetti/ui/speakers/SpeakersGridView.kt
@@ -9,6 +9,7 @@ import androidx.compose.foundation.lazy.grid.GridCells
 import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
 import androidx.compose.foundation.lazy.grid.items
 import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -19,7 +20,7 @@ import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import coil3.compose.AsyncImage
+import coil3.compose.SubcomposeAsyncImage
 import dev.johnoreilly.confetti.fragment.SpeakerDetails
 
 
@@ -43,9 +44,12 @@ fun SpeakerGridView(
 
                     // proxy image requests through backend
                     val url = "https://confetti-app.dev/images/avatar/${conference}/${speaker.id}"
-                    AsyncImage(
+                    SubcomposeAsyncImage(
                         model = url,
                         contentDescription = speaker.name,
+                        loading = {
+                            CircularProgressIndicator()
+                        },
                         contentScale = ContentScale.Fit,
                         modifier = Modifier
                             .size(150.dp)