flex

type AlignContent ¶

type AlignContent uint8

AlignContent is the 'align-content' property. It aligns container lines when there is extra space on the cross-axis.

https://www.w3.org/TR/css-flexbox-1/#align-content-property

const (
	AlignContentStretch AlignContent = iota
	AlignContentStart
	AlignContentEnd
	AlignContentCenter
	AlignContentSpaceBetween
	AlignContentSpaceAround
)

type AlignItem ¶

type AlignItem uint8

AlignItem aligns items along the cross axis.

It is the 'align-items' property when applied to a Flex container, and the 'align-self' property when applied to an item in LayoutData.

https://www.w3.org/TR/css-flexbox-1/#align-items-property https://www.w3.org/TR/css-flexbox-1/#propdef-align-self

const (
	AlignItemAuto AlignItem = iota
	AlignItemStart
	AlignItemEnd
	AlignItemCenter
	AlignItemBaseline // TODO requires introducing inline-axis concept
	AlignItemStretch
)

type Basis ¶

type Basis uint8

Basis sets the base size of a flex item.

A default basis of Auto means the flex container uses the MeasuredSize of an item. Otherwise a Definite Basis will override the MeasuredSize with BasisPx.

TODO: do we (or will we )have a useful notion of Content in the widget layout model that is separate from MeasuredSize? If not, we could consider completely removing this concept from this flex implementation.

const (
	Auto Basis = iota
	Definite
)

type Direction ¶

type Direction uint8

Direction is the direction in which flex items are laid out.

https://www.w3.org/TR/css-flexbox-1/#flex-direction-property

const (
	Row Direction = iota
	RowReverse
	Column
	ColumnReverse
)

type Flex ¶

type Flex struct {
	node.ContainerEmbed

	Direction    Direction
	Wrap         FlexWrap
	Justify      Justify
	AlignItems   AlignItem
	AlignContent AlignContent
}

Flex is a container widget that lays out its children following the CSS flexbox algorithm.

func NewFlex(children ...node.Node) *Flex

func (w *Flex) Layout(t *theme.Theme)

func (w *Flex) Measure(t *theme.Theme, widthHint, heightHint int)

type FlexWrap ¶

type FlexWrap uint8

FlexWrap controls whether the container is single- or multi-line, and the direction in which the lines are laid out.

https://www.w3.org/TR/css-flexbox-1/#flex-wrap-property

const (
	NoWrap FlexWrap = iota
	Wrap
	WrapReverse
)

type Justify ¶

type Justify uint8

Justify aligns items along the main axis.

https://www.w3.org/TR/css-flexbox-1/#justify-content-property

const (
	JustifyStart        Justify = iota // pack to start of line
	JustifyEnd                         // pack to end of line
	JustifyCenter                      // pack to center of line
	JustifySpaceBetween                // even spacing
	JustifySpaceAround                 // even spacing, half-size on each end
)

type LayoutData ¶

type LayoutData struct {
	MinSize image.Point  // TODO use unit.Value
	MaxSize *image.Point // TODO use unit.Value

	// Grow determines how much a node will grow relative to its siblings.
	Grow float64

	// Shrink is the flex shrink factor which determines how much a node
	// will shrink relative to its siblings. If nil, a default shrink
	// factor of 1 is used.
	Shrink *float64

	// Basis determines the initial size of the node in the direction
	// of the flex container (the main axis).
	//
	// If set to Definite, the value stored in BasisPx is used.
	Basis   Basis
	BasisPx int // TODO use unit package?

	Align AlignItem

	// BreakAfter forces the next node onto the next flex line.
	BreakAfter bool
}

LayoutData is the node LayoutData type for a Flex's children.