完成《Build a JSF Page that is Editable at Runtime》。
说明:文档是针对11.1.1.3的,我是使用JDeveloper 11.1.1.6.0重新做的。
学习要点:
1. 创建WebCenter应用
2. 为页面增加Oracle Composer组件
Composer组件可以在运行时修改页面。
(1)Change Mode Link
(2)Page Customizable
该组件定义运行时可以修改的区域。
(3)Layout Customizable
该组件定义运行时可以修改的页面布局。
(4)Show Detail Frame
完成后的页面代码如下:
<f:facet name="content"> <af:group id="g1"> <pe:changeModeLink id="cml1"/> <pe:pageCustomizable id="pageCustomizable1"> <cust:panelCustomizable id="panelCustomizable1" layout="scroll"> <pe:layoutCustomizable id="layoutCustomizable1"> <cust:panelCustomizable id="panelCustomizable2"> <cust:showDetailFrame text="showDetailFrame 1" id="sdf1"/> </cust:panelCustomizable> <f:facet name="contentA"> <cust:panelCustomizable id="panelCustomizable3"> <cust:showDetailFrame text="showDetailFrame 2" id="sdf2"> <af:image source="/57996_1600x1200-wallpaper-cb1344523063.jpg" id="i1"/> </cust:showDetailFrame> </cust:panelCustomizable> </f:facet> <f:facet name="contentB"> <cust:panelCustomizable id="panelCustomizable4"> <cust:showDetailFrame text="showDetailFrame 3" id="sdf3"> <af:richTextEditor label="" id="rte1"/> </cust:showDetailFrame> </cust:panelCustomizable> </f:facet> </pe:layoutCustomizable> </cust:panelCustomizable> <f:facet name="editor"> <pe:pageEditorPanel id="pep1"/> </f:facet> </pe:pageCustomizable> </af:group> </f:facet>
3. 运行效果
Project 下载:MyWebCenterApp(2).7z