做图书网站赚钱么,php网站建设用什么软件,张家口seo,网站后期维护价格如果您使用了GWT#xff0c;那么您可能会发现UiBinder对于设计复杂的UI很有用。 在有关Vaadin的系列文章中#xff0c;我们希望在Vaadin和GWT之间得出相似之处。 Vaadin提供了多种开箱即用的工具和组件#xff0c;用于构建复杂且美观的UI。 其中之一是可以像UiBinder那样声明… 如果您使用了GWT那么您可能会发现UiBinder对于设计复杂的UI很有用。 在有关Vaadin的系列文章中我们希望在Vaadin和GWT之间得出相似之处。 Vaadin提供了多种开箱即用的工具和组件用于构建复杂且美观的UI。 其中之一是可以像UiBinder那样声明性地构建UI。 与GWT相比Vaadin提供了直接使用.html文件的可能性。 编程方式 与GWT中一样Vaadin UI也可以通过编程方式构建。 例如假设我们要构建一个简单的表单以将任务添加到待办事项列表。 以编程方式执行此操作的一种方法 public class MainUI extends UI {Override
protected void init(VaadinRequest request) {
// TODO Auto-generated method stub
FormLayout layout new FormLayout();
TextField taskTitle new TextField();
taskTitle.setCaption(Title);
taskTitle.setIcon(VaadinIcons.CHEVRON_DOWN);
TextArea taskDescription new TextArea();
taskDescription.setCaption(Description);
taskDescription.setIcon(VaadinIcons.LINES);
DateField taskDate new DateField();
taskDate.setCaption(Date);Button button new Button(Add);
button.setIcon(VaadinIcons.PLUS);layout.addComponent(taskTitle);
layout.addComponent(taskDescription);
layout.addComponent(taskDate);
layout.addComponent(button);
setContent(layout);
}} 结果 声明方式 如果用户界面很复杂且具有嵌套组件则声明方法可能会很有用。 Vaadin开发了可以绑定到Java组件HTML自定义元素。 自定义元素以vaadin-开头。 元素的其余名称可以通过分隔单词并使其小写而从java类中提取如Vaadin的网站中所述。 以声明的方式创建UI的第一步是创建html文件我们将其命名为Form.html !doctype html
html
head
meta charsetUTF-8
meta namevaadin-version content8.0.5
/head
body
vaadin-form-layout
vaadin-text-field iconfonticon://Vaadin-Icons/e7ce captionTask Name _idtodoTitle
/vaadin-text-field
vaadin-text-area iconfonticon://Vaadin-Icons/e7ef _idtodoDescription
/vaadin-text-area
vaadin-date-time-field captionDate _idtodoDate
/vaadin-date-time-field
vaadin-button iconfonticon://Vaadin-Icons/e801_idtodoButton
Add
/vaadin-button
/vaadin-form-layout
/body
/html 第二步是创建将绑定到此文件的java类。 DesignRoot
public class Form extends FormLayout {public Form() {Design.read(Form.html, this);}
} 现在我们可以将其用作UI类中的常规组件 public class MainUI extends UI {Override
protected void init(VaadinRequest request) {
setContent(new Form());
}} 要将.html的字段绑定到java类中的字段需要设置_id属性。 例如绑定我们的文本框 vaadin-text-field iconfonticon://Vaadin-Icons/e7ce captionTask Name _idtodoTitle
/vaadin-text-field 然后我们可以将其添加到java文件中它将被自动绑定 DesignRoot
public class Form extends FormLayout {TextField todoTitle;public Form() {Design.read(Form.html, this);//we can directly use it without initialization}
} Vaadin还提供用于交互设计UI的有趣工具 Vaadin Designer 。 Vaadin Designer允许使用鼠标和拖放来设计UI。 我们仅将此工具用于演示目的因此我们无法真正对其进行评估。 Vaadin-Designer可以通过减少构建UI的时间和处理“样板”部分来帮助提高生产率。 不幸的是Vaadin Designer不是免费的其增值取决于一个项目到另一个项目。 带走 以编程方式设计UI并不总是很方便。 Vaading有一种有趣的方法以声明方式构建UI。 HTML自定义元素提供了一种直接将.html文件链接到Java的方法。 也许这是GWT开发人员探索的道路因为UiBinder将在下一个3.0版本中删除。 翻译自: https://www.javacodegeeks.com/2017/07/vaadin-tip-building-uis-declaratively.html
