保持GWT小部件大小的比例与屏幕尺寸

Question

大部分我的意见将有5 - 10小工具，我想弄清楚如何使按钮，下拉看起来他们最好的。
我曾尝试将它们的尺寸设置为当前屏幕尺寸的百分比，但对于非常大的屏幕或非常小的屏幕，这不是理想的解决方案。移动用户将成为主要的最终用户。 什么是最好的方式来实现这一点所以移动用户将真正能够看到一个体面的大小的按钮一个小屏幕，而个人电脑用户不会最终看到一些巨大的按钮，如果他们是全屏。

Answer 1

您可以使用ViewPort Meta tag维持在mobile设备过你的web应用适当widths and heights ..用了改变所有的layouts。

The viewport meta tag to control layout on mobile browsers. 

另请参阅下面的问题，我已经回答了设置视口。

Achieving min-width with viewport meta tag

Answer 2

在现代浏览器中，除了如其他响应提及并视适用于整个文档，你可以使用CSS规模转变。

看到这个纯HTML/CSS example

我在GWT做的是我是否有不同的.ui.xml或CSS捆绑与标尺不同桌面和移动排列，或通过我的代码更改（根据窗口大小，浏览器类型等计算比例因子）。

在第二种情况下，你可以使用GWT元素的方法：

panel.getElement().getStyle().setProperty("WebkitTransform", "scale(0.65, 0.65)"); 
panel.getElement().getStyle().setProperty("MozTransform", "scale(0.65, 0.65)"); 

或我宁愿使用gwtquery语法：

$(panel).css($$("-webkit-transform: scale(0.65, 0.65); -moz-transform: scale(0.65, 0.65);"));