@Preview

@Preview

golden image testing facilities

drawImage(imageResource(R.drawable.baseline_menu_white_18dp)
        , Offset(midX, midY), Paint().apply { color = Color(25, 138, 128) })

drawImage

Functions which invoke @Composable functions must be marked with the @Composable annotation

SomeComposable(modifier = Modifier.withAmbients(FooAmbient provides foo)) { … }

setContent {
            val (mode, setMode) = state { lightColorPalette() }
            MaterialTheme(mode) {
                Button(onClick = { setMode(if (mode.isLight) darkColorPalette() else lightColorPalette()) }) {
                    Text(text = "button")
                }
            }
        }

stateFor

id

Canvas

override fun onDraw(canvas: Canvas?) {
        super.onDraw(canvas)
        calculatePropagation()
        canvas?.let { render() }
        postInvalidateDelayed(20)
    }

dev05

*val* position = _state_ *{* _SliderPosition_(valueRange = sliderRange, initial = range.*first*.toFloat(), steps = 9) }

//Unresolved: ...

TextField(
    value = value,
    onValueChange = onValueChange,
    textStyle = editorStyle,
    imeAction = ImeAction.Search,
    keyboardType = keyboardType,
    onImeActionPerformed = {
        onSearchClick()
    },
    onFocus = {
        println("focus called >>>>")
        onSearchChanged(R.drawable.ic_baseline_arrow_back_24)
    },
    onBlur = {
        println("blur called >>>>")
    }
)

blur called >>>>

MutableState

@Composable
fun ButtonRow() {
    Row {
        val padding = Modifier.padding(12.dp)
        Button(onClick = {  }, modifier = padding) {
            Text(text = "Ok")
        }
        Button(onClick = {  }, modifier = padding) {
            Text(text = "Subtract")
        }
    }
}

Ok

Color(0.0, 1.0, 0.0, 1.0, sRGB IEC61966-2.1)

Color(1.0, 0.0, 0.0, 1.0, sRGB IEC61966-2.1)

@Composable
fun SingleValueAnimationDemo() {
    val enabled = state { true }
    Clickable({ enabled.value = !enabled.value }) {
        val color = animate(if (enabled.value) Color.Green else Color.Red)
        Box(Modifier.fillMaxSize(), backgroundColor = color)
    }
}

@Compose

TabRow

VerticalScroller

@Composable
fun TextTabs() {
    var state by state { 0 }
    val titles = listOf("TAB 1", "TAB 2", "TAB 3 WITH LOTS OF TEXT")
    VerticalScroller {
        Column {
            TabRow(items = titles, selectedIndex = state) { index, text ->
                Tab(text = { Text(text) }, selected = state == index, onSelected = { state = index })
            }
            Text(
                    modifier = Modifier.gravity(ColumnAlign.Center),
                    text = "Text tab ${state + 1} selected",
                    style = MaterialTheme.typography.body1
            )
        }
    }
}