eXtremeComponent在中文环境下的使用

不知道大家是否使用过eXtremeComponent，我刚才在java eye没有搜索到。
最早知道eXtremeComponent是从www.open-open.com，去年就在用了，感觉明显比display-tag要好用多了。
它使用jstl，所以与webwork集成也很方便，不象display-tag那样需要把hibernate返回的collection复制一遍再访问。

具体的使用方法参考官方网站好了：
官方网站在这里：
http://www.extremecomponents.org/extremesite/welcome.jsp
最新的版本是1.0.1-M4-A14，可以到这里下载：
http://www.extremecomponents.org/extremesite/public/download/
或者直接下载：
http://www.extremecomponents.org/extremesite/public/download/extremecomponents-1.0.1-M4-A14.zip
但是这个snapshot版本没有依赖lib和资源文件等，推荐去这里下一个完整版本备用，目前最新的Production Release包是eXtremeComponents-1.0.1-M3-with-dependencies.zip：
https://sourceforge.net/project/showfiles.php?group_id=108168
最新版本的说明书在这里，说明书用的doc book格式，写的也很清楚：
http://www.extremecomponents.org/extremesite/public/download/eXtremeComponents.pdf
很多人都对他使用的doc book声称doc感兴趣，spring和hibernate都用doc book，可是一般看不到源文件。作者很慷慨将doc book的源文件也分享了，是学习是学习使用doc book的好东西：
http://www.extremecomponents.org/extremesite/public/download/generate-docs.zip

资源就贴到这里，这里要提及作者Jeff Johnston人非常热情，论坛上四处可见他的身影，给他发信他也是每信必会、有求必应，承蒙他多次帮助。而且论坛中大家多次提及中文问题，他也很重视。

转入正题：
我贴一下一个例子：
<ec:table
items="ecoAttrs"
action="/jgz/tjk/eco/listTjkAttByInfId.action"
imagePath="${pageContext.request.contextPath}/css/table/zh_CN/*.gif"
cellpadding="1"
title="农村经济运行情况列表"
locale="zh_CN"
rowsDisplayed="30">
<ec:export view="xls" fileName="jgz_zyjjzbwcqk.xls" tooltip="输出Excel文件"/>
<ec:exportPdf fileName="jgz_zyjjzbwcqk.pdf" tooltip="输出PDF文件" headerColor="blue" headerBackgroundColor="red" headerTitle="密云县农村经济月份经济主要指标完成情况表"/>
<ec:exportCsv fileName="jgz_zyjjzbwcqk.txt" tooltip="输出CSV文件" delimiter="|"/>
<ec:row>
<ec:column property="ofTown.name" title="乡镇名称"/>
<ec:column property="ncJihua" title="农村计划"/>
<ec:column property="ncWancheng" title="农村完成"/>
<ec:column property="ncQunian" title="农村去年"/>
<ec:column property="zongShouRuWCJH" title="完成计划%"/>
<ec:column property="zongShouRuTB" title="同比+/-%"/>
</ec:row>
</ec:table>

其中ecoAttrs是一个collection，放入pojo。action里面写你这个页面的访问方法（如我的页面是一个action，其他的如.do或者.jsp什么的都可以）。rowsDisplayed是默认显示条数，它可以自动实现分页。
下面的三个<ec:export>是导出三种格式用的，不用的话可以不写（写了需要在web.xml配置相应的filter）。
<ec:column>里面放属性，property指向pojo的相应属性，而title是表头显示的信息，这个标签需要用<ec:row>包起来（1.0.1 m4以后）（抱歉pojo比较丑，出自同事之手）。

这里放一套我做的中文图标：
http://tiny.51.net/extremecomponent/zh_CN.rar
还有我该写了一下css，更适合使用中文，将字体该为%大小，可以定义.eXtremeTable里面的font-size，即影响所有eXtremeTable里面的字体大小，也方便写js来动态修改大小：
http://tiny.51.net/extremecomponent/extremecomponents.css

贴一下我在web.xml里面的配置：
<filter>
<filter-name>eXtremeExport</filter-name>
<filter-class>
org.extremecomponents.table.filter.ExportFilter
</filter-class>
</filter>

<filter-mapping>
<filter-name>eXtremeExport</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>

<taglib>
<taglib-uri>/extremecomponents</taglib-uri>
<taglib-location>/WEB-INF/tld/extremecomponents.tld</taglib-location><!-- 别忘了把那个tld拷贝到相应目录去 -->
</taglib>

其实，那个filter只是在使用<ec:export>的时候才需要，不过这个功能还是很有用的。

export里面的excel和pdf默认不支持中文，需要手工修改源码，excel的比较简单：
修改org.extremecomponents.table.view.XlsView.java（我指的是1.0.1-M4-A14的相应代码）
102行：
HSSFCell hssfCell = hssfRow.createCell(cellnum);
hssfCell.setEncoding(HSSFCell.ENCODING_UTF_16);（就是添加这一行）
122行：
HSSFCell cell = row.createCell(cellnum);
cell.setEncoding(HSSFCell.ENCODING_UTF_16);（就是添加这一行）
这个在使用UTF-8时工作正常。如果其他Unicode环境可以尝试HSSFCell.ENCODING_COMPRESSED_UNICODE。

编译后将对应.class放到WEB-INF/classes相应目录就可以了。

pdf view的比较麻烦，还没尝试，解决方法参照这个帖子：
http://extremecomponents.org/forum/viewtopic.php?t=139&highlight=chinese+filter
http://www-128.ibm.com/developerworks/cn/xml/x-ospdf/index.html

还有一小点：
升级到1.0.1-M4-A14以后两个图片改名了，如果用1.0.1-M3的对应gif则需要该如下两个文件名（我修改的那个ZH-CN已经重命名过了）：
searchArrow.gif -> filterArrow.gif
search.gif -> filter.gif

说的比较罗嗦，主要是想让和我一样的非常初级水平的朋友能够比较容易上手。其实eXtremeComponent的文档很不错，用那个上手其实更好，我仅抛砖引玉，各位大牛多多包涵。

感谢楼主，要这个有一阵子了，对里面的Cell实现方式很赞赏，为了项目方便自己写了不少cell，我希望用这个的同学们能贡献出自己的cell。

感谢楼主的icon,很cool。但是我们一般要求table要小巧精悍，不知道楼主有没有做过小点的icon，嘻嘻。

　　以前没有用过eXtremeComponent！看了Tin的介绍确实不错，特别是export这个特性！谢谢楼主的Sharing

呵呵，幸会。在bjug拜读过你的文章。icon等有时间再做小的，然后分享。

我是在XP里面。

1、解开fop-0.20.5.jar，启用cmd，并到它的目录中，执行：
java org.apache.fop.fonts.apps.TTFReader -ttcname "SimSun" C:\WINDOWS\Fonts\simsun.ttc simsun.xml
java org.apache.fop.fonts.apps.TTFReader -ttcname SimHei C:\WINDOWS\Fonts\simhei.ttf simhei.xml
2、然后就会生成需要的两个字体描述文件：simsun.xml、simhei.xml
我们将我们生成的两个xml文件和它们对应的字体simsun.ttc和simhei.ttf存储到我们的Web项目的WEB-INF/fonts下面。
3、然后在我们的src目录（目的是要被部署到WEB-INF/classes目录，也有可能是/src/conf，看你的工程的设定）创建一个名为fop-pdf-userconfig.xml的文件，内容如下：

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<fonts>
  <font metrics-file="@@@@@@@@@@fonts/simsun.xml" 
   	embed-file="@@@@@@@@@@fonts/simsun.ttc" kerning="yes">
    	<font-triplet name="SimSun" style="normal" weight="normal"/>
    	<font-triplet name="SimSun" style="normal" weight="bold"/>
    	<font-triplet name="SimSun" style="italic" weight="normal"/>
    	<font-triplet name="SimSun" style="italic" weight="bold"/>
  </font>
  <font metrics-file="@@@@@@@@@@fonts/simhei.xml" 
   	embed-file="@@@@@@@@@@fonts/simhei.ttf" kerning="yes">
    	<font-triplet name="SimHei" style="normal" weight="normal"/>
    	<font-triplet name="SimHei" style="normal" weight="bold"/>
    	<font-triplet name="SimHei" style="italic" weight="normal"/>
    	<font-triplet name="SimHei" style="italic" weight="bold"/>
  </font>
</fonts>
</configuration>

注意，其中有“@@@@@@@@@@”，因为我的实现方法很丑陋，我后面的代码中将“@@@@@@@@@@”替换为你部署后运行的路径，目的是字体文件等能够跟工程一同部署，减少固定字体等文件的麻烦。
4、对extremeComponent的代码，我又修改了两处：
其一，对于org.extremecomponents.table.view.PdfView修改：
将其中出现<fo:block的地方全部添加font-family=\"SimSun,SimHei\"。
然后double colwidth = 10 / columnCount;中的10修改为20，此处修改使中文字符不会堆积在一起。
我还将上面的sb.append(" page-width=\"11in\" ");修改为sb.append(" page-width=\"22in\" ");，这样对于中文比较宽大的报表可以显示完全，不过这个要自己把握。

其二，修改org.extremecomponents.table.filter.PdfViewResolver：
我在driver.run();前面增加如下一段代码：

try {
            ClassLoader loader = Thread.currentThread();.getContextClassLoader();;
            URL url = loader.getResource(
                    "/org/extremecomponents/table/filter/PdfViewResolver.class");; //get the class's working folder
            String classPathUrl = url.toExternalForm();;
            String fileRoot = classPathUrl.substring(0,
                    classPathUrl.lastIndexOf("WEB-INF"););;
            fileRoot = (fileRoot.substring(6); + "WEB-INF/");; //cut the "file:/" prefix

            InputStream opis = loader.getResourceAsStream(
                    "fop-pdf-userconfig.xml");;
            StringBuffer tempConfigurationStrBuf = new StringBuffer();;

            byte[] buffer = new byte[4096];
            int len;

            while ((len = opis.read(buffer);); != -1); {
                String s = new String(buffer, 0, len);;
                tempConfigurationStrBuf.append(s);;
            }

            String configurationStr = tempConfigurationStrBuf.toString();;
            configurationStr = configurationStr.replaceAll("@@@@@@@@@@",
                    fileRoot);;

            ByteArrayInputStream bais = new ByteArrayInputStream(configurationStr.getBytes(););;
            org.apache.fop.apps.Options options = new org.apache.fop.apps.Options();;
            options.loadUserconfiguration(bais);;
        } catch (FOPException fe); {
            fe.printStackTrace();;
        }

大家可以抨击代码的丑陋，呵呵，不过还好it works。代码很丑陋，本来想咨询raimundo的，他正好忙，所以畸形了，如果朋友们有其它好方法可以一同改进。
不过要注意，我替换的/org/extremecomponents/table/filter/PdfViewResolver.class是放到WEB-INF/classes文件夹的，如果您将它替换到jar包里面，则上面内容还需要修改一下，我没有测试，但是估计也不麻烦的。

至此，最基本的解决Pdf export的方法就写好了。可是正好看到差沙已经早些放出了他的修改，明显比我这个优雅，但是他的修改无法将fonts里面的内容自动部署并检查目录，大家可以合并一下代码，相信会更好一点。回去好好学习差沙分享的代码，大家一同学习。

相关代码打包在这里：http://tiny.51.net/extremecomponent/ec_pdf_chfix.rar

本解决方案参考了本贴：
http://extremecomponents.org/forum/viewtopic.php?t=139&highlight=chinese+filter

惭愧，我也是先前参考了别人的，感觉你这个更详细，只是最好不要改源码，自己做一个view，PdfViewResolver就好了。呵呵。

请教一个问题，如果我按Ｔｉｎ的方法修改了代码，并打成eXtremeComponent
的ｊａｒ包，并放在ｌｉｂ目录下下面的方法好像有问题，报空指针错误。

ClassLoader loader = Thread.currentThread();.getContextClassLoader();;
            URL url = loader.getResource(
                    "/org/extremecomponents/table/filter/PdfViewResolver.class");; //get the class's working folder
            String classPathUrl = url.toExternalForm();; 

我的问题：有没有什么方法能够得包含到”/org/extremecomponents/table/filter/PdfViewResolver.class“类的ｊａｒ包的路径？我的ｕｓｅｒｃｏｎｆｉｇ．ｘｍｌ和eXtremeComponent．ｊａｒ放置在同一个目录下．／ｗｅｂａｐｐ／ＷＥＢ－ＩＮＦ／ｌｉｂ／下。

呵呵，如果打包当然不可以了……我那个代码很丑陋，通过ClassLoader获取的路径是file://，如果你打包则是jar://，路径也会跑到/WEB-INF/lib下面了，所以后面处理的地方要变一下，你可以自己修改一下代码好了。

请教一个问题:
   有没有人试过在同一个页面中配置展示两个collection列表,我配置完出现比较多的问题.例如:点击一个集合列表的翻页另外一个集合也会进行翻页

请分配不同的tableId