FlexItemContext

@ExperimentalCoroutinesApi()
class FlexItemContext(styleParams: StyleParams, selfAlignment: SelfAlignment, target: StringBuilder) : StyleParams, SelfAlignment

This context interface offers functions to style elements of a flex layout.

It does not configure the flex template / container itself. This should be done by Flexbox functions!

This interface offers all the inherited functions of SelfAlignment that corresponds to the CSS alignment module.

This class offers functions to set the order of appearance, the growth, the shrinking and the initial size.

This enables the definition of a layout item like this:

flex {
order { 2 } // element will appear after those with _lower_ values, independently of the position within the
// DOM-Node!
grow { 1 } // factor of growth
shrink { 1 } // factor of shrinking
basis { "10em" } // width of the element
}

Parameters

styleParams

basic context scope interface

selfAlignment

common alignment functions for child elements

target

the defined output StringBuilder to write the generated CSS into

Constructors

FlexItemContext
Link copied to clipboard
fun FlexItemContext(styleParams: StyleParams, selfAlignment: SelfAlignment, target: StringBuilder)
basic context scope interface

Functions

alignSelf
Link copied to clipboard
open override fun alignSelf(value: SelfAlignItemsValues.() -> SelfAlignItemProperty)
This function sets the self-align propertyExample call:
self-align { flexStart }
basis
Link copied to clipboard
fun basis(value: FlexBasisValues.() -> FlexBasisProperty)
This function sets the flex-basis CSS property.
grow
Link copied to clipboard
fun grow(value: () -> Property)
This function sets the flex-grow CSS property.
order
Link copied to clipboard
fun order(value: () -> Property)
This function sets the order CSS property.
shrink
Link copied to clipboard
fun shrink(value: () -> Property)
This function sets the flex-shrink CSS property.

Properties

lgProperties
Link copied to clipboard
open override val lgProperties: StringBuilder
collects the properties for large screens
mdProperties
Link copied to clipboard
open override val mdProperties: StringBuilder
collects the properties for middle-sized screens
smProperties
Link copied to clipboard
open override val smProperties: StringBuilder
collects the properties for small screens
xlProperties
Link copied to clipboard
open override val xlProperties: StringBuilder
collects the properties for extra-large screens