设计 GWT 的 DockLayoutPanel
我正在尝试使用 GWT 创建 DockLayoutPanel。它应该占据整个屏幕。
DockLayoutPanel dockPanel = new DockLayoutPanel(Unit.EM);
dockPanel.addSouth(new HTML("South"), 2);
dockPanel.addNorth(new HTML("North"), 2);
dockPanel.addEast(new HTML("Easat"), 2);
dockPanel.addWest(new HTML("West"), 2);
dockPanel.add(new HTML("Center"));
RootLayoutPanel.get().add(dockPanel);
- 我相信添加方法的第二个参数是各个面板的宽度。布局如何决定面板的高度？
- 如何设置布局样式，例如向面板添加边框、面板之间的间距、添加与边框对齐的面板标题？
- 面板背景颜色应该使用 CSS 设置，还是有办法通过 java 来设置？
- 我可以将这些面板制作为拖放面板吗？
I am trying to create a DockLayoutPanel using GWT. It should occupy the complete screen.
DockLayoutPanel dockPanel = new DockLayoutPanel(Unit.EM);
dockPanel.addSouth(new HTML("South"), 2);
dockPanel.addNorth(new HTML("North"), 2);
dockPanel.addEast(new HTML("Easat"), 2);
dockPanel.addWest(new HTML("West"), 2);
dockPanel.add(new HTML("Center"));
RootLayoutPanel.get().add(dockPanel);
- I believe that the second parameter to the add methods is the width of the respective panels. How does the layout decide the height of the panel?
- How can I style the layout, like add border to the panels, spacing between the panels, add panel headings in-line with the border?
- Should the panel background colors be set using CSS, or is there a way to do so from java?
- Can I make these panels as drag and drop panels?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
1）第二个参数实际上是面板的尺寸。它将是宽度或高度，具体取决于布局位置。使用Unit.PX或Unit.PC可以获得更清晰的结果，EM单位一开始可能会让人困惑。
2）使用CSS样式。
3) 再次强调，使用 CSS
4) 单独使用 GWT 是不可能的。查看 GWT-Mosaic 项目。特别是“拖放列/行布局”：http://mosaic.analytical-labs。 com/#CwDNDColumnRowLayout
1) The second parameter is really the size of the panel. It will be the width or the height, depending of the layout position. Use Unit.PX or Unit.PC for a clearer result, the EM unit maybe confusing at the beginning.
2) Use CSS styles.
3) Again, use CSS
4) It's not possible using GWT alone. Take a look to the GWT-Mosaic project. Specially to the "Drag & Drop Column/Row Layout": http://mosaic.analytical-labs.com/#CwDNDColumnRowLayout
1) 高度等是使用正常的 HTML 布局规则确定的。面板的高度和宽度就是包含 div 的高度和宽度。
2) 使用 CSS 设置其样式，就像使用任何其他 div 一样。 UiBinder 使这变得非常简单。
3）是的，使用CSS。您可以调用 getElement() 和 getStyle()（如果您想直接操作它）或 addStyleName() 添加 CSS 类。无论如何，UiBinder 可能比用 Java 更好。
4）据我所知，没有办法开箱即用地做到这一点。您必须编写一些代码来处理该问题。 SplitLayoutPanel 将允许您更改面板的大小，但不能更改位置。
1) The height and such are determined using normal HTML layout rules. The height and width of the panel is just the height and width of the containing div.
2) Style it using CSS just as you would any other div. UiBinder makes this pretty easy.
3) Yes, use CSS. You can call getElement() and getStyle() if you want to manipulate it directly or addStyleName() to add a CSS class. Regardless, UiBinder is probably the better bet than doing it in Java.
4) AFAIK, there's no way to do this out of the box. You'll have to write some code to handle that. SplitLayoutPanel will let you change the sizes of the panels, but not the positions.