`

Widget小窗口和Decorator装修器的使用

 
阅读更多

 

    ofbiz中的Widget小窗口和Decorator装修器是ofbizView层的技术，是ofbiz的一大特色。使用widget我们可以将很多零散的页面部分拼合成一张页面。这样的话每张页面都有的公共部分我们就只用创建一次，创建新页面时我们只用创建不同的部分即刻可。

    Widget是用xml文件表示的，存放的位置是app\widget\XxxxScreen.xml，零散的页面碎片通常存放在app\webapp\app\下和app\webapp\app\includes\下，app\webapp\app\存放的是不同的页面部分，app\webapp\app\includes\下存放的是相同的页面部分。

    Widget示例代码：

<screen name="news">

       <section>

            <widgets>

                <platform-specific><html><html-template location="component://hello2/webapp/hello2/includes/header.ftl"/></html></platform-specific>

                <platform-specific><html><html-template location="component://hello2/webapp/hello2/news.ftl"/></html></platform-specific>

                <platform-specific><html><html-template location="component://hello2/webapp/hello2/includes/footer.ftl"/></html></platform-specific>

            </widgets>

       </section>

</screen>

    代码中我们可以看到news页面由三部分组成：header.ftl,main.ftl,footer.ftl。这三部分的路径都在代码中明确给出，这样的话当用户请求页面news时，ofbiz就会根据代码中给出的路径找到页面的不同部分，将它们组合起来再返回一张完整的页面的用户。

 

    然而，当View比较复杂，页面太多时，这样在XML里定义每一张页面时，XML的代码量也是非常大的，而且不利于维护，别急，Decorator装修器可以帮我们解决这个问题！Decorator是一个页面模板，该模板也是一个screen元素，模板名通常叫CommonDecorator，和widget定义在相同的XML文件中。当模板定义后每一个页面的定义就不用像上面这样将所有的部分都列出来了，可以只用列出和其它页面不同的部分。

    示例代码：

<screen name="CommonDecorator">

       <section>

            <widgets>

                <platform-specific><html><html-template location="component://hello2/webapp/hello2/includes/header.ftl"/></html></platform-specific>

                <decorator-section-include name="body"/>

                <platform-specific><html><html-template location="component://hello2/webapp/hello2/includes/footer.ftl"/></html></platform-specific>

            </widgets>

       </section>

</screen>  

 

<screen name="news">

       <section>

            <widgets>

                <decorator-screen name="CommonDecorator">

                    <decorator-section name="body">

                       <platform-specific><html><html-template location="component://hello2/webapp/hello2/news.ftl"/></html></platform-specific>

                    </decorator-section>

                </decorator-screen>

            </widgets>

       </section>

</screen>

    代码中，页面news的代码就要比一开始少了很多，原因就是使用了模板CommonDecorator。模板页面和普通页面是一样的XML元素，但在其中有一句话不同：<decorator-section-include name="body"/>，该句话所在的位置就是使用了该模板的页面需要添加自己内容的位置，在示例代码中，模板定义了HTML头和脚，使用该模板需要添加的部分就是主体部分。模板中可以添加内容的位置用<decorator-section-include name="body"/>标示，应该可以有多个位置可以被添加，不同的位置用name参数区分。

    注意使用了模板的news页面的格式，<widgets>标签内部套一个<decorator-screen name="CommonDecorator">标签，说明要使用的模板是CommonDecorator，然后在其内再套一个  <decorator-section name="body">标签，说明要在模板的"body位置"添加内容。在该标签里的  <platform-specific><html><html-template location="component://hello2/webapp/hello2/news.ftl"/></html></platform-specific>就是news页面与其他页面不同的内容。

分享到：
| 查看mysql的存储引擎
评论
发表评论

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

相关推荐

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