鍍金池/ 教程/ Java/ UI 組件-RichTextArea
UI 組件-自定義組件
UI 布局-Panel
UI 組件-Slider 組件
UI 組件-Button
UI 組件-PasswordField
UI 布局-TabSheet 布局
Vaadin Web 應(yīng)用的基本組成部分
UI 組件-Label
UI 組件-Link
UI 布局-GridLayout 布局
安裝開(kāi)發(fā)環(huán)境
UI 組件-Tree 組件
UI組件-Select 組件
UI 布局-概述
UI 組件-RichTextArea
UI 組件-Table 組件
使用 Item 介面管理一組 Property
使用資源
UI 組件-TextArea
SQLContainer-編輯
SQLContainer-過(guò)濾及排序
UI 組件-TextField
UI 布局-HorizontalSplitPanel 和 VerticalSplitPanel 布局
SQLContainer-引用其它 SQLContainer
UI組件-ProgressIndicator組件
開(kāi)始編寫 Web 應(yīng)用
UI組件-Form組件
UI 布局-Accordion 布局
SQLContainer-使用 FreeformQuery
SQLContainer 概述
使用主題-創(chuàng)建和應(yīng)用新主題
概述
UI 布局-AbsoluteLayout 布局
UI 組件-Upload 組件
使用主題-概述
UI 布局-FormLayout 布局
MenuBar 組件
UI 布局-VerticalLayout 和 HorizontalLayout 布局
UI 組件-Embedded 組件
UI 組件概述
使用 Container 介面管理一組 Item
UI 組件-LoginForm 組件
數(shù)據(jù)綁定-Property 接口
Vaadin 應(yīng)用程序框架介紹
開(kāi)始使用 SQLContainer
UI 組件-Checkbox
可視化界面編輯插件
數(shù)據(jù)綁定-概述

UI 組件-RichTextArea

RichTextArea 允許輸入帶格式的文本。 RichTextArea 內(nèi)容以 HTML 格式顯示。它繼承自TextArea,本身沒(méi)有提供什麼附加功能,你可以通過(guò)擴(kuò)展 VRichTextArea, VRichTextToolbar 的方法來(lái)為 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>");

http://wiki.jikexueyuan.com/project/vaadin-web-development-tutorial/images/32.png" alt="" />

可以看到 RichTextArea 控制項(xiàng)本身帶有一個(gè)工具條,其中的選擇框使用英語(yǔ)而不支持本地化,但你可以通過(guò)派生或重新定義 VRichTextToolbar 來(lái)實(shí)現(xiàn)本地化。 而工具條上按鈕可以通過(guò) CSS 重新定義來(lái)實(shí)現(xiàn)本地化。 例如:

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

下圖為英語(yǔ)和本地化的 RichTextArea 工具條上按鈕。

http://wiki.jikexueyuan.com/project/vaadin-web-development-tutorial/images/33.png" alt="" />

Tags: Java EE, Vaadin, Web