×
关于

Vaadin Web 开发教程

概述安装开发环境Vaadin 应用程序框架介绍开始编写 Web 应用Vaadin Web 应用的基本组成部分使用资源UI 组件概述UI 组件-LabelUI 組件-LinkUI 組件-TextFieldUI 組件-TextAreaUI 組件-PasswordFieldUI 組件-RichTextAreaUI 組件-ButtonUI 組件-CheckboxUI 组件-Select 组件UI 组件-Table 组件UI 组件-Tree 组件UI 组件-MenuBar 组件UI 组件-Embedded 组件UI 组件-Upload 组件UI 组件-Form 组件UI 组件-ProgressIndicator 组件UI 组件-Slider 组件UI 组件-LoginForm 组件UI 组件-自定义组件UI 布局-概述UI 布局-VerticalLayout 和 HorizontalLayout 布局UI 布局-GridLayout 布局UI 布局-FormLayout 布局UI 布局-PanelUI 布局-HorizontalSplitPanel 和 VerticalSplitPanel 布局UI 布局-TabSheet 布局UI 布局-Accordion 布局UI 布局-AbsoluteLayout 布局可視化界面編輯插件使用主题-概述使用主题-创建和应用新主题数据绑定-概述数据绑定-Property 接口使用 Item 介面管理一組 Property使用 Container 介面管理一組 ItemSQLContainer 概述开始使用 SQLContainerSQLContainer-过滤及排序SQLContainer-编辑SQLContainer-引用其它 SQLContainerSQLContainer-使用 FreeformQuery

使用主题-概述


在前面介绍 Vaadin 的 UI 组件及布局时,特地没有介绍这些UI组件对应的 CSS 设置,而是留在这里介绍 Vaadin 主题时一并说明。 Vaadin 应用可以通过主题(Theme)来修改界面的外观,用户主题包括 Css 文件,自定义的 HTML 布局及使用的图像等。主题资源(Theme Resource)可以通过 ThemeResource 类访问 。

用户自定义的主题必须放置在目录 WebContent/VAADIN/themes/ 下,这个目录名是固定的。 下图显示了 Vaadin 主题的目录的一般结构:

主题的名称由其目录名称指定,比如上面定义了两个主题,一个是 reindeer (Vaadin 内置),另外一个为 mytheme. 每个主题必须包含一个 styles.css 文件。其它的主题资源可以自由命名。但一般的命名习惯为使用 img 目录存放图像文件,layouts 存放自定义 HTML 布局,css 存放 CSS 文件。

使用主题的方法非常简单,调用 setTheme 方法,如下例:

public class MyApplication
       extends com.vaadin.Application {
    public void init() {
        setTheme("mytheme");
        ...
    }
}

Vaadin 支持 Web 应用根据不同情况(如不同的用户登录)使用不同的主题。

Tags: Java EE, Vaadin, Web


分类导航

关注微信下载离线手册

bootwiki移动版 bootwiki
(群号:472910771)