Fix header being flipped for Arabic

Previously, the footer page number was fixed for Arabic. The same fix should also apply to the header.
quran · Dec 16, 2024 · 7528243 · 7528243
1 parent 5552dcf
commit 7528243
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 23 deletions.
diff --git a/...rc/main/java/com/quran/labs/androidquran/extra/feature/linebyline/ui/QuranHeaderFooter.kt b/...rc/main/java/com/quran/labs/androidquran/extra/feature/linebyline/ui/QuranHeaderFooter.kt
@@ -7,8 +7,11 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalLayoutDirection
+import androidx.compose.ui.unit.LayoutDirection
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.min
 import androidx.compose.ui.unit.sp
@@ -20,13 +23,21 @@ fun QuranHeaderFooter(
   color: Color,
   modifier: Modifier = Modifier,
 ) {
-  BoxWithConstraints {
-    val fontSize = (min(this.maxWidth, 480.dp) * 0.0345f).value.sp
-    Row(modifier = modifier.padding(vertical = 2.dp)) {
-      val textStyle = MaterialTheme.typography.subtitle2.copy(fontSize = fontSize)
-      Text(left, style = textStyle, color = color)
-      Spacer(modifier = Modifier.weight(1f, true))
-      Text(right, style = textStyle, color = color)
+  // always render the footer as LTR, otherwise, the page number will be rendered
+  // on the wrong side of the page for RTL due to Row being smart and flipping the
+  // children based on LTR/RTL. We want this flipping for the header and footer
+  // so that the page number is always on the right side for odd numbered
+  // pages and always on the left side for even numbered pages, and likewise with
+  // the juz' number and sura name.
+  CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Ltr) {
+    BoxWithConstraints {
+      val fontSize = (min(this.maxWidth, 480.dp) * 0.0345f).value.sp
+      Row(modifier = modifier.padding(vertical = 2.dp)) {
+        val textStyle = MaterialTheme.typography.subtitle2.copy(fontSize = fontSize)
+        Text(left, style = textStyle, color = color)
+        Spacer(modifier = Modifier.weight(1f, true))
+        Text(right, style = textStyle, color = color)
+      }
     }
   }
 }
diff --git a/...src/main/java/com/quran/labs/androidquran/extra/feature/linebyline/ui/QuranPageWrapper.kt b/...src/main/java/com/quran/labs/androidquran/extra/feature/linebyline/ui/QuranPageWrapper.kt
@@ -5,15 +5,12 @@ import androidx.compose.foundation.clickable
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.graphics.ImageBitmap
 import androidx.compose.ui.platform.LocalConfiguration
-import androidx.compose.ui.platform.LocalLayoutDirection
-import androidx.compose.ui.unit.LayoutDirection
 import com.quran.data.source.PageContentType
 import com.quran.labs.androidquran.extra.feature.linebyline.model.PageInfo
 import com.quran.labs.androidquran.extra.feature.linebyline.model.SidelinesPosition
@@ -135,19 +132,12 @@ fun QuranPageWrapper(
           "" to displayInfo.localizedPageText
         }
 
-        // always render the footer as LTR, otherwise, the page number will be rendered
-        // on the wrong side of the page for RTL due to Row being smart and flipping the
-        // children based on LTR/RTL. We want this flipping for the header, but not for
-        // the footer, so that the page number is always on the right side for odd numbered
-        // pages and always on the left side for even numbered pages.
-        CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Ltr) {
-          QuranHeaderFooter(
-            leftText,
-            rightText,
-            overlayColor,
-            modifier = Modifier
-          )
-        }
+        QuranHeaderFooter(
+          leftText,
+          rightText,
+          overlayColor,
+          modifier = Modifier
+        )
       } else {
         Spacer(modifier = Modifier)
       }