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

发布于 2024-12-10 09:34:48 字数 114 浏览 0 评论 0 原文

在vaadin中，如果我将宽度和高度设置为未定义，那么在使用getHeight()/getWidth()函数时我将得到-1。如果我使用 sizeful()，我会得到 100%。但是如何获得组件的准确宽度和高度呢？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

愚人国度 2024-12-17 09:34:48

您可以通过调用 javascript 函数并获取回调结果来完成此操作。
了解更多信息 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);");

You can do it by call javascript function an get callback result.
Read more in http://demo.vaadin.com/sampler/#foundation/javascript-callback

somthing like this:

If you have 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);");

回复收藏 0 原文

裸钻 2024-12-17 09:34:48

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

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

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

回复收藏 0 原文

绮筵 2024-12-17 09:34:48

也许为时已晚，但我在这里发布此内容只是为了知道：

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

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

    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);

这样您就可以获得所选组件的高度和宽度！

Maybe it's too late, but I post this here just to know:

Now, you could use this Add-On from the vaadin directory to accomplish that (https://vaadin.com/directory#addon/css-tools).

This Add-On simply allows you, given a certain component, to geather CSS info about it.
I'll put the code example here (that is the same you find in the Add-On page)

    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);

In this way you get just Height and Width of the selected component!

回复收藏 0 原文

~没有更多了~