fankes/pagecurl-multiplatform
2
0
Fork 0
mirror of https://github.com/fankes/pagecurl-multiplatform.git synced 2025-09-07 03:05:59 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add examples to demo app

Browse Source
This commit is contained in:
Oleksandr Balan
2022-08-12 00:08:02 +02:00
parent 44a323b254
commit 53dcc8401f
14 changed files with 569 additions and 178 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
demo/src/main/kotlin/eu/wewox/pagecurl/screens/AnimatePageCurlScreen.kt Normal file
View File

@@ -0,0 +1,8 @@
package eu.wewox.pagecurl.screens
import androidx.compose.runtime.Composable
@Composable
fun AnimatePageCurlScreen() {
}

74
demo/src/main/kotlin/eu/wewox/pagecurl/screens/SettingsPageCurlScreen.kt Normal file
View File

@@ -0,0 +1,74 @@
@file:OptIn(ExperimentalPageCurlApi::class)
package eu.wewox.pagecurl.screens
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.center
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.toOffset
import eu.wewox.pagecurl.ExperimentalPageCurlApi
import eu.wewox.pagecurl.HowToPageData
import eu.wewox.pagecurl.components.HowToPage
import eu.wewox.pagecurl.components.SettingsPopup
import eu.wewox.pagecurl.config.InteractionConfig
import eu.wewox.pagecurl.config.PageCurlConfig
import eu.wewox.pagecurl.page.PageCurl
import eu.wewox.pagecurl.page.rememberPageCurlState
@Composable
fun SettingsPageCurlScreen() {
Box(Modifier.fillMaxSize()) {
val pages = remember { HowToPageData.interactionHowToPages }
val state = rememberPageCurlState(max = pages.size)
var showPopup by remember { mutableStateOf(false) }
// Create a mutable interaction config with custom tap interaction
// In SettingsPopup config is mutated
var interaction by remember {
mutableStateOf(
InteractionConfig(
tap = InteractionConfig.Tap(
custom = InteractionConfig.Tap.CustomInteraction(true) { size, position ->
// Detect tap somewhere in the center with 64 radius and show popup
if ((position - size.center.toOffset()).getDistance() < 64.dp.toPx()) {
showPopup = true
true
} else {
false
}
}
)
)
)
}
PageCurl(
state = state,
config = PageCurlConfig(
interaction = interaction
)
) { index ->
HowToPage(index, pages[index])
}
if (showPopup) {
SettingsPopup(
interaction = interaction,
onConfigChange = {
interaction = it
},
onDismiss = {
showPopup = false
}
)
}
}
}

26
demo/src/main/kotlin/eu/wewox/pagecurl/screens/SimplePageCurlScreen.kt Normal file
View File

@@ -0,0 +1,26 @@
@file:OptIn(ExperimentalPageCurlApi::class)
package eu.wewox.pagecurl.screens
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import eu.wewox.pagecurl.ExperimentalPageCurlApi
import eu.wewox.pagecurl.HowToPageData
import eu.wewox.pagecurl.components.HowToPage
import eu.wewox.pagecurl.page.PageCurl
import eu.wewox.pagecurl.page.rememberPageCurlState
@Composable
fun SimplePageCurlScreen() {
Box(Modifier.fillMaxSize()) {
val pages = remember { HowToPageData.simpleHowToPages }
val state = rememberPageCurlState(max = pages.size)
PageCurl(state = state) { index ->
HowToPage(index, pages[index])
}
}
}

151
demo/src/main/kotlin/eu/wewox/pagecurl/screens/StatePageCurlScreen.kt Normal file
View File

@@ -0,0 +1,151 @@
@file:OptIn(ExperimentalPageCurlApi::class)
package eu.wewox.pagecurl.screens
import androidx.compose.animation.core.animateDpAsState
import androidx.compose.foundation.horizontalScroll
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.Button
import androidx.compose.material.Card
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.center
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.toOffset
import eu.wewox.pagecurl.ExperimentalPageCurlApi
import eu.wewox.pagecurl.HowToPageData
import eu.wewox.pagecurl.components.HowToPage
import eu.wewox.pagecurl.components.ZoomOutLayout
import eu.wewox.pagecurl.config.InteractionConfig
import eu.wewox.pagecurl.config.PageCurlConfig
import eu.wewox.pagecurl.config.copy
import eu.wewox.pagecurl.page.PageCurl
import eu.wewox.pagecurl.page.PageCurlState
import eu.wewox.pagecurl.page.rememberPageCurlState
import eu.wewox.pagecurl.ui.SpacingLarge
import eu.wewox.pagecurl.ui.SpacingMedium
import kotlinx.coroutines.launch
@Composable
fun StatePageCurlScreen() {
Box(Modifier.fillMaxSize()) {
val pages = remember { HowToPageData.interactionHowToPages }
val state = rememberPageCurlState(max = pages.size)
var zoomOut by remember { mutableStateOf(false) }
val interactionConfig = remember {
InteractionConfig(
tap = InteractionConfig.Tap(
custom = InteractionConfig.Tap.CustomInteraction(true) { size, position ->
// When PageCurl is zoomed out then zoom back in
// Else detect tap somewhere in the center with 64 radius and zoom out a PageCurl
if (zoomOut) {
zoomOut = false
true
} else if ((position - size.center.toOffset()).getDistance() < 64.dp.toPx()) {
zoomOut = true
true
} else {
false
}
}
)
)
}
ZoomOutLayout(
zoomOut = zoomOut,
bottom = { SettingsRow(state) }
) {
// Animate radius and elevation with the same value, because we not :)
val cornersAndElevation by animateDpAsState(if (zoomOut) 16.dp else 0.dp)
Card(
shape = RoundedCornerShape(cornersAndElevation),
elevation = cornersAndElevation,
) {
PageCurl(
state = state,
config = PageCurlConfig(
interaction = interactionConfig.copy(
dragForwardEnabled = !zoomOut,
dragBackwardEnabled = !zoomOut,
tapForwardEnabled = !zoomOut,
tapBackwardEnabled = !zoomOut,
)
)
) { index ->
HowToPage(index, pages[index])
}
}
}
}
}
@Composable
private fun SettingsRow(
state: PageCurlState,
modifier: Modifier = Modifier
) {
Row(
horizontalArrangement = Arrangement.spacedBy(SpacingMedium, Alignment.CenterHorizontally),
modifier = modifier
.horizontalScroll(rememberScrollState())
.fillMaxWidth()
.padding(SpacingLarge)
) {
SettingsRowButton("Snap to first") {
state.snapTo(0)
}
SettingsRowButton("Snap to last") {
state.snapTo(state.max)
}
SettingsRowButton("Snap forward") {
state.snapTo(state.current + 1)
}
SettingsRowButton("Snap backward") {
state.snapTo(state.current - 1)
}
SettingsRowButton("Animate forward") {
state.next()
}
SettingsRowButton("Animate backward") {
state.prev()
}
}
}
@Composable
private fun SettingsRowButton(
text: String,
modifier: Modifier = Modifier,
onClick: suspend () -> Unit,
) {
val scope = rememberCoroutineScope()
Button(
onClick = { scope.launch { onClick() } },
modifier = modifier
) {
Text(text = text)
}
}