From af17252307f34b555be384b7711c553146472dd9 Mon Sep 17 00:00:00 2001
From: Rebecca Franks <riggaroo@google.com>
Date: Mon, 23 Oct 2023 15:07:56 +0100
Subject: [PATCH] Fix pager snippets (#160)

* Update PagerSnippets.kt rectified error

1. Modifer.align(Alignment.BottomCenter) is replaced by
    verticalArrangement property which is no more working

2. wrong value 10 is replaced by 4 for pageCount

3. made text more visible by putting it inside a box

* fix pager snippets

---------

Co-authored-by: Karthi Keyan <84800257+KarthiDreamr@users.noreply.github.com>
---
 .../compose/snippets/layouts/PagerSnippets.kt | 19 +++++++++----------
 1 file changed, 9 insertions(+), 10 deletions(-)

diff --git a/compose/snippets/src/main/java/com/example/compose/snippets/layouts/PagerSnippets.kt b/compose/snippets/src/main/java/com/example/compose/snippets/layouts/PagerSnippets.kt
index 85e9a454..f65c96e6 100644
--- a/compose/snippets/src/main/java/com/example/compose/snippets/layouts/PagerSnippets.kt
+++ b/compose/snippets/src/main/java/com/example/compose/snippets/layouts/PagerSnippets.kt
@@ -36,6 +36,7 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.sizeIn
+import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.foundation.layout.wrapContentSize
 import androidx.compose.foundation.pager.HorizontalPager
 import androidx.compose.foundation.pager.PageSize
@@ -361,38 +362,36 @@ fun PagerWithTabs() {
 @Preview
 @Composable
 fun PagerIndicator() {
-    Box {
+    Box(modifier = Modifier.fillMaxSize()) {
         // [START android_compose_pager_indicator]
-        val pageCount = 10
         val pagerState = rememberPagerState(pageCount = {
             4
         })
         HorizontalPager(
-            state = pagerState
+            state = pagerState,
+            modifier = Modifier.fillMaxSize()
         ) { page ->
             // Our page content
             Text(
                 text = "Page: $page",
-                modifier = Modifier
-                    .fillMaxSize()
             )
         }
         Row(
             Modifier
-                .height(50.dp)
+                .wrapContentHeight()
                 .fillMaxWidth()
-                .align(Alignment.BottomCenter),
+                .align(Alignment.BottomCenter)
+                .padding(bottom = 8.dp),
             horizontalArrangement = Arrangement.Center
         ) {
-            repeat(pageCount) { iteration ->
+            repeat(pagerState.pageCount) { iteration ->
                 val color = if (pagerState.currentPage == iteration) Color.DarkGray else Color.LightGray
                 Box(
                     modifier = Modifier
                         .padding(2.dp)
                         .clip(CircleShape)
                         .background(color)
-                        .size(20.dp)
-
+                        .size(16.dp)
                 )
             }
         }