如何制作自定义容器？

Question

我想做一个可以重复使用的容器，里面有个标题，就像横幅示例那样。
（所以它就像一个自定义的 GroupBox）。我添加到这个类的每个元素都应该放到这个类的子容器里，而不是直接放到这个类里。请看下面的代码，我标记了我只想写子元素的位置。

from enaml.widgets.api import *
from enaml.layout.api import *
from enaml.styling import *

enamldef BannerSheet(StyleSheet):
    Style:
        element = 'Label'
        style_class = 'banner'
        Setter:
            field = 'background'
            value = ('lineargradient(x1: 0, y1:0, x2:0, y2:1, '
                        'stop: 0 #222222, stop: 0.5 #1A1A1A, stop: 1 #111111)')
        Setter:
            field = 'color'
            value = '#FFFFEF'
        Setter:
            field = 'padding'
            value = '5px'
        Setter:
            field = 'font'
            value = '18pt Verdana'

enamldef Banner(Container):
    BannerSheet:
        pass
    padding = 0
    alias title : lbl.text
    constraints = [lbl.left == left, 
                   lbl.right == right, 
                   con.top == lbl.bottom,
                   con.bottom<=bottom]
    Label: lbl:
        name = 'abd'   
        style_class = 'banner'

    Container: con:
        pass


enamldef DemoContainer(Container):
    padding = 0
    Banner: b:
        title = 'Bar'
        #i want children here to be put into the banner.con container.
        #so e.g.
        Label:
             text = 'This should be below the title label"

Answer 1

Enaml不支持通过声明式语法来改变一个小部件在层级中的位置（不过你可以通过Include和过程代码来做到这一点）。最简单的办法是使用一个子容器放在横幅上，这个容器里面放着你的小部件。可以参考下面的例子：

from enaml.widgets.api import *


enamldef BannerContainer(Container):
    alias text: label.text
    Label: label:
        pass


enamldef Main(Window):
    Container:
        BannerContainer:
            text = 'First Banner'
            Container:
                padding = 0
                Field: pass
                Field: pass
                Field: pass
        BannerContainer:
            text = 'Second Banner'
            Container:
                padding = 0
                PushButton: pass
                PushButton: pass
                PushButton: pass

另外，你也可以创建一个容器的子类，并重新实现layout_constraints方法，这样就可以根据你的需求来布局（可以查看TaskDialog的实现作为例子），或者使用模板和编译时的循环来扩展子小部件（可以参考高级模板的例子）。