Follow by Email

Wednesday, 2 March 2016

Configure ADF Skin in Jdeveloper 11.1.1.7


In Jdeveloper 11.1.1.7 there is no option to create ADF Skin declaratively
In order to apply skin we have to create a simple CSS file and then configure application to use this CSS file as skin. Jdeveloper doesn't do this for us :( we have to do it manually

So first step is to enable Skin Selectors for ADF Faces, Without enabling this CSS editor doesn't show ADF Faces component tags
CSS files by default supports HTML tags  only

Go to Tools > Preferences > CSS Editor and set CSS level to level 3 and check the box to support ADF Faces Components


Now create a CSS file -
Right Click on View Controller project > Select New > Web Tier > HTML > CSS File 

 
Provide a name for CSS file and click OK



Created a page and dropped af:commandButton in that and added this code in CSS file

@namespace af "http://xmlns.oracle.com/adf/faces/rich";

af|commandButton{
    color:blue;
    font-weight:bold
}

But you'll see that there is no change in look of button , it means CSS is not working as of now


This is because that there is no change in trinidad-config.xml file and we have to do it manually
Replace trinidad-config.xml with this code

<?xml version="1.0" encoding="windows-1252"?>
<trinidad-config xmlns="http://myfaces.apache.org/trinidad/config">
   <skin-family>MyCss</skin-family>
  <skin-version>v1</skin-version>
</trinidad-config>

and create a new XML file called trinidad-skins.xml , this file manages skins in ADF Application


<?xml version="1.0" encoding="windows-1252" ?>
<skins xmlns="http://myfaces.apache.org/trinidad/skin">
<skin>
   <id>skin1.desktop</id>
   <family>MyCss</family>
   <extends>skyros-v1.desktop</extends>
   <style-sheet-name>css/skin1.css</style-sheet-name>
</skin>
</skins>

<skin-family> of trnidad-config.xml and <family> attribute of trinidad-skins.xml should be same
Now check again, CSS is now become ADF Skin ;)

Cheers :) Happy Learning

3 comments :

  1. In this article we are trying to inform you some of the points to consider before buying any anti aging skin care product:-source

    ReplyDelete
  2. I look at older pictures of myself and think, "Wow, what was I thinking?" I learned that gobs of makeup on older women can really add years to your appearance and make you look dated. my face looks dull and black

    ReplyDelete