自定义窗口小部件中的Dijit Tabcontainer - Tablist宽度运行时间过长

问题描述

我有一个模板化的自定义窗口小部件，它继承自dijit.layout._LayoutWidget，dijit._Container和dijit._Templated，它给我的窗口小部件本机Widget支持调整大小等等。我需要的是一个TabContainer，它的大小是小部件的大小这是我的小部件。

 < div dojoAttachPoint =containerNode> 
< div dojoType =dijit.layout.TabContainertabPosition =topstyle =width：100％; height：100％> 
< div dojoType =dijit.layout.ContentPanetitle =tabselected =true> 
 hello 
< / div> 
< / div> 
< / div> 
  

一切看起来不错，但我得到一个奇怪的TabList。

我研究了这个问题。窗口小部件和TabContainer的所有部分都具有正确的宽度和高度值。只有标签列表宽度不大（宽50,000像素）：我已经阅读过类似的问题，例如：，但在我的情况下，所有元素的宽度和长度都是正确的。我不知道tablist如何获得这么长的宽度。

我也尝试过许多添加和删除style =width：100％; height：100的方法。为父母容器及其父母。但是没有一个配置解决了这个问题。

有没有办法解决这个问题？

解决方案

为了防止有人正在寻找解决方案，我遇到了同样的问题，并提出了这个问题。虽然我查看了错误报告，但是在我的情况下并不适用，我没有将tabcontainer嵌入表中或将doLayout设置为false。我尝试设置tabcontroller，但也没有工作。最后在调试之后，原来你必须在你的窗口小部件中提供'resize'方法，然后按照以下方式调整tabcontainer的大小。

  widgetTemplate ='...'+ //我们的tabcontainer声明
'< div dojoAttachPoint =containerNode>'+ 
'< div dojoAttachPoint =widgetTabdojoType =dijit.layout。 TabContainer'+'style =width：100％; height：100％>'+ 
'< div dojoType =dijit.layout.ContentPanetitle =tabselected =true> ; // hello< / div>< / div>< / div>'+ 
'...'//其余的模板声明
 
 //因为我们在模板中嵌入小部件我们需要_WidgetsInTemplateMixin 
 dojo.declare（MyWidget，[dijit._Widget，dijit._TemplatedMixin，dijit._WidgetsInTemplateMixin]，{
 templateString：widgetTemplate，
 .... //其余的函数
 resize：function（）{
 this.containerNode.widgetTab.resize（）//调整大小tabcontainer 
} 
 
}）; 
  

希望这有帮助

I have a templated custom widget that inherits from dijit.layout._LayoutWidget, dijit._Container, and dijit._Templated which gives my widget native Widget support for resizing, etc. All I need is a TabContainer, which is sized to the size of widget. Here is my widget.

<div dojoAttachPoint="containerNode">
    <div dojoType="dijit.layout.TabContainer" tabPosition="top" style="width:100%;height:100%" >
    <div dojoType="dijit.layout.ContentPane" title="tab" selected="true">
    hello
    </div>
</div>
</div>

Everything looks fine but I get a weird TabList.

I looked into the problem. All the pieces of the widget and TabContainer have the correct width and height values. Only The tablist has a loooong width (50'000 something pixels wide): I have read about similar issues such as this one: http://bugs.dojotoolkit.org/ticket/10495, but in my case all the elements have correct width and length. I have no idea how does tablist get this long width.

I have also tried many ways of adding and removing style="width:100%;height:100;" for the parent container and its parents. But none of the configurations fixed the problem.

Is there a way to fix this problem?

解决方案

Just in case someone is looking for the solution, I had the same problem, and came to this question. Though I looked at the bug reports, it didn't apply in my case, I was not embedding tabcontainer inside table or setting doLayout to false. I tried setting tabcontroller but that didn't work either. Finally after debuggin, turns out you have to provide 'resize' method in your widget and resize tabcontainer inside it in the following way

widgetTemplate =  '... ' + //Our tabcontainer declaration
'<div dojoAttachPoint="containerNode">' +
'<div dojoAttachPoint="widgetTab" dojoType="dijit.layout.TabContainer"' + 'style="width:100%;height:100%" >' +
'<div dojoType="dijit.layout.ContentPane" title="tab" selected="true">hello</div></div></div>' + 
'...' //Rest Of template declaration

//Since we are embedding widget inside template we need _WidgetsInTemplateMixin
dojo.declare("MyWidget", [dijit._Widget, dijit._TemplatedMixin,dijit._WidgetsInTemplateMixin], {
templateString: widgetTemplate,
.... //Rest of functions
resize: function(){
this.containerNode.widgetTab.resize() //Resize tabcontainer 
}

});

Hope this helps

这篇关于自定义窗口小部件中的Dijit Tabcontainer - Tablist宽度运行时间过长的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！