为什么需要为 _createChildControlImpl() 构建的小部件添加外观别名?

why is needed add appearances aliases to widgets build by _createChildControlImpl()?

我正在通过另一个 TabView 中的 TabView 创建一些 UI 组合。 对于内幕 TabView 我添加了一个特定的选项卡,全部通过 _createChildControlImpl() 实现,

有些喜欢

qx.Class.define('rigel.view.Dashboard', {
    extend: qx.ui.container.Composite,

    construct: function(layout) {
        this.base(arguments, layout);
        this.add(this.getChildControl("container"), {edge: 'center'});
    },

    // overridden
    _createChildControlImpl: function(id, hash) {
        var control;

        switch (id) {
            case "container":
                control = new my.view.tabview.ResourcesCat();
                break;
...

qx.Class.define('my.view.tabview.ResourcesCat', {
    extend: qx.ui.tabview.TabView,

    _createChildControlImpl: function(id, hash) {
        var control;

        switch(id) {
            case "static":
                control = new qx.ui.tabview.Page('', 'icon.png');
                this.add(control);

我这样做是为了在某些情况下设置 TabPage。

无论如何,我不明白为什么对于 _createChildControlImpl 构建的每个小部件,如果我不想更改任何主题,我必须为外观添加别名。

所以我有

"widget/tabview": "tabview",
"tabview/static": "tabview-page",
"tabview/static/tab-name": "tabview-page",

我会更喜欢一些方法来避免为每个小部件添加外观别名,并将构造保留在 _createChildControlImpl.

谢谢。

_createChildControlImpl 专为 UI 组件而设计,这些组件构成主要小部件的一部分 - 例如,TabView 具有子控件,它们是按钮栏和用于保存页面的组合;一个页面有一个选项卡按钮;一个按钮有一个用于图标的子控件和另一个用于标签的子控件;等等

对于所有这些 "child controls",它们的样式通常是父 小部件 样式的重要组成部分,这就是外观支持 [=25= 这样的路径的原因] 或 "button/label".

这可能有点令人困惑,因为 "child control" 只是另一个小部件,但保持区别很重要,尤其是在涉及主题时。

在您的示例中,"static" 和 "container" 小部件根本不应实例化为子控件 - 例如,您可以将它们初始化为构造函数中的成员变量:

qx.Class.define('rigel.view.Dashboard', {
    extend: qx.ui.container.Composite,

    construct: function(layout) {
        this.base(arguments, layout);
        this.__container = new my.view.tabview.ResourcesCat();
        this.add(this.__container, {edge: 'center'});
    },

qx.Class.define('my.view.tabview.ResourcesCat', {
    extend: qx.ui.tabview.TabView,

    construct: function() {
        this.base(arguments);
        this.__static = new qx.ui.tabview.Page('', 'icon.png');
        this.add(this.__static);
    }