Hi could someone help me with this compose "clicka...

# compose

[Tower Guidev2]

Hi could someone help me with this compose "clickable" issue

[Tower Guidev2]

i have a clickable row as follow

Row(
    modifier = Modifier
        .clickable(interactionSource = interactionSource, indication = null, role = Role.Switch) {
            onLabelClick()
        }
        .background(if (isSelected) colorResource(id = R.color.color_background_selection_gray_transparent) else Color.Transparent)
        .fillMaxWidth()
        .padding(10.dp),
    verticalAlignment = Alignment.CenterVertically
) {
    iconResId?.let { resId ->
        Image(
            painter = painterResource(id = resId),
            contentDescription = null,
            modifier = Modifier
                .size(24.dp)
                .padding(end = 8.dp)
        )
    }

    Text(fontSize = 16.sp, text = label, color = textColor, modifier = Modifier.weight(1f))
    Spacer(modifier = Modifier.padding(start = 8.dp))
    ToggleButton.Simple(
        modifier = Modifier,
        isChecked = isSwitchedOn,
        onCheckedChange = onSwitchChange
    )
}

the issue i have is with the

ToggleButton.Simple(
        modifier = Modifier,
        isChecked = isSwitchedOn,
        onCheckedChange = onSwitchChange
    )

inside the row as that is a toggle switch which is also clickable.
the problem is that the toggle switch does not respond to user clicks,
or it responds only after many repeated attempts to click on it
is it possible to have "nested" clickable components?

[Louis Pullen-Freilich [G]]

Nested click handling like this should work, yeah. Maybe the touch target for the toggle button is very small so it's hard to click?