Question

在vaadin中，如果我将width和height设置为undefined，那么在使用getHeight（）/ getWidth（）函数时我将得到-1。如果我使用sizeful（），我会得到100％。但是，如何才能获得组件的确切宽度和高度？

Answer 1

你可以通过调用javascript函数和get回调结果来实现。阅读http://demo.vaadin.com/sampler/#foundation/javascript-callback

中的更多内容

这样的事情：

如果你有HorizontalLayout h

HorizontalLayout h = new HorizontalLayout()
//...
h.setId("myId");
JavaScript.getCurrent().addFunction("myGetWidth",
   new JavaScriptFunction() {
       @Override
       public void call(final JSONArray arguments)
               throws JSONException {
         int width = arguments.getInt(0);
         //now you can do something with this width
       }
   });
JavaScript.getCurrent().execute("myGetWidth(document.getElementById('" +h.getId() + "').clientWidth);");

Answer 2

在Vaadin中，布局由浏览器中的客户端引擎实现，布局组件的具体大小通常取决于浏览器窗口的大小。 Vaadin标准组件不会将组件大小发送回服务器。

由于您的所有代码都在服务器上执行，因此它也无法获取这些值。您需要编写一个特殊的包装器组件，每次更改时都会将其大小发送回服务器。

更新2013-03-21：我开发了SizeReporter add-on for Vaadin 7，它将组件的大小发送回服务器，并在尺寸发生变化时通知您。

Answer 3

也许为时已晚，但我在此发帖只是为了知道：

现在，您可以使用vaadin目录中的此附加组件来完成该操作（https://vaadin.com/directory#addon/css-tools）。

这个附加组件允许您在给定某个组件的情况下收集有关它的CSS信息。我将把代码示例放在这里（与你在Add-On页面中找到的相同）

    RenderInfo.get(component, new Callback() {
            public void infoReceived(RenderInfo info) {
                   // Use the info
                   // All the properties are returned as Strings, e.g. "123px"
                   String width = info.getProperty(CssProperty.width);
            }
    },CssProperty.height, CssProperty.width);

通过这种方式，您可以获得所选组件的高度和宽度！

获取Vaadin中组件的精确宽度和高度

3 个答案: