Skip to content

Commit

Permalink
Merge branch 'main' into tooltips
Browse files Browse the repository at this point in the history
  • Loading branch information
jakeroseman authored Oct 11, 2024
2 parents 08578cf + a0b94c0 commit ea571ef
Show file tree
Hide file tree
Showing 3 changed files with 113 additions and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,7 @@ import com.example.compose.snippets.graphics.BitmapFromComposableFullSnippet
import com.example.compose.snippets.graphics.BrushExamplesScreen
import com.example.compose.snippets.images.ImageExamplesScreen
import com.example.compose.snippets.landing.LandingScreen
import com.example.compose.snippets.layouts.PagerExamples
import com.example.compose.snippets.navigation.Destination
import com.example.compose.snippets.navigation.TopComponentsDestination
import com.example.compose.snippets.ui.theme.SnippetsTheme
Expand Down Expand Up @@ -88,6 +89,7 @@ class SnippetsActivity : ComponentActivity() {
}
Destination.ShapesExamples -> ApplyPolygonAsClipImage()
Destination.SharedElementExamples -> PlaceholderSizeAnimated_Demo()
Destination.PagerExamples -> PagerExamples()
}
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,12 @@ package com.example.compose.snippets.layouts

import android.util.Log
import androidx.compose.foundation.Image
import androidx.compose.foundation.LocalIndication
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.interaction.collectIsDraggedAsState
import androidx.compose.foundation.interaction.collectIsPressedAsState
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
Expand Down Expand Up @@ -50,6 +55,8 @@ import androidx.compose.material3.TabRow
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.getValue
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.snapshotFlow
import androidx.compose.ui.Alignment
Expand All @@ -58,13 +65,15 @@ import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.graphicsLayer
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.Density
import androidx.compose.ui.unit.dp
import androidx.compose.ui.util.lerp
import coil.compose.rememberAsyncImagePainter
import com.example.compose.snippets.util.rememberRandomSampleImageUrl
import kotlin.math.absoluteValue
import kotlinx.coroutines.delay
import kotlinx.coroutines.launch

/*
Expand All @@ -83,6 +92,18 @@ import kotlinx.coroutines.launch
* limitations under the License.
*/

@Composable
fun PagerExamples() {
AutoAdvancePager(
listOf(
Color.Red,
Color.Gray,
Color.Green,
Color.White
)
)
}

@Preview
@Composable
fun HorizontalPagerSample() {
Expand Down Expand Up @@ -392,6 +413,94 @@ fun PagerIndicator() {
}
}

@Composable
fun AutoAdvancePager(pageItems: List<Color>, modifier: Modifier = Modifier) {
Box(modifier = Modifier.fillMaxSize()) {
val pagerState = rememberPagerState(pageCount = { pageItems.size })
val pagerIsDragged by pagerState.interactionSource.collectIsDraggedAsState()

val pageInteractionSource = remember { MutableInteractionSource() }
val pageIsPressed by pageInteractionSource.collectIsPressedAsState()

// Stop auto-advancing when pager is dragged or one of the pages is pressed
val autoAdvance = !pagerIsDragged && !pageIsPressed

if (autoAdvance) {
LaunchedEffect(pagerState, pageInteractionSource) {
while (true) {
delay(2000)
val nextPage = (pagerState.currentPage + 1) % pageItems.size
pagerState.animateScrollToPage(nextPage)
}
}
}

HorizontalPager(
state = pagerState
) { page ->
Text(
text = "Page: $page",
textAlign = TextAlign.Center,
modifier = modifier
.fillMaxSize()
.background(pageItems[page])
.clickable(
interactionSource = pageInteractionSource,
indication = LocalIndication.current
) {
// Handle page click
}
.wrapContentSize(align = Alignment.Center)
)
}

PagerIndicator(pageItems.size, pagerState.currentPage)
}
}

@Preview
@Composable
private fun AutoAdvancePagerPreview() {
val pageItems: List<Color> = listOf(
Color.Red,
Color.Gray,
Color.Green,
Color.White
)
AutoAdvancePager(pageItems = pageItems)
}

@Composable
fun PagerIndicator(pageCount: Int, currentPageIndex: Int, modifier: Modifier = Modifier) {
Box(modifier = Modifier.fillMaxSize()) {
Row(
modifier = Modifier
.wrapContentHeight()
.fillMaxWidth()
.align(Alignment.BottomCenter)
.padding(bottom = 8.dp),
horizontalArrangement = Arrangement.Center
) {
repeat(pageCount) { iteration ->
val color = if (currentPageIndex == iteration) Color.DarkGray else Color.LightGray
Box(
modifier = modifier
.padding(2.dp)
.clip(CircleShape)
.background(color)
.size(16.dp)
)
}
}
}
}

@Preview
@Composable
private fun PagerIndicatorPreview() {
PagerIndicator(pageCount = 4, currentPageIndex = 1)
}

// [START android_compose_pager_custom_page_size]
private val threePagesPerViewport = object : PageSize {
override fun Density.calculateMainAxisPageSize(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,8 @@ enum class Destination(val route: String, val title: String) {
ComponentsExamples("topComponents", "Top Compose Components"),
ScreenshotExample("screenshotExample", "Screenshot Examples"),
ShapesExamples("shapesExamples", "Shapes Examples"),
SharedElementExamples("sharedElement", "Shared elements")
SharedElementExamples("sharedElement", "Shared elements"),
PagerExamples("pagerExamples", "Pager examples")
}

// Enum class for compose components navigation screen.
Expand Down

0 comments on commit ea571ef

Please sign in to comment.