我正在使用Vaadin 7.6.1,但Vaadin的Window组件出现问题。我的窗口是模态的,具有固定大小。但是,如果调整浏览器窗口的大小,则该窗口太大而无法完整显示。
下图应说明上下文:
在这种情况下,我希望浏览器显示滚动条,因此用户仍然可以使用整个对话框。
我使用了Vaadin官方仪表板演示的代码结构,并对其进行了修改:https : //github.com/vaadin/dashboard-demo。
编辑:也许很有趣重现该问题。在Vaadin采样器中,您可以打开窗口,将其设置为模式窗口,调整窗口大小(更大),最后调整浏览器窗口的大小:http : //demo.vaadin.com/sampler/#ui/structure/window
Edit2:此JQuery对话框的示例演示了我的要求:https : //jqueryui.com/dialog/#modal-form打开对话框后,我可以调整浏览器窗口的大小,因此无法显示整个对话框。但是有滚动条,因此用户仍然可以使用它。
查看生成的源,默认情况下看起来像body
定义overflow: hidden;
,因此没有滚动条出现。一个可行的解决方法(从这里得到一些启发)是将其更改为overflow: auto;
您的主题。
如果您知道可以安全地在
body
元素(例如,主题仅在页面上唯一的应用中使用),您可以使用
.v-generated-body
选择器。仅当应用程序是直接从servlet提供的,而不是嵌入在另一个页面中时,它才可用。
不确定这是否不再适用,但是直到我将定义移到@mixin
此处所解释的范围之外,它对我才起作用:
请注意,Vaadin 7.0错误地没有在引导过程中添加主题名称。因此,您必须使用不带主题名称的规则,例如
.v-generated-body .v-app .v-app-loading
并将其移出@mixin。您还需要确保v-app div的高度为
.v-app {height:100%;}
mytheme.scss
@import "../valo/valo";
// must be outside theme mixin as per https://vaadin.com/wiki/-/wiki/Main/Adding+a+splash+screen
.v-generated-body {
// change the overflow from hidden to auto
overflow: auto;
// copy the rest as it was
margin: 0;
padding: 0;
border: 0;
}
@mixin mytheme {
@include valo;
// other customizations
}
您应该得到类似于以下内容:
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句