forked from cl3m/multiplatform-compose
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
11 changed files
with
227 additions
and
26 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,4 +1,3 @@ | ||
org.gradle.jvmargs=-Xmx4096M | ||
kotlin.code.style=official | ||
xcodeproj=./iosApp | ||
android.useAndroidX=true | ||
|
23 changes: 23 additions & 0 deletions
23
multiplatform-compose/src/androidMain/kotlin/com/rouge41/kmm/compose/AlertDialog.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
package com.rouge41.kmm.compose | ||
|
||
import androidx.compose.material.contentColorFor | ||
import androidx.compose.material.AlertDialog as _AlertDialog | ||
|
||
actual typealias DialogProperties = androidx.compose.ui.window.DialogProperties | ||
|
||
@Composable | ||
@Suppress("ACTUAL_FUNCTION_WITH_DEFAULT_ARGUMENTS") | ||
actual fun AlertDialog( | ||
onDismissRequest: () -> Unit, | ||
confirmButton: @Composable () -> Unit, | ||
modifier: Modifier = Modifier, | ||
dismissButton: @Composable (() -> Unit)? = null, | ||
title: @Composable (() -> Unit)? = null, | ||
text: @Composable (() -> Unit)? = null, | ||
shape: Shape? = null, | ||
backgroundColor: Color? = null, | ||
contentColor: Color? = null, | ||
properties: DialogProperties? = null | ||
) = _AlertDialog(onDismissRequest = onDismissRequest, confirmButton = confirmButton, modifier = modifier, dismissButton = dismissButton, | ||
title = title, text = text, shape = shape ?: MaterialTheme.shapes.medium, backgroundColor = backgroundColor ?: MaterialTheme.colors.surface, | ||
contentColor = if (backgroundColor != null) contentColorFor(backgroundColor) else contentColorFor(MaterialTheme.colors.surface), properties = properties) |
17 changes: 17 additions & 0 deletions
17
multiplatform-compose/src/commonMain/kotlin/com/rouge41/kmm/compose/AlertDialog.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
package com.rouge41.kmm.compose | ||
|
||
expect interface DialogProperties | ||
|
||
@Composable | ||
expect fun AlertDialog( | ||
onDismissRequest: () -> Unit, | ||
confirmButton: @Composable () -> Unit, | ||
modifier: Modifier = Modifier, | ||
dismissButton: @Composable (() -> Unit)? = null, | ||
title: @Composable (() -> Unit)? = null, | ||
text: @Composable (() -> Unit)? = null, | ||
shape: Shape? = null, | ||
backgroundColor: Color? = null, | ||
contentColor: Color? = null, | ||
properties: DialogProperties? = null | ||
) |
51 changes: 51 additions & 0 deletions
51
multiplatform-compose/src/iosX64Main/kotlin/com/rouge41/kmm/compose/AlertDialog.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,51 @@ | ||
package com.rouge41.kmm.compose | ||
|
||
import platform.Foundation.NSLog | ||
import platform.UIKit.* | ||
|
||
actual interface DialogProperties | ||
|
||
@Composable | ||
actual fun AlertDialog( | ||
onDismissRequest: () -> Unit, | ||
confirmButton: @Composable () -> Unit, | ||
modifier: Modifier, | ||
dismissButton: @Composable (() -> Unit)?, | ||
title: @Composable (() -> Unit)?, | ||
text: @Composable (() -> Unit)?, | ||
shape: Shape?, | ||
backgroundColor: Color?, | ||
contentColor: Color?, | ||
properties: DialogProperties? | ||
) { | ||
val alertController = ComposeAlertController() | ||
addController(alertController) { | ||
dismissButton?.let { | ||
it.invoke() | ||
val onClick = alertController.onClick | ||
val action = UIAlertAction.actionWithTitle(alertController.text, 1) { onClick() } | ||
alertController.alert.addAction(action) | ||
} | ||
|
||
confirmButton.invoke() | ||
val onClick = alertController.onClick | ||
val action = UIAlertAction.actionWithTitle(alertController.text, 0) { onClick() } | ||
alertController.alert.addAction(action) | ||
title?.let { | ||
it() | ||
alertController.alert.title = alertController.text | ||
} | ||
text?.let { | ||
it() | ||
alertController.alert.message = alertController.text | ||
} | ||
} | ||
|
||
getCurrentController().presentViewController(alertController.alert, true) { } | ||
} | ||
|
||
class ComposeAlertController() : UIViewController(nibName = null, bundle = null) { | ||
var text = "" | ||
var onClick: () -> Unit = {} | ||
val alert = UIAlertController.alertControllerWithTitle(null, null, 1) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
97 changes: 97 additions & 0 deletions
97
test/src/commonMain/kotlin/com/rouge41/kmm/compose/test/demos/Alert.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,97 @@ | ||
package com.rouge41.kmm.compose.test.demos | ||
|
||
import com.rouge41.kmm.compose.* | ||
|
||
// FROM https://raw.githubusercontent.com/vinaygaba/Learn-Jetpack-Compose-By-Example/master/app/src/main/java/com/example/jetpackcompose/material/AlertDialogActivity.kt | ||
|
||
@Composable | ||
fun Alert() { | ||
Column { | ||
// Here, ClickableText is a @Composable function which is going to describe the | ||
// contents of this activity that will be rendered on the screen. | ||
ClickableText() | ||
} | ||
} | ||
|
||
|
||
// We represent a Composable function by annotating it with the @Composable annotation. Composable | ||
// functions can only be called from within the scope of other composable functions. We should | ||
// think of composable functions to be similar to lego blocks - each composable function is in turn | ||
// built up of smaller composable functions. | ||
@Composable | ||
fun ClickableText() { | ||
// Reacting to state changes is core to how Jetpack Compose works. This state variable "showPopup" | ||
// is used to control whether the popup should be shown. The value is toggled every time the | ||
// text "Click to see dialog" is clicked. Every time the value of this variable changes, | ||
// the relevant sub-composables that use showPopup are automatically recomposed. | ||
var variable by remember { mutableStateOf("not clicked") } | ||
var showPopup by remember { mutableStateOf(false) } | ||
// Column with clickable modifier wraps the child composable and enables it to react to a click | ||
// through the onClick callback similar to the onClick listener that we are accustomed to | ||
// on Android. | ||
// Here, we just change the value of showPopup to be true every time we click on the text that | ||
// says "Click to see Popup" | ||
Button(onClick = { showPopup = true }, content = { | ||
// The Text composable is pre-defined by the Compose UI library; you can use this | ||
// composable to render text on the screen | ||
Text( | ||
text = "Click to see dialog", modifier = Modifier.padding(16.dp), | ||
style = TextStyle( | ||
fontSize = 16.sp, | ||
fontFamily = FontFamily.Serif | ||
) | ||
) | ||
}) | ||
|
||
Text(if (showPopup) "ShowPopup = true" else "ShopPopup = false") | ||
Text(variable) | ||
|
||
// A lambda that toggles the showPopup value to off. We pass it to the onDismiss equivalent | ||
// callback of the AlertDialog. | ||
val onPopupDismissed = { showPopup = false } | ||
|
||
// We want to show the popup only if the showPopup variable is toggled to true. Since Jetpack | ||
// Compose uses the declarative way of programming, we can easily decide what needs to shows | ||
// vs hidden based on which branch of code is being executed. In this example, we display the | ||
// AlertDialog only when the showPopup variable is set to true or else this branch is not | ||
// executed at all and thus the alert dialog remains hidden. | ||
if (showPopup) { | ||
// Predefined composable provided by the material implementations of Jetpack Compose. It | ||
// shows a simple alert dialog on the screen if this code path is executed (i.e showPopup | ||
// variable is true) | ||
AlertDialog( | ||
onDismissRequest = onPopupDismissed, | ||
title = { | ||
Text("Confirmation") | ||
}, | ||
text = { | ||
Text("Congratulations! You just clicked the text successfully") | ||
}, | ||
dismissButton = { | ||
Button( | ||
onClick = { | ||
onPopupDismissed() | ||
variable = "Cancel clicked" | ||
} | ||
) { | ||
Text(text = "Cancel") | ||
} | ||
} | ||
,confirmButton = { | ||
// Button is a pre-defined Material Design implementation of a contained button - | ||
// https://material.io/design/components/buttons.html#contained-button. | ||
Button( | ||
onClick = { | ||
onPopupDismissed() | ||
variable = "Ok clicked" | ||
} | ||
) { | ||
// The Button composable allows you to provide child composables that inherit | ||
// this button functionality. | ||
// The Text composable is pre-defined by the Compose UI library; you can use this | ||
// composable to render text on the screen | ||
Text(text = "Ok") | ||
} | ||
}) | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters