当前位置: 代码迷 >> Web前端 >> Vaadin Web应用开发课程(13):UI组件-RichTextArea
  详细解决方案

Vaadin Web应用开发课程(13):UI组件-RichTextArea

热度:28   发布时间:2012-09-06 10:37:01.0
Vaadin Web应用开发教程(13):UI组件-RichTextArea

RichTextArea 允许输入带格式的文本。 RichTextArea 内容以HTML格式显示。它继承自TextArea,本身没有提供什么附加功能,你可以通过扩展VRichTextArea, VRichTextToolbar 的方法来为RichTextArea添加客户端功能

// Create a rich text area
final RichTextArea rtarea = new RichTextArea();
rtarea.setCaption("My Rich Text Area");

// Set initial content as HTML
rtarea.setValue("<h1>Hello</h1>\n" +
    "<p>This rich text area contains some text.</p>");

可以看到RichTextArea 控件本身带有一个工具条,其中的选择框使用英语而不支持本地化,但你可以通过派生或重新定义VRichTextToolbar来实现本地化。 而工具条上按钮可以通过CSS 重新定义来实现本地化。
例如:

.v-richtextarea-richtextexample .gwt-ToggleButton
.gwt-Image {
background-image: url(img/richtextarea-toolbar-fi.png)
!important;
}

下图为英语和本地化的RichTextArea工具条上按钮。


 

  相关解决方案