SampleRow.kt

import androidx.compose.Composable
import androidx.ui.core.Modifier
import androidx.ui.core.tag
import androidx.ui.foundation.Text
import androidx.ui.foundation.drawBackground
import androidx.ui.graphics.Color
import androidx.ui.layout.ConstraintLayout
import androidx.ui.layout.ConstraintSet
import androidx.ui.layout.fillMaxWidth
import androidx.ui.layout.padding
import androidx.ui.material.MaterialTheme
import androidx.ui.material.Switch
import androidx.ui.tooling.preview.Preview
import androidx.ui.unit.dp

sealed class Tag
private object TimeTag : Tag()
private object WeekDaysTag : Tag()
private object SwitchTag : Tag()
private object SubtextTag : Tag()

@Composable
fun SampleRow() {
  ConstraintLayout(
    modifier = Modifier.drawBackground(color = Color.White) +
      Modifier.fillMaxWidth() +
      Modifier.padding(8.dp),
    constraintSet = ConstraintSet {
      val subText = tag(SubtextTag)
      val switch = tag(SwitchTag)
      val timeText = tag(TimeTag)
      val weekDaysText = tag(WeekDaysTag)

      switch.apply {
        top constrainTo parent.top
        right constrainTo parent.right
        left constrainTo subText.left
        bottom constrainTo subText.top
      }

      timeText.apply {
        top constrainTo parent.top
        left constrainTo parent.left
        right constrainTo switch.left
        width = spread
      }

      weekDaysText.apply {
        top constrainTo timeText.bottom
        left constrainTo parent.left
        right constrainTo switch.left
        bottom constrainTo parent.bottom
        width = spread
      }

      subText.apply {
        top constrainTo switch.bottom
        right constrainTo parent.right
        bottom constrainTo parent.bottom
      }
    }) {

    Text(
      "08:30",
      style = MaterialTheme.typography.h4,
      modifier = Modifier.tag(TimeTag)
    )

    Text(
      "Mon, Tue, Wed, Thu, Fri",
      color = Color.Gray,
      style = MaterialTheme.typography.subtitle1,
      modifier = Modifier.padding(top = 8.dp) + Modifier.tag(WeekDaysTag)
    )

    Switch(
      modifier = Modifier.tag(SwitchTag),
      checked = true,
      onCheckedChange = {}
    )

    Text(
      "Text",
      style = MaterialTheme.typography.body1,
      modifier = Modifier.tag(SubtextTag)
    )
  }
}

@Preview
@Composable
fun DefaultPreview() {
  MaterialTheme {
    SampleRow()
  }
}