保持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);"));