0

タブパネル内に、「折りたたみ可能」= true のパネルがあります。

アイコンをクリックして展開しても何も起こりません。タブを変更してから前のタブに戻ったときにのみ、展開イベントが発生し、パネルが正しく展開されます。折りたたもうとすると、同じ奇妙な動作が発生します。

タブパネルとパネルの両方を動的に構築します。

これは私がタブパネルを構築する方法です:

HnBSenchaUIGeneratorClass.prototype.GenTabPanel = function (modelConfigData, targetId) {    var hnb = this;


var _layout = "auto";
if (modelConfigData.Layout) {
    _layout = (Ext.decode(modelConfigData.Layout, true) == null) ? modelConfigData.Layout : Ext.decode(modelConfigData.Layout, true);
} else {
    _layout = "auto";
}


var tabPanel = new Ext.create('Ext.tab.Panel', {
    title: modelConfigData.WindowTitle || modelConfigData.Title,
    layout: _layout,
    closable: false,
    autoScroll: true,
    activeTab: modelConfigData.ActiveTab || 0,
    tabPosition: modelConfigData.TabPosition || 'top',
    listeners: {
        beforetabchange: {
            fn: function (tabPanel, newCard, oldCard, eOpts) {
                //TODO: validar se isto não invalida ou interfere algum outro processo ou validação.
                newCard.suspendLayout = true;
            }
        }
    }
});


if (modelConfigData.ObjId != undefined) tabPanel["objId"] = modelConfigData.ObjId;


if (modelConfigData.BodyStyle != undefined) tabPanel["bodyStyle"] = modelConfigData.BodyStyle;
if (modelConfigData.Closable != undefined) tabPanel["closable"] = modelConfigData.Closable;
if (modelConfigData.Flex != undefined) tabPanel["flex"] = modelConfigData.Flex;


if (modelConfigData.Border != undefined) tabPanel["border"] = modelConfigData.Border;
if (modelConfigData.Style != undefined) tabPanel["style"] = modelConfigData.Style;
if (modelConfigData.Height != undefined) tabPanel["height"] = modelConfigData.Height;
if (modelConfigData.Width != undefined) tabPanel["width"] = modelConfigData.Width;
if (modelConfigData.Defaults != undefined) tabPanel["defaults"] = modelConfigData.Defaults;
if (modelConfigData.Margin != undefined) tabPanel["margin"] = modelConfigData.Margin;
if (modelConfigData.Padding != undefined) tabPanel["padding"] = modelConfigData.Padding;
if (modelConfigData.Property != undefined) tabPanel["dataField"] = modelConfigData.Property;
if (modelConfigData.Anchor != undefined) tabPanel["anchor"] = modelConfigData.Anchor;
if (modelConfigData.Rowspan != undefined) tabPanel["rowspan"] = modelConfigData.Rowspan;
if (modelConfigData.Colspan != undefined) tabPanel["colspan"] = modelConfigData.Colspan;
if (modelConfigData.Disabled != undefined) tabPanel["disabled"] = modelConfigData.Disabled;


var obj;
Ext.Array.each(modelConfigData.Items, function () {
    if (this.DontRender === undefined || (this.DontRender != true && this.DontRender.toString().toUpperCase() != "TRUE")) {
        switch (this.Type) {
            case "panel":
                obj = hnb.GenPanel(this, targetId);
                break;
            case "form":
                obj = hnb.GenForm(this, targetId);
                break;
            case "list":
                obj = hnb.GenGrid(this, targetId);
                break;
            case "CommandExecution":
                obj = CreateObjectByCommandExecution(this, targetId);
                break;
            default:
                break;
        }
        if (obj) {
            if (this.ObjId != undefined)
                obj["objId"] = this.ObjId;


            var SelfDisabled = false;
            if (this.SelfDisabled != undefined) {
                if (this.SelfDisabled == true) {
                    SelfDisabled = true;
                }
            }
            obj.SelfDisabled = SelfDisabled;


            if (this.Disabled != undefined)
                obj.disabled = (this.Disabled.toString().toUpperCase() === "TRUE");


            tabPanel.add(obj);
        }
    }
});
return tabPanel;

}

そして、これは私がパネルを作成する方法です:

HnBSenchaUIGeneratorClass.prototype.GenPanel = function (modelConfigData, targetId) {    var hnb = this;


var _layout = "auto";
if (modelConfigData.Layout) {
    _layout = (Ext.decode(modelConfigData.Layout, true) == null) ? modelConfigData.Layout : Ext.decode(modelConfigData.Layout, true);
} else {
    _layout = "auto";
}


var panel = new Ext.create('Ext.panel.Panel', {
    itemId: modelConfigData.ItemId,
    title: modelConfigData.WindowTitle || modelConfigData.Title,
    layout: _layout,
    closable: false,
    controlUrl: modelConfigData.ServiceURL
    //autoScroll: true
    //,border: modelConfigData.Border,
    //flex: modelConfigData.Flex
    //, bodyStyle: modelConfigData.BodyStyle //'background-color:green !important;'
});


if (modelConfigData.ObjId != undefined) {
    panel["objId"] = modelConfigData.ObjId;
    panel["itemId"] = modelConfigData.ObjId;
}


if (modelConfigData.Flex != undefined) panel["flex"] = modelConfigData.Flex;
if (modelConfigData.BodyStyle != undefined) panel["bodyStyle"] = modelConfigData.BodyStyle;
if (modelConfigData.Border != undefined) panel["border"] = modelConfigData.Border;
if (modelConfigData.Style != undefined) panel["style"] = modelConfigData.Style;
if (modelConfigData.Height != undefined) panel["height"] = modelConfigData.Height;
if (modelConfigData.Width != undefined) panel["width"] = modelConfigData.Width;
if (modelConfigData.Defaults != undefined) panel["defaults"] = modelConfigData.Defaults;


if (modelConfigData.Collapsible != undefined) panel["collapsible"] = modelConfigData.Collapsible;
if (modelConfigData.Collapsed != undefined) panel["collapsed"] = modelConfigData.Collapsed;
if (modelConfigData.Region != undefined) panel["region"] = modelConfigData.Region;
if (modelConfigData.Cmargins != undefined) panel["cmargins"] = modelConfigData.Cmargins;
if (modelConfigData.MinSize != undefined) panel["minSize"] = modelConfigData.MinSize;
if (modelConfigData.MaxSize != undefined) panel["maxSize"] = modelConfigData.MaxSize;




if (modelConfigData.Margin != undefined) panel["margin"] = modelConfigData.Margin;
if (modelConfigData.Padding != undefined) panel["padding"] = modelConfigData.Padding;
if (modelConfigData.Property != undefined) panel["dataField"] = modelConfigData.Property;
if (modelConfigData.Anchor != undefined) panel["anchor"] = modelConfigData.Anchor;
if (modelConfigData.Rowspan != undefined) panel["rowspan"] = modelConfigData.Rowspan;
if (modelConfigData.Colspan != undefined) panel["colspan"] = modelConfigData.Colspan;
if (modelConfigData.Disabled != undefined) panel["disabled"] = (modelConfigData.Disabled.toString().toUpperCase() === "TRUE");


addEvent(modelConfigData, panel);


var modelFields = [];
var panelFields = [];
Ext.Array.each(modelConfigData.Items, function () {
    var aux;
    if (this.DontRender === undefined || (this.DontRender != true && this.DontRender.toString().toUpperCase() != "TRUE")) {
        if (this.Type == "form") {
            aux = hnb.GenForm(this);
        }
        else {
            aux = hnb.CreateSenchaUIObject(this, panel, modelFields);
        }
    }


    if (aux) {
        panelFields.push(aux);
    }
});
panel.add(panelFields);


return panel;

}

なぜこれが起こっているのかについてのアイデアはありますか??

Sencha 4.1.2a を使用しています。

4

1 に答える 1

0

両方のイベントを妨げているものを見つけました。

タブパネルの作成で、「beforetabchange」のリスナーを設定しました。ここでこれを行いました：newCard.suspendLayout = true;

これは別の画面に必要なので、基本的に、上記を実行したくない場合は「余分な」var を追加します。最終的には次のようになります。

listeners: {
        beforetabchange: {
            fn: function (tabPanel, newCard, oldCard, eOpts) {
                if (tabPanel.enableSuspendLayout === true) {
                    newCard.suspendLayout = true;
                }
            }
        }
    }
于 2012-12-11T13:22:03.357 に答える