incubator-adffaces-user mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From "arti" <>
Subject RE: Images in custom style classes in Skin file
Date Thu, 30 Mar 2006 09:56:25 GMT
Hi Jonas,

Yes, I have the same style class as mentioned in my previous mail
(copied below)

> af|MyPanelBorder::center {
> background-image:url(/skins/myskins/skin_images/menuBarBackground.png)
> ;
> }

and in my renderer, I have following code inside encodeBegin method

	// Render the CENTER area of panel 
	writer.startElement("tr", component);	// Height 70%
	writer.startElement("td", component);
	writer.writeAttribute("class", MY_PANEL_BORDER_CENTER, "class");

Where MY_PANEL_BORDER_CENTER is Style class name as it appears in the
generated CSS - defined as below
	// Style class for CENTER from generated CSS
	public static final String MY_PANEL_BORDER_CENTER =

Surprisingly, the same image, with same relative path, is used in the
CSS for menuBar background, and it is shown in browser, on same page,

I see something tricky - My original CSS has URLs to many images. But
the generated CSS does not contain any image file names - except for
this image for my style class ("af|MyPanelBorder::center"). Still all
the images are being displayed correctly.

I need to understand how the CSS is generated from the orginal source
CSS. If the generated CSS does not contain any images, how are those
images displayed in the browser? 

I have a separate discussion thread on this on JDeveloper forum (since I
was not aware of this forum before). Kindly check it for details.


-----Original Message-----
From: Jonas Jacobi [] 
Sent: Wednesday, March 29, 2006 8:38 PM
Subject: Re: Images in custom style classes in Skin file

Hi Arti,

Do you have a class for the center area?
Something like this:



arti wrote:
> Hi
> I want to understand how can we use images defined in custom style 
> classes in Skin file?
> For example I have created a custom component "MyPanelBorder" which 
> renders a table of differnet regions - Left, Right, Center etc. I am 
> trying to add background-image to the Center region, by adding 
> following class in the Skin file. But the image does not get displayed

> in the browser. Neither can I see any <img> tag when I say "view 
> source". (Same image is displayed correctly in the MenuBar background 
> on same page, it works).
> af|MyPanelBorder::center {
> background-image:url(/skins/myskins/skin_images/menuBarBackground.png)
> ;
> }
> Does my renderer have to explicitly write out a <img> tag for this? If

> so, how does my renderer read the Skin file and get the source URL of 
> the image above?
> Thanks
> Arti

*Author*: Pro JSF and Ajax: Building Rich Internet Components

View raw message