android-jetpack-composepaddinguiswitch

Jetpack compose Internal Padding


Is there an easy way to remove the switch's internal padding in compose?

I tried supplying a 0.dp in its modifier but it doesn't get rid of the internal paddings

 Switch(
      modifier = Modifier
           .padding(0.dp)
           .background(Color.Red), // just to show the internal box paddding
      checked = true,
      onCheckedChange = { }
 )

Switch


Solution

  • Composables such as Switch, CheckBox, RadioButton, Button, Slider and others i can't recall at the moment have minimum 48.dp size because of minimum touch target for accessibility.

    You can remove it with CompositionLocalProvider

    CompositionLocalProvider(LocalMinimumInteractiveComponentEnforcement provides false) {
        Switch(
            modifier = Modifier
                .padding(0.dp)
                .background(Color.Red), 
            checked = true,
            onCheckedChange = { }
        )
    }