[FEAT] Include Image to DetailedContent Composable

- DetailedContent Composable would now have an image resource as well. (Prevent empty screen, when the notice only contains Image without its body paragraph.)
KNUTICE · Nov 18, 2024 · f4b5ab8 · f4b5ab8
1 parent 7e234fb
commit f4b5ab8
Show file tree

Hide file tree

Showing 6 changed files with 48 additions and 20 deletions.
diff --git a/app/src/main/java/com/doyoonkim/knutice/model/DataWrappers.kt b/app/src/main/java/com/doyoonkim/knutice/model/DataWrappers.kt
@@ -69,7 +69,8 @@ data class DetailedContentState(
     val title: String = "",
     val info: String = "",
     val fullContent: String = "",
-    val fullContentUrl: String = ""
+    val fullContentUrl: String = "",
+    val imageUrl: String = ""
 )
 
 data class CustomerServiceReportState(

diff --git a/app/src/main/java/com/doyoonkim/knutice/model/Types.kt b/app/src/main/java/com/doyoonkim/knutice/model/Types.kt
@@ -16,5 +16,6 @@ data class NavDestination(
 data class FullContent(
     val title: String? = null,
     val info: String? = null,
-    val url: String
+    val url: String,
+    val imgUrl: String
 )
diff --git a/app/src/main/java/com/doyoonkim/knutice/presentation/CategorizedNoficiation.kt b/app/src/main/java/com/doyoonkim/knutice/presentation/CategorizedNoficiation.kt
@@ -64,35 +64,35 @@ fun CategorizedNotification(
             titleColor = MaterialTheme.colorScheme.notificationType1,
             contents = uiState.notificationGeneral,
             onMoreClicked = { onMoreNoticeRequested(Destination.MORE_GENERAL) }
-        ) { title, info, url ->
-            onFullContentRequested(FullContent(title, info, url))
+        ) { title, info, url, imgUrl ->
+            onFullContentRequested(FullContent(title, info, url, imgUrl))
         }
 
         NotificationPreviewList(
             listTitle = stringResource(R.string.academic_news),
             titleColor = MaterialTheme.colorScheme.notificationType2,
             contents = uiState.notificationAcademic,
             onMoreClicked = { onMoreNoticeRequested(Destination.MORE_ACADEMIC) }
-        ) { title, info, url ->
-            onFullContentRequested(FullContent(title, info, url))
+        ) { title, info, url, imgUrl ->
+            onFullContentRequested(FullContent(title, info, url, imgUrl))
         }
 
         NotificationPreviewList(
             listTitle = stringResource(R.string.scholarship_news),
             titleColor = MaterialTheme.colorScheme.notificationType3,
             contents = uiState.notificationScholarship,
             onMoreClicked = { onMoreNoticeRequested(Destination.MORE_SCHOLARSHIP) }
-        ) { title, info, url ->
-            onFullContentRequested(FullContent(title, info, url))
+        ) { title, info, url, imgUrl ->
+            onFullContentRequested(FullContent(title, info, url, imgUrl))
         }
 
         NotificationPreviewList(
             listTitle = stringResource(R.string.event_news),
             titleColor = MaterialTheme.colorScheme.notificationType4,
             contents = uiState.notificationEvent,
             onMoreClicked = { onMoreNoticeRequested(Destination.MORE_EVENT) }
-        ) { title, info, url ->
-            onFullContentRequested(FullContent(title, info, url))
+        ) { title, info, url, imgUrl ->
+            onFullContentRequested(FullContent(title, info, url, imgUrl))
         }
     }
 }
@@ -104,7 +104,7 @@ fun NotificationPreviewList(
     titleColor: Color = Color.Unspecified,
     contents: List<Notice> = listOf(),
     onMoreClicked: () -> Unit = {  },
-    onNoticeClicked: (String, String, String) -> Unit
+    onNoticeClicked: (String, String, String, String) -> Unit
 ) {
     Column(
         modifier = Modifier.fillMaxWidth()
@@ -140,7 +140,11 @@ fun NotificationPreviewList(
                 notificationTitle = content.title,
                 notificationInfo = "[${content.departName}] ${content.timestamp}"
             ) {
-                onNoticeClicked(content.title, content.departName, content.url)
+                onNoticeClicked(
+                    content.title,
+                    "[${content.departName}] ${content.timestamp}",
+                    content.url,
+                    content.imageUrl)
             }
         }
     }

diff --git a/app/src/main/java/com/doyoonkim/knutice/presentation/DetailedNoticeContent.kt b/app/src/main/java/com/doyoonkim/knutice/presentation/DetailedNoticeContent.kt
@@ -25,6 +25,7 @@ import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
@@ -35,6 +36,8 @@ import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
+import coil.compose.AsyncImage
+import coil.request.ImageRequest
 import com.doyoonkim.knutice.ui.theme.buttonContainer
 import com.doyoonkim.knutice.ui.theme.containerBackground
 import com.doyoonkim.knutice.R
@@ -93,12 +96,29 @@ fun DetailedNoticeContent(
                 color = MaterialTheme.colorScheme.containerBackground,
                 shape = RoundedCornerShape(10.dp)
             ) {
-                Text(
-                    modifier = Modifier.fillMaxWidth().padding(10.dp),
-                    text = state.fullContent,
-                    fontSize = 18.sp,
-                    fontWeight = FontWeight.Medium,
-                )
+                Column(
+                    modifier = Modifier.fillMaxSize(),
+                    verticalArrangement = Arrangement.Top
+                ) {
+                    if (state.imageUrl != "") {
+                        AsyncImage(
+                            model = ImageRequest.Builder(LocalContext.current)
+                                .data(state.imageUrl)
+                                .crossfade(true)
+                                .build(),
+                            contentDescription = "Loaded Image, which is a part of the notice.",
+                            contentScale = ContentScale.FillWidth,
+                            modifier = Modifier.fillMaxSize().padding(7.dp)
+                        )
+                    }
+                    Text(
+                        modifier = Modifier.fillMaxWidth().padding(10.dp),
+                        text = state.fullContent,
+                        fontSize = 18.sp,
+                        fontWeight = FontWeight.Medium,
+                    )
+                }
+
             }
 
             Button(

diff --git a/app/src/main/java/com/doyoonkim/knutice/presentation/MoreCategorizedNoticiation.kt b/app/src/main/java/com/doyoonkim/knutice/presentation/MoreCategorizedNoticiation.kt
@@ -97,7 +97,8 @@ fun MoreCategorizedNotification(
                                 onNoticeSelected(FullContent(
                                     notice.title,
                                     "[${notice.departName}] ${notice.timestamp}",
-                                    notice.url
+                                    notice.url,
+                                    notice.imageUrl
                                 ))
                             }
                     ) {

diff --git a/app/src/main/java/com/doyoonkim/knutice/viewModel/DetailedNoticeContentViewModel.kt b/app/src/main/java/com/doyoonkim/knutice/viewModel/DetailedNoticeContentViewModel.kt
@@ -45,7 +45,8 @@ class DetailedNoticeContentViewModel @Inject constructor(
                                     title = content.title,
                                     info = content.info,
                                     fullContent = content.fullContent,
-                                    fullContentUrl = content.fullContentUrl
+                                    fullContentUrl = content.fullContentUrl,
+                                    imageUrl = requested.imgUrl
                                 )
                             }
                         },