We have to put `@Composable` on onClick lambdas now?? ugh…

# compose

[codeslubber]

We have to put @Composable on onClick lambdas now?? ugh…

[Ryan Mentley]

You should not be putting @Composable on onClick lambdas, what makes you say that?

[Ryan Mentley]

they're not composable

[codeslubber]

[codeslubber]

and clicking that first error goes here:

Button(text = "Select", onClick = {
    showDialog.value = true
    })

[Ryan Mentley]

Compiles just fine for me:

[Ryan Mentley]

are you sure that the parent isn't the one missing @Composable, and it's flagging it on the Button call because that's a composable function call?

[codeslubber]

it told me to make the val @Composable as well

[Ryan Mentley]

can you show me the whole context?

[codeslubber]

Looks like, if you put the var outside the Composable, then you get this error

[codeslubber]

I put it outside because I have a method for showing the dialog, which has to look at the same flag…

[codeslubber]

package com.example.surveys_android

import android.app.DatePickerDialog
import android.util.Log
import androidx.compose.Composable
import androidx.compose.ambient
import androidx.compose.state
import androidx.ui.core.ContextAmbient
import androidx.ui.core.Text
import androidx.ui.foundation.shape.corner.RoundedCornerShape
import androidx.ui.layout.Column
import androidx.ui.layout.LayoutHeight
import androidx.ui.layout.Spacer
import androidx.ui.layout.Spacing
import androidx.ui.material.Button
import androidx.ui.material.surface.Card
import androidx.ui.tooling.preview.Preview
import androidx.ui.unit.dp
import java.time.LocalDate

val logTag = "DATEPICKER"

@Composable
fun DateQuestionView() {

    val showDialog  = state{
        false
    }

    val context = ambient(ContextAmbient)

    Card(shape = RoundedCornerShape(8.dp)) {
        Column(modifier = Spacing(16.dp)) {
            Text("When were you diagnosed as Prediabetic?", style = typography.h6)
            Spacer(LayoutHeight(16.dp))
            Text(LocalDate.now().toString())
            Button(text = "Select", onClick = {
                showDialog.value = true
                })
            showDatePicker()
        }
    }

}

@Composable
fun showDatePicker() {
    if (showDialog.value){
        Log.d(logTag, "inside dialog...")
        DatePickerDialog(
            context,
            DatePickerDialog.OnDateSetListener { view, year, month, day ->
                Log.d("DEBUG", "inside onDateSetListener..")
            },
            2020,
            0,
            1
        ).show()
    }
}

@Preview
@Composable
fun DateQuestionsPreview() {
    DateQuestionView()
}

[codeslubber]

this is not compiling now because I moved the flag inside the first Composable.. all other question types where it’s inside compile, where it’s outside, do not..

[codeslubber]

(needs the context as well of course, and this was working in dev03 )

[Ryan Mentley]

that is an interesting hack with DatePickerDialog. That's not guaranteed to do what you want, since you're mixing imperative code into composition (for instance, recomposition might cause it to get executed twice). But it should mostly work.

[codeslubber]

it was working fine, though I could not get NumberPicker to work in a dialog.. in the case of the latter, rewriting it with Compose is a lot less work 🙂

[codeslubber]

should I just give up on this and do a really dumb datepicker for now? (like a spinner with a bounded date range)?

[Ryan Mentley]

your code looks correct to me

[Ryan Mentley]

it looks correct to my compiler, too:

[Ryan Mentley]

(red flag on now() is an API-level check)

[Ryan Mentley]

(I'm testing against HEAD, not dev04, but it's pretty close)

[Ryan Mentley]

does it still throw the error when you actually compile?

[codeslubber]

lemme try and move it inline

[codeslubber]

yup that does compile!

[codeslubber]

so should I consider outside vars that 2 methods use no longer supported?

[codeslubber]

(thanks, btw, I LOVE compose.. assuming when the next release makes embeddable views possible some of this will get easier…)

[Ryan Mentley]

No problem! I had just moved it inline as the quickest way to make it compile. outside vars that are used by multiple methods should work, but I'd have to see an exact example to understand why it's not working for you - there are some subtleties, like you can't call state { ... } directly outside of composition, but you can ( think) call mutableStateOf(...)

[codeslubber]

it was working in 03, yeah I inlined everything including repeating the typography var, but hey it works.. (that does)…