Inschrijfformulier

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun InschrijfFormulier() {

var naamKind by remember { mutableStateOf(“”) }
var geboortedatum by remember { mutableStateOf(“”) }
var telefoon by remember { mutableStateOf(“”) }
var cursus by remember { mutableStateOf(“”) }
var akkoord by remember { mutableStateOf(false) }
var bekendVan by remember { mutableStateOf(“”) }

val cursusOpties = listOf(
“Art Playground (2–4 jaar)”,
“Art Factory (5–7 jaar)”,
“Art Lab (7–12 jaar)”,
“Art Academy (8–16 jaar)”
)

val bekendVanOpties = listOf(
“Website”,
“Social media”,
“Vrienden / familie”,
“School”,
“Anders”
)

val isGeldig =
naamKind.isNotBlank() &&
geboortedatum.isNotBlank() &&
telefoon.isNotBlank() &&
cursus.isNotBlank() &&
bekendVan.isNotBlank() &&
akkoord

Column(
modifier = Modifier
.fillMaxSize()
.padding(16.dp),
verticalArrangement = Arrangement.spacedBy(12.dp)
) {

Text(
text = “Inschrijving”,
style = MaterialTheme.typography.headlineMedium
)

// Naam kind
OutlinedTextField(
value = naamKind,
onValueChange = { naamKind = it },
label = { Text(“Naam kind”) },
modifier = Modifier.fillMaxWidth()
)

// Geboortedatum
DatePickerField(
label = “Geboortedatum”,
value = geboortedatum,
onDateSelected = { geboortedatum = it }
)

// Telefoonnummer
OutlinedTextField(
value = telefoon,
onValueChange = { telefoon = it },
label = { Text(“Telefoonnummer”) },
keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Phone),
modifier = Modifier.fillMaxWidth()
)

// Cursus dropdown
DropdownField(
label = “Cursus”,
options = cursusOpties,
selected = cursus,
onSelected = { cursus = it }
)

// Algemene voorwaarden
Row(verticalAlignment = Alignment.CenterVertically) {
Checkbox(
checked = akkoord,
onCheckedChange = { akkoord = it }
)

ClickableText(
text = AnnotatedString(
“Ik ga akkoord met de algemene voorwaarden\nwww.sk-kunsteducatie.com”
),
style = MaterialTheme.typography.bodySmall,
onClick = {
// hier kun je een browser intent openen
}
)
}

// Bekend van
DropdownField(
label = “Waar ken je SK-Kunsteducatie van?”,
options = bekendVanOpties,
selected = bekendVan,
onSelected = { bekendVan = it }
)

// Inschrijfknop
Button(
onClick = {
// Verwerk inschrijving
},
enabled = isGeldig,
modifier = Modifier.fillMaxWidth()
) {
Text(“Inschrijven”)
}
}
}