`
remoteJavaSky
  • 浏览: 47381 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

PrimeFaces 2.x 学习笔记(开始) 主题的使用

WebAjaxNetBeansJSFPrimeFaces 
阅读更多

        PrimeFaces是一款轻量级开源的JSF组件库，它拥有100多个具有Ajax特性的组件。并还有一套针对移动领域设计的TouchFaces。是最早最完全支持的JSF2.0规范的组件库，借助于JavaEE6.0中的技术，一个jar包，无任何配置，任何依赖，只要将它的命名空间引入，即可享受它带来的n多特性。
        但发现国内对它的关注还不够，鉴于本人对JSF技术的热衷，工作之余希望能够学习一下PrimeFaces ,做下笔记顺便练习一下自己的语言表达能力,甚至还对初学者有些帮助(想到这还是很高兴的)。我选择NetBeans7.0作为开发环境，因为它太方面了。由于今晚是个开始，所以就把这个环境试出来就行，使用它的主题就够了吧。
        关于如何搭建环境，前文已有介绍，几乎是不用任何配置的，尤其是Netbeans7.0已经集成了最新稳定的版本PrimeFaces2.2.1了，今天是个开始，就介绍一下它的主题如何运用吧
        新建一个JavaEE6.0 Web 项目，在选择JSF配置时，选择它的组件为PrimeFaces2.2.1这就可以使用PrimeFaces了，如图：

 

 

再到http://primefaces.org/themes.html下载一个主题包(就是一个jar文件，放到lib目录下就可以了。这里我选了redmond。index.xhtml中添加个日历控件如下：

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.prime.com.tr/ui">
    <h:head>
        <title>Smoke</title>
    </h:head>
    <h:body>
        <p:calendar mode="inline"/>
    </h:body>
</html>


        并要注意在web.xml配置文件中加入配置参数指定相应主题：

<context-param>
     <param-name>primefaces.THEME</param-name>
     <param-value>redmond</param-value>
</context-param>


        Run一下就会发现使用的是带有redmond主题风格的一个日历，我们也可以根据自己的需要，创建自己的主题，当然我的CSS功力不够的

 

0
顶
0
踩
分享到：
| Flex TabNavigator 动态增删tab 后的bug (t ...
评论
7 楼 remoteJavaSky 2011-08-23  
在当前页面head中加入如下css定义下样式就可以了
<style type="text/css">  
      .ui-layout-hd{  
      font-size: 10px;  
    }  
</style>

重要的是看它官方的文档，这曾经还收费过一段时间的哈
http://primefaces.googlecode.com/files/primefaces_users_guide_2_2.pdf
6 楼 mxmredfox 2011-08-22  
  我用 primefaces221 请教个问题 如何修改 pf 标签上的字体大小，
  我的代码：  <p:layoutUnit position="left" width="200" header="ABCD" styleClass="layoutUnit" >
                <ui:insert name="pageWest" />
            </p:layoutUnit>
现在这个ABCD老大了，可是我修改不了
5 楼 remoteJavaSky 2011-08-22  
恩，又多个关注JSF的了哈，ThemeSwitcher PrimeFaces 提供的这个控件挺好用的哈，如果需要切换主题
4 楼 mxmredfox 2011-08-22  
做要修改用户主题的时候，还需要像Richfaces一样，动态的加载web.xml中的主题选项。将primefaces主题包下载后，放出lib中，之后，在web.xml中配置就可以了。
3 楼 mxmredfox 2011-08-22  
官方推荐不是这样做的哦
2 楼 remoteJavaSky 2010-11-25  
恩，好建议。EE6中对resources目录应该已经标准化了吧
1 楼 quakezh 2010-11-18  
link部分也可以用outputStylesheet替换,比较简明.写法是

<h:outputStylesheet library="theme" name="skin.css" />


目录结构为:
[web]
  [resources]
     [theme]
        (skin.css)

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics