Manual Vbox Example
An example which demonstrates the manual specification of a vbox
.
This example demonstrates how one would manually define the constraints
for a vbox
style layout. In fact, the vbox
layout helper generates
the primitive constraints in a fashion very similar to this example.
The intent of this example is to demonstrate that all of the layout
helper functions can be distilled down to a list of primitive
constraints.
Tip
To see this example in action, download it from
manual_vbox
and run:
$ enaml-run manual_vbox.enaml
Screenshot

Example Enaml Code
#------------------------------------------------------------------------------
# Copyright (c) 2013-2024, Nucleic Development Team.
#
# Distributed under the terms of the Modified BSD License.
#
# The full license is in the file LICENSE, distributed with this software.
#------------------------------------------------------------------------------
""" An example which demonstrates the manual specification of a `vbox`.
This example demonstrates how one would manually define the constraints
for a `vbox` style layout. In fact, the `vbox` layout helper generates
the primitive constraints in a fashion very similar to this example.
The intent of this example is to demonstrate that all of the layout
helper functions can be distilled down to a list of primitive
constraints.
<< autodoc-me >>
"""
from enaml.widgets.api import Window, Container, PushButton
enamldef Main(Window):
Container:
constraints = [
# Vertical Constraints
contents_top == pb1.top,
pb1.bottom + 10 == pb2.top,
pb2.bottom + 10 == pb3.top,
pb3.bottom == contents_bottom,
# Horizontal Constraints
(contents_left == pb1.left) | 'medium',
(contents_left == pb2.left) | 'medium',
(contents_left == pb3.left) | 'medium',
(pb1.right == contents_right) | 'medium',
(pb2.right == contents_right) | 'medium',
(pb3.right == contents_right) | 'medium',
]
PushButton: pb1:
text = 'Spam'
PushButton: pb2:
text = 'Long Name Foo'
PushButton: pb3:
text = 'Bar'