Overview

stretchable uses nodes to represent rectangular blocks or containers, each of which optionally can contain any number of child nodes.

For each node you can define styles according to Flexbox and/or CSS Grid. These define the requirements for the layout of the nodes.

You can assign custom measure functions to nodes. Such functions are used by stretchable during the computation of the node layout, to be able to determine the appropriate dimensions of the node.

Building a tree of nodes and calculating the layout is as simple as:

from stretchable import Edge, Node
from stretchable.style import AUTO, PCT

# Build node tree
root = Node(
    margin=20,
    size=(500, 300),
).add(
    Node(border=5, size=(50 * PCT, AUTO)),
    Node(key="child", padding=10 * PCT, size=50 * PCT),
)

# Compute layout
root.compute_layout()

# Get the second of the child nodes
child_node = root.find("/child")
content_box = child_node.get_box(Edge.CONTENT)
print(content_box)
# Box(x=300.0, y=50.0, width=150.0, height=50.0)

There are several different ways of building the node tree, configuring styles, and locating nodes. See stretchable by Example for a more in-depth tour of the features of stretchable.