Flippable

fun Flippable(frontSide: @Composable () -> Unit, backSide: @Composable () -> Unit, flipController: FlippableController, modifier: Modifier = Modifier, contentAlignment: Alignment = Alignment.Center, flipDurationMs: Int = 400, flipOnTouch: Boolean = true, flipEnabled: Boolean = true, autoFlip: Boolean = false, autoFlipDurationMs: Int = 1000, cameraDistance: Float = 30.0f, flipAnimationType: FlipAnimationType = FlipAnimationType.HORIZONTAL_CLOCKWISE, onFlippedListener: (currentSide: FlippableState) -> Unit = { _, -> })

A composable which creates a card-like flip view for frontSide and backSide composables.

Example usage:

Flippable(
frontSide = {
// Composable content
},
backSide = {
// Composable content
}),
flipController = rememberFlipController(),
// ... other optional parameters

Author

Wajahat Karim (https://wajahatkarim.com)

Parameters

frontSide

Composable method to draw any view for the front side

backSide

Composable method to draw any view for the back side

flipController

A FlippableController which lets you control flipping programmatically.

modifier

The Modifier for this Flippable

contentAlignment

The Flippable is contained in a Box, so this tells the alignment to organize both Front and Back side composable.

flipDurationMs

The duration in Milliseconds for the flipping animation

flipOnTouch

If true, flipping will be done through clicking the Front/Back sides.

flipEnabled

Enable/Disable the Flipping animation.

autoFlip

If true, the Flippable will automatically flip back after autoFlipDurationMs.

autoFlipDurationMs

The duration in Milliseconds to auto-flip back

cameraDistance

The GraphicsLayerScope.cameraDistance for the flip animation. Sets the distance along the Z axis (orthogonal to the X/Y plane on which layers are drawn) from the camera to this layer.

flipAnimationType

The animation type of flipping effect.

onFlippedListener

The listener which is triggered when flipping animation is finished.