2016-11-23 85 views
1

你能告诉我如何设置一个选项卡小部件包含网格小部件,其中选项卡小部件自动调整到其容器和网格自动调整大小的选项卡容器(和适当的可滚动)。谢谢。shieldui小部件集成 - autosized选项卡与自动化网格

+0

我现在仍然能够设置这个相当基本的设置。这个UI框架不可能实现吗?我只是希望该小部件动态地跨越其父级的可用宽度和高度(在我的测试案例中:选项卡面板将选项卡面板容器和网格选项卡面板)。我通过css黑客攻击,但是这是相当不稳定的,如果小部件决定在下次更新时更改它的标记,可能会完全中断。 – hpet

回答

1

这是可能的 - 这里是a JSBin example

为了让完成后,你将不得不考虑的事情,如:

  • 节流调整大小事件处理,
  • 调整的CSS样式 - 内边距,边框等,
  • 计算尺寸,
  • 保存和恢复电网状态(当前页面,选择等)...
+0

谢谢弗拉基米尔。我希望这可以使用相对大小并将其留给浏览器 - 从而降低ui设置的复杂性。不知道内部,破坏/初始化对客户端资源(CPU,视觉闪烁等)有什么影响?有什么机会打破下一个框架更新(小部件标记更改,样式等)?为什么这不会成为小部件的一部分? – hpet

+0

我一直在玩这个,这一切似乎有点太“哈克”。相对定位,填充和边距导致真正的问题,没有考虑到,在这里和那里太多的小提琴可能会造成巨大的问题,当项目变得更大,事情开始疯狂。 – hpet

2

我想这是什么ü需要

https://jsbin.com/didiqa/4/edit?output

只需使用CSS在标签控件的div获得溢出-Y。网格窗口小部件也有一个名为scrolling的属性,如果列宽大于网格,则会给出垂直滚动。你可以检查它here

#tabsDiv { 
    height: 250px; 
    overflow: scroll; 
} 
+0

不是。基于你的例子我想要的: - tabsContainer跨越其父母(即100%身体)的可用宽度和高度 - tabsDiv跨越可用的高度和宽度tabsContainer - 网格跨度可用的高度和宽度tabsDiv - 网格通常可滚动(固定网格标题)在制表符限制范围内 – hpet