1

これは私が作成しようとしているウィジェットです。目標は、上部のラジオ ボタンによって制御される stackContainer を持つことです。

Dojo ドキュメントの例を試してみましたが、同じ誤った動作をします。

define(["dojo/ready",  "dojo/_base/declare", "dijit/_WidgetBase", "dojo/dom-construct", 
        "dojo/_base/lang", "dojo/on", "dojo/dom-attr", "dijit/form/RadioButton", 
        "dojo/dom-style", "dijit/layout/ContentPane", "dijit/layout/StackContainer", 
        "tcs/Log"], 
function(ready, declare, _WidgetBase, domConstruct, 
         lang, on, attr, RadioButton, 
         style, ContentPane, StackContainer, 
         log) {

    /**
     * @class
     * @name gijit.workflow.debug.combi
     */
    return declare("gijit.workflow.debug.combi", [_WidgetBase], {
        workflow : null,
        panes : null,
        width : "600px",
        height : "400px",

        _beforeCall : function(d) {
            alert("beforeCall");
        },

        buildRendering : function() {
            this.domNode = domConstruct.create("div", {id:"myform"});
            var contain = domConstruct.create("div", null, this.domNode, "last");
            var stackContainer = new StackContainer({
                style: "height: " + this.height + "; width: " + this.width + "; border: 0px solid red"
            }, contain);
            var buttons = domConstruct.create("form", null, this.domNode, "first");
            for(var i=0; i<this.panes.length; i++){
                var contentPane = new ContentPane({
                    id : this.panes[i].title,
                    title : this.panes[i].title,
                    content : this.panes[i].content
                })
                stackContainer.addChild(contentPane);

                var buttonDiv = domConstruct.create("span", null, buttons, "last");
                style.set(buttonDiv, "display", "inline-block");
                style.set(buttonDiv, "margin", "10px");

                var label = domConstruct.create("div", {innerHTML: this.panes[i].title}, buttonDiv, "last");

                if(i==0){
                    var RButton = new RadioButton({
                        title : this.panes[i].title,
                        showTitle : true,
                        checked : true,
                        value : this.panes[i].title, 
                        name : "options",
                        onClick : function(a){stackContainer.selectChild(a.explicitOriginalTarget.attributes.value.textContent)}
                    }).placeAt(buttonDiv);
                } else {
                    var RButton = new RadioButton({
                        title : this.panes[i].title,
                        showTitle : true,
                        checked : false,
                        value : this.panes[i].title,
                        name : "options",
                        onClick : function(a){stackContainer.selectChild(a.explicitOriginalTarget.attributes.value.textContent)}
                    }).placeAt(buttonDiv);
                }
                contentPane.resize();
                contentPane.startup();
            }
            stackContainer.startup();
                    //Hacks in attempt to get the stuff to show
            for(var i=0; i<stackContainer.getChildren().length; i++){
                stackContainer.getChildren()[i].startup();
                stackContainer.getChildren()[i].resize();
                if(typeof stackContainer.getChildren()[i].getChildren()[0] === 'object'){
                    stackContainer.getChildren()[i].getChildren()[0].startup(); 
                }
            }
            stackContainer.resize();
        },
    });
});

ほとんどの場合、それは機能します。しかし、何かを表示するには、ウィンドウのサイズを変更する必要があります。すべてのサイズ変更/起動呼び出しは、最初は機能しなかった後に追加されましたが、何もしませんでした。

4

2 に答える 2

2

子ウィジェットをプログラムでウィジェットに追加する場合は、子ウィジェットを起動する起動関数を定義する必要があります。その起動関数は、新しいインスタンスが作成されて dom に配置されるたびに呼び出される必要があります。例えば：

require(["dojo/ready", "dojo/_base/declare", "dijit/_WidgetBase", "dojo/dom-construct",
  "dojo/_base/lang", "dojo/on", "dojo/dom-attr", "dijit/form/RadioButton",
  "dojo/dom-style", "dijit/layout/ContentPane", "dijit/layout/StackContainer"],

function (ready, declare, _WidgetBase, domConstruct,
lang, on, attr, RadioButton,
style, ContentPane, StackContainer) {


  var MyClass = declare("gijit.workflow.debug.combi", [_WidgetBase], {
    startup: function () {
      this.inherited(arguments);
      stackContainer.startup();
    }
  });
  var x = new MyClass({});
  x.placeAt('node');
//manually call startup after instantiating the widget.  If  the parser is what is creating your widget, it calls startup automatically.  startup must be called after the widget is in the dom.
  x.startup();
  console.log(x);
});
于 2013-01-15T21:30:13.683 に答える
0

この問題を解決するには、 _WidgetBaseではなくContentPaneのウィジェット サブクラスを作成します。

Dojo でサブウィジェットがレンダリングされない (高さが 0 になる)も参照してください。

于 2013-09-08T18:33:40.033 に答える