Update detail page.

app/src/main/java/com/pixelized/biblib/ui/composable/items/BookThumbnailComposable.kt

@@ -2,6 +2,7 @@ package com.pixelized.biblib.ui.composable.items
 
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.Card
 import androidx.compose.material.Icon
 import androidx.compose.material.MaterialTheme
@@ -11,6 +12,7 @@ import androidx.compose.material.icons.filled.NavigateNext
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.painterResource

app/src/main/java/com/pixelized/biblib/ui/composable/pages/DetailPageComposable.kt

@@ -2,23 +2,30 @@ package com.pixelized.biblib.ui.composable.pages
 
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.rememberScrollState
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.Button
+import androidx.compose.material.Icon
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Download
+import androidx.compose.material.icons.filled.Send
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.pixelized.biblib.R
-import com.pixelized.biblib.ui.data.BookUio
 import com.pixelized.biblib.ui.composable.items.Image
+import com.pixelized.biblib.ui.data.BookUio
 import com.pixelized.biblib.ui.theme.BibLibTheme
 import com.pixelized.biblib.ui.theme.Teal200
 import com.pixelized.biblib.utils.BitmapCache
@@ -37,12 +44,13 @@ fun DetailPageComposable(book: BookUio) {
             .padding(horizontal = 16.dp)
     ) {
         Image(
-            modifier = Modifier.align(Alignment.CenterHorizontally),
+            modifier = Modifier.fillMaxWidth(),
             contentModifier = Modifier
-                .wrapContentWidth()
+                .fillMaxWidth()
-                .height(480.dp)
+                .wrapContentHeight()
-                .padding(vertical = 16.dp),
+                .padding(vertical = 16.dp)
-            contentScale = ContentScale.FillHeight,
+                .clip(RoundedCornerShape(16.dp)),
+            contentScale = ContentScale.FillWidth,
             placeHolder = painterResource(id = R.drawable.ic_launcher_foreground),
             contentUrl = book.cover,
             colorFilter = if (MaterialTheme.colors.isLight) ColorFilter.tint(Teal200) else null,
@@ -50,21 +58,31 @@ fun DetailPageComposable(book: BookUio) {
         )
         Row(modifier = Modifier.padding(bottom = 16.dp)) {
             Button(
-                modifier = Modifier.weight(1f),
+                modifier = Modifier
+                    .weight(1f)
+                    .padding(end = 4.dp),
                 onClick = { }) {
-                Text(text = "EPUB")
+                Icon(imageVector = Icons.Default.Download, contentDescription = "")
+                Spacer(modifier = Modifier.width(4.dp))
+                Text(text = stringResource(id = R.string.action_epub))
             }
             Button(
                 modifier = Modifier
                     .weight(1f)
-                    .padding(horizontal = 8.dp),
+                    .padding(horizontal = 4.dp),
                 onClick = { }) {
-                Text(text = "MOBI")
+                Icon(imageVector = Icons.Default.Download, contentDescription = "")
+                Spacer(modifier = Modifier.width(4.dp))
+                Text(text = stringResource(id = R.string.action_mobi))
             }
             Button(
-                modifier = Modifier.weight(1f),
+                modifier = Modifier
+                    .weight(1f)
+                    .padding(start = 4.dp),
                 onClick = { }) {
-                Text(text = "SEND")
+                Icon(imageVector = Icons.Default.Send, contentDescription = "")
+                Spacer(modifier = Modifier.width(4.dp))
+                Text(text = stringResource(id = R.string.action_send))
             }
         }
         Text(
@@ -78,16 +96,18 @@ fun DetailPageComposable(book: BookUio) {
             modifier = Modifier
                 .align(alignment = Alignment.CenterHorizontally)
                 .padding(bottom = 16.dp),
+            fontWeight = FontWeight.Bold,
             style = typography.h6,
             text = book.author,
         )
-        Row(modifier = Modifier.padding(bottom = 16.dp)) {
+        Row(modifier = Modifier.padding(bottom = 8.dp)) {
             Column(
                 modifier = Modifier.weight(1f),
                 horizontalAlignment = Alignment.CenterHorizontally
             ) {
                 Text(
                     style = typography.body2,
+                    fontWeight = FontWeight.Bold,
                     text = stringResource(id = R.string.detail_rating),
                 )
                 Text(
@@ -101,6 +121,7 @@ fun DetailPageComposable(book: BookUio) {
             ) {
                 Text(
                     style = typography.body2,
+                    fontWeight = FontWeight.Bold,
                     text = stringResource(id = R.string.detail_language),
                 )
                 Text(
@@ -114,7 +135,8 @@ fun DetailPageComposable(book: BookUio) {
             ) {
                 Text(
                     style = typography.body2,
-                    text = stringResource(id = R.string.detail_Release),
+                    fontWeight = FontWeight.Bold,
+                    text = stringResource(id = R.string.detail_release),
                 )
                 Text(
                     style = typography.body1,
@@ -122,6 +144,19 @@ fun DetailPageComposable(book: BookUio) {
                 )
             }
         }
+        Text(
+            modifier = Modifier.align(Alignment.CenterHorizontally),
+            style = typography.body2,
+            fontWeight = FontWeight.Bold,
+            text = stringResource(id = R.string.detail_series),
+        )
+        Text(
+            modifier = Modifier
+                .align(Alignment.CenterHorizontally)
+                .padding(bottom = 16.dp),
+            style = typography.body1,
+            text = book.series ?: "-",
+        )
         Text(
             style = typography.body1,
             text = book.description,

app/src/main/res/values/strings.xml

@@ -4,6 +4,9 @@
 
     <string name="action_register">Register</string>
     <string name="action_login">Login</string>
+    <string name="action_epub">EPUB</string>
+    <string name="action_mobi">MOBI</string>
+    <string name="action_send">SEND</string>
     <string name="action_google_sign_in">Sign in with Google</string>
 
     <string name="loading">Entering the Imperial Library of Trantor.</string>
@@ -19,5 +22,6 @@
 
     <string name="detail_rating">Rating</string>
     <string name="detail_language">Language</string>
-    <string name="detail_Release">Release</string>
+    <string name="detail_release">Release</string>
+    <string name="detail_series">Series</string>
 </resources>