"WebSphere Portal Theme & Skin 开发指南"
在WebSphere Portal的环境中,主题(Theme)和皮肤(Skin)是构建用户界面的关键元素。它们决定了门户页面的外观和布局,提供了一种定制用户体验的方法。以下是关于这些概念的详细说明:
1. **Theme概念及结构**
- **Theme** 是一组资源,它定义了整个Portal页面的布局和样式。每个门户页面在展示时都需要一个Theme。Theme包含了控制页面整体布局的组件,如头部、侧边栏、导航和底部区域。
- **Structure**:一个典型的Portal Theme通常由多个部分组成,包括`Default.jsp`作为页面的基本框架,`banner.jspf`处理页面顶部,`sideNav.jspf`定义侧边栏,`topNav.jspf`处理顶部导航,`footer.jspf`处理页面底部,以及`banner_crumbtrail.jspf`、`banner_searchcontrol.jspf`和`banner_toolbar.jspf`等特定功能区域。这些JSP片段(JSPF)组合在一起形成了完整的页面结构。
2. **文件聚合(File Aggregation)**
- Portal Theme通过将各个JSP片段组合成一个整体,实现了页面的布局。这包括Portlets,它们也是由类似结构的JSP文件组成,如`Default.jsp`和其他辅助JSPF文件。这种聚合方式允许灵活地调整和定制页面元素。
3. **Skin概念及结构**
- **Skin** 更侧重于页面的视觉样式,如颜色、字体和图标等。它是Theme的一个层面,用于控制页面元素的具体表现形式。Skin可以独立于Theme更改,使得在不破坏布局的情况下实现界面风格的切换。
- **Skin开发要点**:开发者需要关注CSS文件、图像和JavaScript,这些都构成了Skin的核心。CSS定义了元素的样式,图像提供了视觉元素,而JavaScript可能涉及到交互行为的实现。
4. **自定义Theme**
- WebSphere Portal允许用户创建自定义Theme以满足特定需求。在版本6.1.5中,新增了PageBuilder主题,这是一个独立的Java EE应用程序,提供了更直观的界面来构建和编辑主题。
- 自定义Theme有两种主要方法:一种是在标准的`wps.ear/wps.war/themes`目录下创建和修改,另一种是利用PageBuilder主题,它提供了更为灵活和可视化的设计工具。
理解并掌握WebSphere Portal的Theme和Skin开发对于定制化门户用户体验至关重要。通过精心设计和开发,可以创建出既符合企业品牌形象又具有良好用户体验的Portal环境。