首页 > Oracle融合中间件 > ADF界面使用多皮肤

ADF界面使用多皮肤

概述

本文主要描述了在新版本的JDeveloper(11.1.2.1)当中,ADF页面如何使用多皮肤。

内容主要包括:

1. 使用ADF Skin Editor开发多个皮肤

2. 开发选择皮肤组件

源码及文档下载:here

实现

1.创建应用ADF应用

2.创建皮肤

     NewSkin1

     NewSkin2

3.开发页面

    创建页面

    编辑页面以及选择皮肤处理逻辑

   1: <?xml version='1.0' encoding='UTF-8'?>

   2: <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:f="http://java.sun.com/jsf/core"

   3:           xmlns:af="http://xmlns.oracle.com/adf/faces/rich">

   4:     <jsp:directive.page contentType="text/html;charset=UTF-8"/>

   5:     <f:view>

   6:         <af:document title="useSkin" id="d1">

   7:             <af:form id="f1">

   8:                 <af:outputText value="How To Use Skin !!" id="ot1"/>

   9:                 <af:toolbox id="t1">

  10:                     <af:menuBar id="mb1">

  11:                         <af:menu text="Change Skin" id="m1">

  12:                             <af:commandMenuItem text="NewSkin1" id="cmi1" type="radio"

  13:                                                 selected="#{sessionScope.skinFamily == 'NewSkin1'}"

  14:                                                 actionListener="#{SkinBean.selectSkinMenuAction}"/>

  15:                             <af:commandMenuItem text="NewSkin2" id="cmi2" type="radio"

  16:                                                 selected="#{sessionScope.skinFamily == 'NewSkin2'}"

  17:                                                 actionListener="#{SkinBean.selectSkinMenuAction}"/>

  18:                         </af:menu>

  19:                     </af:menuBar>

  20:                 </af:toolbox>

  21:             </af:form>

  22:         </af:document>

  23:     </f:view>

  24: </jsp:root>

   clip_image002

   backing bean

   1: package com.dickluo.howto.useskin.view.backing;

   2:  

   3: import java.io.IOException;

   4:  

   5: import java.util.Map;

   6:  

   7: import javax.faces.context.ExternalContext;

   8: import javax.faces.context.FacesContext;

   9: import javax.faces.event.ActionEvent;

  10:  

  11: import oracle.adf.controller.ControllerContext;

  12: import oracle.adf.share.ADFContext;

  13: import oracle.adf.view.rich.component.rich.nav.RichCommandMenuItem;

  14:  

  15: public class SkinBean {

  16:     /**

  17:      * 构造函数

  18:      * 初始化皮肤为fusion,即为ADF默认的皮肤

  19:      */

  20:     public SkinBean() {

  21:         ADFContext adfctx = ADFContext.getCurrent(); //获取当前adf context

  22:         Map sessionScope = adfctx.getSessionScope(); //获取 session scop

  23:         Object skinFamily = sessionScope.get("skinFamily");

  24:         if (skinFamily == null) {

  25:             sessionScope.put("skinFamily", "fusion"); //初始化skinFamily变量,即为SessionScop.skinFamily

  26:         }

  27:     }

  28:  

  29:     /**

  30:      * 选择皮肤菜单事件

  31:      * @param actionEvent

  32:      */

  33:     public void selectSkinMenuAction(ActionEvent actionEvent) {

  34:         RichCommandMenuItem menuItem = (RichCommandMenuItem)actionEvent.getComponent(); //获取菜单项

  35:         ADFContext adfctx = ADFContext.getCurrent();

  36:         Map sessionScope = adfctx.getSessionScope();

  37:         sessionScope.put("skinFamily", menuItem.getText());//将skinFamily设置为菜单项的文本

  38:         redirectToSelf();

  39:     }

  40:     /**

  41:      * 重定向到当前页面(刷新当前页面)

  42:      */

  43:     private void redirectToSelf() {

  44:         FacesContext fctx = FacesContext.getCurrentInstance();

  45:         ExternalContext ectx = fctx.getExternalContext();

  46:         String viewId = fctx.getViewRoot().getViewId();

  47:         ControllerContext controllerCtx = null;

  48:         controllerCtx = ControllerContext.getInstance();

  49:         String activityURL = controllerCtx.getGlobalViewActivityURL(viewId);

  50:         try {

  51:             ectx.redirect(activityURL);

  52:             fctx.responseComplete();

  53:         } catch (IOException e) {

  54:             //Can't redirect

  55:             e.printStackTrace();

  56:             fctx.renderResponse();

  57:         }

  58:     }

  59: }

4.编辑皮肤

NewSkin1:

clip_image002[4]

NewSkin2:

clip_image002[6]

5.编辑trinidad-config.xml配置文件

   1: <?xml version="1.0" encoding="GBK"?>

   2: <trinidad-config xmlns="http://myfaces.apache.org/trinidad/config">

   3:   <skin-family>#{sessionScope.skinFamily}</skin-family>

   4: </trinidad-config>

6.显示效果

默认皮肤:

clip_image002[8]

选择NewSin1:

clip_image002[10]

选择NewSkin2:

clip_image002[12]

 

 

关于作者:

昵称:dick.luo
档案信息:本人罗昌辉,英文名为Dick,目前就职于上海汉得信息技术股份有限公司中间件事业部,担任中间件技术顾问,专注于Oracle融合中间件产品在企业中的应用以及二次开发。
联系方式:你可以通过changhui.luo@gmail.com联系作者
点击查看dick.luo发表过的所有文章...
本文永久链接: http://blog.retailsolution.cn/archives/3006

 

 

对本文的评价:

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading ... Loading ...

 

 

  1. 本文目前尚无任何评论.
  1. 本文目前尚无任何 trackbacks 和 pingbacks.
您必须在 登录 后才能发布评论.