在GWT中布置元素的最佳方法是什么？

Question

在GWT小部件中指定元素位置的最佳实践是什么？

想象一下,你有一个任务:在页面布局中放置一组小部件.您会用什么来按顺序放置所有按钮和输入？

1. 标准HTML标记与表/ divs + CSS样式用于定位
2. GWT小部件:面板,网格,表格和用于定位的CSS样式
3. GWT小部件:面板,网格,表格+用于定位的原生属性

如果是2或3 - 你会用什么来重现一个带有colspans,固定宽度列和填充的标准HTML表？

ps UIBinder和XML标记.GWT 2.4

---

我的观点: GWT的一大优势是能够阻止程序员编写HTML标记并为界面添加跨浏览器支持.我们不应该放弃这些点,所以最好选择p.3并尝试仅使用CSS进行装饰 - 即颜色,字体等.

另一种观点: 将任何样式内联放置是一个坏主意.通过在XML标记中指定小部件的属性,我们确实正是这样做的.此外,GWT没有足够的小部件来生成正常的布局.例如,您需要创建一个包含collspans和固定列宽的简单表.你会怎么做？看起来你必须在VerticalPanels中嵌入几个Horizo​​ntalPanels,在每个人中指定宽度/高度,并由此产生一篇很好的XML论文.

---

你的意见怎么样？

Answer 1

GWT会生成可怕的,可怕的,不好的,非常糟糕的HTML.这只是我的意见,其他人则不同意.但我每天都在使用GWT,无限嵌套的div和表足以让新手网络开发人员哭泣.并且它的所有样式都是内联的,所以如果你想用外部样式表来应用或覆盖它们,你最终会得到一个!important声明林.

然而,它确实产生了非常可爱的JavaScript.正如有人谁曾经保持和发展一个超级复杂的DHTML项目和IE 5.5及以上提供支持- 手 -我不得不承认,这是GWT的最好的部分.

不可否认,我是一名DHTML纯粹主义者,在我成为软件开发人员之前就已成为一名网络开发者.我个人认为HTML应该仅用于结构,CSS应该提供样式,JavaScript应该提供其他功能,并且这三者应该完全分开.GWT在最后一部分是相当不错的 - JavaScript - 但它生成的HTML冒犯了我的敏感性,并且至少比它的复杂性高十倍.但话说回来,大多数生成的代码都是.(考虑使用MS Word创建的网站或从WYSIWYG风格的编辑器生成的HTML.)

鉴于一个复杂的基于Web的应用程序 - 以及对滚动Ruby on Rails应用程序的限制 - 我很乐意使用GWT.但我的应用程序几乎是FlowPanels(编译为HTML <div>)和GWT生成的Javascript 的集合,我自己的CSS在顶部.因此,在OP所规定的情况下,我将使用FlowPanel,添加元素(例如GWT表单元素),应用任何服务器端逻辑,然后使用外部CSS进行样式设置.

在查看GWT时,您可能想要考虑以后是否想要重新设计应用程序,或者希望让设计人员或其他非程序员创建模板/样式/ CSS以应用于顶部.如果是这样的话,当你设计你的GWT应用程序不应用样式而不是应用类和id时,你会非常小心.

另外作为测试方面的注意事项:如果您打算使用Selenium进行UI测试,那么您真的想要将ID挂起来.生成的HTML中的xpath实际上是不合适的,并且可以延伸到数百个字符的长度.

话虽如此,我对听到其他人的经历非常感兴趣,特别是如果他们与我的不同.

tl;博士版:

1. 嵌套表和嵌套<div>的多层(超过必要的),GWT生成的HTML非常糟糕
2. GWT不会生成CSS样式表,但会将所有样式内联.这使得使用外部样式表变得乏味且困难.
3. GWT在跨浏览器Javascript方面表现出色.
4. 默认情况下,GWT不会将id附加到元素,因此如果您打算使用像Selenium这样的工具,则必须手动添加自己的ID,或者像您以前从未见过的那样使用非常长的xpath.