From 58671867515c10793d71f55f6ac5d45a9c6a9131 Mon Sep 17 00:00:00 2001
From: Ash <glaxyinfinite@outlook.com>
Date: Wed, 25 May 2022 13:40:52 +0800
Subject: [PATCH] Optimize the content styles of articles

---
 .../ui/component/reader/HtmlToComposable.kt   | 25 ++++++++++++-------
 .../ash/reader/ui/component/reader/Styles.kt  |  8 ++++--
 .../ui/component/reader/TextComposer.kt       |  2 +-
 3 files changed, 23 insertions(+), 12 deletions(-)

diff --git a/app/src/main/java/me/ash/reader/ui/component/reader/HtmlToComposable.kt b/app/src/main/java/me/ash/reader/ui/component/reader/HtmlToComposable.kt
index e5262ed..1d98501 100644
--- a/app/src/main/java/me/ash/reader/ui/component/reader/HtmlToComposable.kt
+++ b/app/src/main/java/me/ash/reader/ui/component/reader/HtmlToComposable.kt
@@ -238,7 +238,7 @@ private fun TextComposer.appendTextChildren(
                             withComposableStyle(
                                 style = { h5Style().toSpanStyle() }
                             ) {
-                                append(element.text())
+                                append("\n${element.text()}")
                             }
                         }
                     }
@@ -247,7 +247,7 @@ private fun TextComposer.appendTextChildren(
                             withComposableStyle(
                                 style = { h5Style().toSpanStyle() }
                             ) {
-                                append(element.text())
+                                append("\n${element.text()}")
                             }
                         }
                     }
@@ -256,7 +256,7 @@ private fun TextComposer.appendTextChildren(
                             withComposableStyle(
                                 style = { h5Style().toSpanStyle() }
                             ) {
-                                append(element.text())
+                                append("\n${element.text()}")
                             }
                         }
                     }
@@ -265,7 +265,7 @@ private fun TextComposer.appendTextChildren(
                             withComposableStyle(
                                 style = { h5Style().toSpanStyle() }
                             ) {
-                                append(element.text())
+                                append("\n${element.text()}")
                             }
                         }
                     }
@@ -274,7 +274,7 @@ private fun TextComposer.appendTextChildren(
                             withComposableStyle(
                                 style = { h5Style().toSpanStyle() }
                             ) {
-                                append(element.text())
+                                append("\n${element.text()}")
                             }
                         }
                     }
@@ -283,7 +283,7 @@ private fun TextComposer.appendTextChildren(
                             withComposableStyle(
                                 style = { h5Style().toSpanStyle() }
                             ) {
-                                append(element.text())
+                                append("\n${element.text()}")
                             }
                         }
                     }
@@ -442,6 +442,7 @@ private fun TextComposer.appendTextChildren(
 //                                            .padding(horizontal = PADDING_HORIZONTAL.dp)
                                             .width(MAX_CONTENT_WIDTH.dp)
                                     ) {
+                                        Spacer(modifier = Modifier.height(PADDING_HORIZONTAL.dp))
                                         DisableSelection {
                                             BoxWithConstraints(
                                                 modifier = Modifier
@@ -466,7 +467,11 @@ private fun TextComposer.appendTextChildren(
                                             ) {
                                                 val imageSize = maxImageSize()
                                                 RYAsyncImage(
-                                                    modifier = Modifier.fillMaxWidth(),
+                                                    modifier = Modifier
+                                                        .fillMaxWidth()
+                                                        .padding(horizontal = PADDING_HORIZONTAL.dp)
+                                                        .clip(IMAGE_SHAPE)
+                                                        .clickable { },
                                                     data = imageCandidates.getBestImageForMaxSize(
                                                         pixelDensity = pixelDensity(),
                                                         maxSize = imageSize,
@@ -593,10 +598,12 @@ private fun TextComposer.appendTextChildren(
                                             ) {
                                                 RYAsyncImage(
                                                     modifier = Modifier
+                                                        .fillMaxWidth()
+                                                        .padding(horizontal = PADDING_HORIZONTAL.dp)
+                                                        .clip(IMAGE_SHAPE)
                                                         .clickable {
                                                             onLinkClick(video.link)
-                                                        }
-                                                        .fillMaxWidth(),
+                                                        },
                                                     data = video.imageUrl,
                                                     size = maxImageSize(),
                                                     contentDescription = stringResource(R.string.touch_to_play_video),
diff --git a/app/src/main/java/me/ash/reader/ui/component/reader/Styles.kt b/app/src/main/java/me/ash/reader/ui/component/reader/Styles.kt
index 7ed82e9..b1fa1b1 100644
--- a/app/src/main/java/me/ash/reader/ui/component/reader/Styles.kt
+++ b/app/src/main/java/me/ash/reader/ui/component/reader/Styles.kt
@@ -20,6 +20,7 @@
 
 package me.ash.reader.ui.component.reader
 
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.graphics.Color
@@ -27,12 +28,14 @@ import androidx.compose.ui.text.SpanStyle
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.text.style.TextDecoration
 import androidx.compose.ui.unit.dp
 import me.ash.reader.ui.ext.alphaLN
 
 const val PADDING_HORIZONTAL = 24.0
 const val MAX_CONTENT_WIDTH = 840.0
+val IMAGE_SHAPE = RoundedCornerShape(32.dp)
 
 @Composable
 fun bodyForeground(): Color =
@@ -71,7 +74,7 @@ fun h4Style(): TextStyle =
 @Composable
 fun h5Style(): TextStyle =
     MaterialTheme.typography.headlineSmall.copy(
-        color = bodyForeground()
+        color = bodyForeground(),
     )
 
 @Composable
@@ -83,7 +86,8 @@ fun h6Style(): TextStyle =
 @Composable
 fun captionStyle(): TextStyle =
     MaterialTheme.typography.bodySmall.copy(
-        color = bodyForeground().copy(alpha = 0.6f)
+        color = bodyForeground().copy(alpha = 0.6f),
+        textAlign = TextAlign.Center,
     )
 
 @Composable
diff --git a/app/src/main/java/me/ash/reader/ui/component/reader/TextComposer.kt b/app/src/main/java/me/ash/reader/ui/component/reader/TextComposer.kt
index e38d0e6..f3db0b1 100644
--- a/app/src/main/java/me/ash/reader/ui/component/reader/TextComposer.kt
+++ b/app/src/main/java/me/ash/reader/ui/component/reader/TextComposer.kt
@@ -79,7 +79,7 @@ class TextComposer(
         ) -> R
     ): R {
         val url = link ?: findClosestLink()
-        builder.ensureDoubleNewline()
+        //builder.ensureDoubleNewline()
         terminateCurrentText()
         val onClick: (() -> Unit)? = if (url?.isNotBlank() == true) {
             {