给RichFaces设置一个皮肤很简单,只要在web.xml文件中写以下这一段就可以了:
Xml代码
<context-param>
<param-name>org.richfaces.SKIN</param-name>
<param-value>ruby</param-value>
</context-param>
<context-param>
<param-name>org.richfaces.SKIN</param-name>
<param-value>ruby</param-value>
</context-param>
但是,有时候你也许会要在程序运行的时候去动态改变RichFaces的皮肤。甚至你可能会想让每个用户保存自己喜欢的皮肤。那该怎么做呢?
首先,我们需要将硬编码到web.xml中的皮肤设置改变为一个EL表达式:
Xml代码
<context-param>
<param-name>org.richfaces.SKIN</param-name>
<param-value>#{skinBean.skin}</param-value>
</context-param>
<context-param>
<param-name>org.richfaces.SKIN</param-name>
<param-value>#{skinBean.skin}</param-value>
</context-param>
skinBean是一个JSF managed Bean,类似这样:
Java代码
public class SkinBean {
private String skin;
public String getSkin() {
return skin;
}
public void setSkin(String skin) {
this.skin = skin;
}
}
public class SkinBean {
private String skin;
public String getSkin() {
return skin;
}
public void setSkin(String skin) {
this.skin = skin;
}
}
当然,你需要在JSF的配置文件里面注册一下这个Bean:
Xml代码
<managed-bean>
<managed-bean-name>skinBean</managed-bean-name>
<managed-bean-class>demo.SkinBean</managed-bean-class>
<managed-bean-scope>session</managed-bean-scope>
<managed-property>
<property-name>skin</property-name>
<value>ruby</value>
</managed-property>
</managed-bean>
<managed-bean>
<managed-bean-name>skinBean</managed-bean-name>
<managed-bean-class>demo.SkinBean</managed-bean-class>
<managed-bean-scope>session</managed-bean-scope>
<managed-property>
<property-name>skin</property-name>
<value>ruby</value>
</managed-property>
</managed-bean>
我们会想要设置一个默认的皮肤,同时我们需要将这个Bean的声明周期为Session。之所以不放到request中,是因为如果放到request中,那么每次请求到达的时候,都会去刷新并将皮肤恢复成默认的,而我们希望看到的效果是,用户每次登录的整个过程,皮肤是一直不变的(除非用户主动去改变它)。
通过下面的页面,我们立刻就能看到效果了。
Xml代码
<h:form>
<rich:panel header="I can change skins" style="width: 300px">
<h:panelGrid columns="2">
<h:selectOneListbox id="select" value="#{skinBean.skin}" onchange="submit()">
<f:selectItem itemLabel="plain" itemValue="plain" />
<f:selectItem itemLabel="emeraldTown" itemValue="emeraldTown" />
<f:selectItem itemLabel="blueSky" itemValue="blueSky" />
<f:selectItem itemLabel="wine" itemValue="wine" />
<f:selectItem itemLabel="japanCherry" itemValue="japanCherry" />
<f:selectItem itemLabel="ruby" itemValue="ruby" />
<f:selectItem itemLabel="classic" itemValue="classic" />
<f:selectItem itemLabel="laguna" itemValue="laguna" />
<f:selectItem itemLabel="deepMarine" itemValue="deepMarine" />
</h:selectOneListbox>
<rich:tabPanel>
<rich:tab label="Tab 1">Tabs also change color</rich:tab>
<rich:tab label="Tab 2">...</rich:tab>
</rich:tabPanel>
</h:panelGrid>
</rich:panel>
</h:form>
<h:form>
<rich:panel header="I can change skins" style="width: 300px">
<h:panelGrid columns="2">
<h:selectOneListbox id="select" value="#{skinBean.skin}" onchange="submit()">
<f:selectItem itemLabel="plain" itemValue="plain" />
<f:selectItem itemLabel="emeraldTown" itemValue="emeraldTown" />
<f:selectItem itemLabel="blueSky" itemValue="blueSky" />
<f:selectItem itemLabel="wine" itemValue="wine" />
<f:selectItem itemLabel="japanCherry" itemValue="japanCherry" />
<f:selectItem itemLabel="ruby" itemValue="ruby" />
<f:selectItem itemLabel="classic" itemValue="classic" />
<f:selectItem itemLabel="laguna" itemValue="laguna" />
<f:selectItem itemLabel="deepMarine" itemValue="deepMarine" />
</h:selectOneListbox>
<rich:tabPanel>
<rich:tab label="Tab 1">Tabs also change color</rich:tab>
<rich:tab label="Tab 2">...</rich:tab>
</rich:tabPanel>
</h:panelGrid>
</rich:panel>
</h:form>
这里放一个tab组件,其实是为了让你看到外观上的改变效果的,没有功能上的实际作用。你还可以放几个其他组件上去,看看效果的变化。
如果你想要学习如何编写自己的皮肤,请参考这篇文章XXX(稍后放出:)
其他你可以尝试一下的,就是改变一下标准组件的样式,我们的例子中为h:selectOneListbox:
Xml代码
<context-param>
<param-name>org.richfaces.CONTROL_SKINNING</param-name>
<param-value>enable</param-value>
</context-param>
分享到:
相关推荐
Richfaces标签 简介Richfaces标签相关内容 初学者认知
richfaces标签学习笔记richfaces标签学习笔记richfaces标签学习笔记richfaces标签学习笔记
这是richfaces 3.3.1的用户手册PDF版
教会如何使用richfaces,及richfaces应用
Richfaces组件使用指南、richfaces手册(很详细、很全面的教程)
关于richfaces的一些比较好的资料,希望大家看了能有收获
RichFaces组件简介,复合组件,日期控件,Ajax标签, 轻松实现。RichFaces组件简介,复合组件,日期控件,Ajax标签, 轻松实现。RichFaces组件简介,复合组件,日期控件,Ajax标签, 轻松实现。
RichFaces_3.3.3_TLD.chm
richfaces中文开发文档 纯中文 适合维护老项目的人
使用richfaces需要用到的jar包! commons-beanutils-1.7.0.jar,commons-codec-1.3.jar,commons-collections-3.2.jar,commons-digester-1.8.jar,commons-discovery-0.4.jar,commons-el-1.0.jar,commons-...
richfaces3.1.4版的demo,运行在jboss和tomcat5.5下
Richfaces ShowCase离线包,可直接在tomcat下部署,含在线演示例子。
RichFaces4.5 JavaApi JSApi API文档 英文版
richfaces4.0所需的jar包,richfaces4.0所需的jar包,richfaces4.0所需的jar包,
Richfaces3.3.3常用组件使用手册 便于学习Richfaces和a4j和jsf框架 很好很实用
本文档主要根据richfaces3.3.3 用户手册和demo 编写。 Richfaces 下载地址http://www.jboss.org/richfaces/download/stable。 demo 下载地址http://www.jboss.org/richfaces/demos。
richfaces-distribution-4.5.8.Final的richfaces-showcase的部署包
richfaces环境搭建所需要的jar richfaces-api-3.3.1.GA.jar richfaces-impl-3.3.1.GA.jar richfaces-ui-3.3.1.GA.jar 希望对搭建有帮助
richfaces-ui-3.1.2的组件。AJAX基于jsf。全程是JBoss RichFaces ,不知道为什么在Exadel上找不到免费下载,还不清楚和Exadel RichFaces在代码中的关系到了什么程度。
richfaces 最新在线demo下载