Is there any difference between `@Composable() () ...

# compose

[amar_1995]

Is there any difference between @Composable() () -> Unit and () -> Unit function signature.
I am using AlertDialog and in documenation (https://developer.android.com/reference/kotlin/androidx/ui/material/package-summary#alertdialog) the function signature is different then in code.
In documentation it is:

@Composable fun AlertDialog(
    onCloseRequest: () -> Unit, 
    title: () -> Unit = null, 
    text: () -> Unit, 
    confirmButton: () -> Unit, 
    dismissButton: () -> Unit = null, 
    buttonLayout: AlertDialogButtonLayout = AlertDialogButtonLayout.SideBySide): Unit

In dev3 code it is:

@Composable
fun AlertDialog(
    onCloseRequest: () -> Unit,
    title: @Composable() (() -> Unit)? = null,
    text: @Composable() () -> Unit,
    confirmButton: @Composable() () -> Unit,
    dismissButton: @Composable() (() -> Unit)? = null,
    buttonLayout: AlertDialogButtonLayout = AlertDialogButtonLayout.SideBySide
) : Unit

[amar_1995]

I am using AlertDialog inside navigation drawer and getting exception java.lang.IllegalStateException: Composition requires an active composition context .
My code:

Clickable(onClick = {
                                    val isOpen = +state { true }
         
                                    if(isOpen.value) {
                                    AlertDialog(onCloseRequest = {isOpen.value = !isOpen.value}, text = {Text("Hello World!!!")}) {
                                        Button(
                                            text = "CLOSE",
                                            style = TextButtonStyle(),
                                            onClick = { isOpen.value = !isOpen.value }
                                        )
                                        }
                                    }
                                }) {.... }

This code is written inside the ModelDrawerLayout drawerContent function

[curioustechizen]

I don't know about the specific difference between the docs and code; however ...

Adding @Composable to a function effectively changes the signature of the function. @Composable fun Foo() is not compatible with fun Foo() and it is a compile error to pass one where another is expected.

It is similar to how adding suspend modifier changes the signature of a function

[amar_1995]

@curioustechizen Yes @Composable function cannot be call inside of normal function else it will throw Composition requires an active composition context exception.
But, I don't know why i am getting that error, when I am using AlertDialog inside ModelDrawerLayout.
And why there is difference in function signature in code and docs.

[msink]

I think because this bug was fixed after dev3 release

[Marc Knaup]

The Android documentation is quite broken here.

dismissButton: () -> Unit = null

That isn’t even valid as the type isn’t nullable.

And the Android documentation should indeed use @Composable here. The dev3 code that you’ve pasted is correct.

@Composable () -> Unit makes it clear that another child component is expected (composed) - i.e. it’s not a callback/handler.

[amar_1995]

Okay, But I don't why I am getting exception while using AlertDialog inside ModelDrawerLayout

Clickable(onClick = {
	val isOpen = +state { true }
	// todo some alert box with field
	if(isOpen.value) {
	AlertDialog(onCloseRequest = {isOpen.value = !isOpen.value}, text = {Text("Hello World!!!")}) {
		Button(
			text = "CLOSE",
			style = TextButtonStyle(),
			onClick = { isOpen.value = !isOpen.value }
		)
		}
	}
}) {
	Container(width = 20.dp, height = 20.dp) {
		DrawImage(image = +imageResource(R.drawable.image_add))
	} 
}

[Marc Knaup]

Because you’re creating the AlertDialog inside an onClick listener which is not allowed. You must create the AlertDialog in the same context where you create the Clickable and all other components, likely in setContent {} of your Activity or something similar.

[Marc Knaup]

Here’s a good example: https://medium.com/mindorks/alertdialog-jetpack-compose-f16887f0d1c4

[Marc Knaup]

I see how this is confusing, because some lambdas are composable while some aren’t, and it’s not immediately obvious in what kind of context you are.

[amar_1995]

Yeah, I got it.
But why onClick is not composable ?

[Marc Knaup]

Composable functions are all called at the same time to compose the complete UI.

onClick is called much later when the UI was already composed (when the user clicked the button).
So you change the state using isOpen.value = true which tells Android to compose the whole UI again and the cycle repeats (compose whole UI again - which happens after onClick is done already).

[amar_1995]

Got it,
Thanks