Compose Unstyled 2.0 is out! Check the official announcement blog ->
Function

FlexConfig

Combine two FlexConfig objects together.

FlexConfigCombineSample

@OptIn(ExperimentalFlexBoxApi::class)
@Composable
fun FlexConfigCombineSample() {
    // Shared design system item style tokens
    val SharedItemDefaults = FlexConfig {
        shrink(1f)
        basis(FlexBasis.Auto)
    }
    // Individual special-case item overrides
    val GrowPriority = FlexConfig { grow(2f) }
    val CenterAlignmentOverride = FlexConfig { alignSelf(FlexAlignSelf.Center) }
    // Construct optimized configurations via combination APIs
    val FlexibleHeroItem = SharedItemDefaults then GrowPriority then CenterAlignmentOverride
    val StandardFlexibleItem = FlexConfig(SharedItemDefaults, GrowPriority)
    // An empty call returns the identity element cleanly
    val EmptyFlexExtension = FlexConfig()
    FlexBox(modifier = Modifier.fillMaxWidth().height(120.dp)) {
        // Applies premium combined config with extensions
        Box(
            Modifier.height(60.dp)
                .background(Color.Cyan)
                .flex(FlexibleHeroItem then EmptyFlexExtension)
        )
        Box(Modifier.height(60.dp).background(Color.Yellow).flex(StandardFlexibleItem))
    }
}

Last updated: