Vaadin Web应用开发教程(28):UI布局-概述
来源:互联网 发布:显卡 知乎 编辑:程序博客网 时间:2024/05/12 07:25
Vaadin提供的UI组件大体可以分为两类,一类为之前介绍的UI组件主要和用户交互。另外一类为布局类,主要目的是用来管理用户界面中所放置的UI组件的大小和位置。
在创建Window对象时,如果你不想使用缺省的布局,可以着手创建根布局对象,如下例:
// Create the main window.Window main = new Window("My Application");setMainWindow(main); // Set the root layout (VerticalLayout is actually the default).VerticalLayout root = new VerticalLayout();main.setContent(root); // Add the topmost component.root.addComponent(new Label("The Ultimate Cat Finder")); // Add a horizontal layout for the bottom part.HorizontalLayout bottom = new HorizontalLayout();root.addComponent(bottom); bottom.addComponent(new Tree("Major Planets and Their Moons"));bottom.addComponent(new Panel());...
在创建好Layout对象后,通常还需要对布局对象进行调整,比如大小,对齐方式,间隔等等。
此外布局的使用和用户界面的主题关系密切,比如背景,边界类型,文字对齐等。这些在后面都有详细介绍。
比如使用上面代码创建的一个界面显示如下:
Vaadin应用创建用户界面除了使用Java代码外,Vaadin提供了Eclipse IDE的一个插件,可以通过拖动UI组件的方式帮助开发人员设计用户界面。详见后文。
- Vaadin Web应用开发教程(28):UI布局-概述
- Vaadin Web应用开发教程(30):UI布局-GridLayout布局
- Vaadin Web应用开发教程(31):UI布局-FormLayout布局
- Vaadin Web应用开发教程(34):UI布局-TabSheet布局
- Vaadin Web应用开发教程(35):UI布局-Accordion布局
- Vaadin Web应用开发教程(36):UI布局-AbsoluteLayout 布局
- Vaadin Web应用开发教程(7):UI组件概述
- Vaadin Web应用开发教程(32):UI布局-Panel
- Vaadin Web应用开发教程(1):概述
- Vaadin Web应用开发教程(29):UI布局-VerticalLayout和HorizontalLayout布局
- Vaadin Web应用开发教程(33):UI布局-HorizontalSplitPanel和VerticalSplitPanel布局
- Vaadin Web应用开发教程(38):使用主题-概述
- Vaadin Web应用开发教程(41):数据绑定-概述
- Vaadin Web应用开发教程(45): SQLContainer 概述
- Vaadin Web应用开发教程(8):UI组件-Label
- Vaadin Web应用开发教程(9):UI组件-Link
- Vaadin Web应用开发教程(10):UI组件-TextField
- Vaadin Web应用开发教程(11):UI组件-TextArea
- IIC驱动程序分析(一)
- Changes Since wxWidgets 2.8
- IIC驱动程序分析(二)
- IIC驱动程序分析(三)
- IIC驱动程序之完善篇
- Vaadin Web应用开发教程(28):UI布局-概述
- Android ApiDemos示例解析(133):Views->Layouts->Baseline->1.Top
- JavaScript 表单验证
- Javascript中文档对象模型(DOM)的层次结构图
- error C3859: 超过了PCH的虚拟内存范围;请使用“-Zm33”或更大的命令行选项重新编译
- ATmega16的定时器0、1、2的比较
- AVR单片机用progisp下载时报错Chip Enable Program Error
- HTML 中表单form 的相关知识
- AVR单片机用progisp下载报错flash verify error at :0h