Eclipse Community Forums
Forum Search:

Search      Help    Register    Login    Home
Home » Eclipse Projects » Remote Application Platform (RAP) » How to specify Composite background image in CSS.
How to specify Composite background image in CSS. [message #1094333] Sun, 25 August 2013 14:22 Go to next message
Erwin Hogeweg is currently offline Erwin Hogeweg
Messages: 32
Registered: July 2009
Member
Hi,

I am trying to move the definition of a Composite background image from code to CSS. In order to do so I created the CSS definition below...


.backgroundimage{
	background-image: url( images/my-image.jpg );
}


... and changed the code as follows:

		Composite theImage = null;
		Image bodyImage = null;
		try {
			theImage = new Composite(wrapper, SWT.NONE);
			// TODO: Need to read image from css. This doesn't work (yet)...
			theImage.setData(RWT.CUSTOM_VARIANT, "backgroundimage");
			// bodyImage = new Image(Display.getCurrent(),
			//		getClass().getClassLoader().getResourceAsStream("images/my-image.jpg"));
		} catch (SWTException swte) {
			// for WindowBuilder test.
			bodyImage = new Image(stack.getDisplay(), 709, 475);
		}


When I run the app though I see the following error message appear:

org.w3c.css.sac.CSSException: Failed to read property background-image: Failed to read image: images/my-image.jpg


So there is clearly something wrong with the definition of the image location. I followed the instructions from this site: http://help.eclipse.org/indigo/index.jsp?topic=/org.eclipse.rap.help/help/html/advanced/theming.html

and verified that the image is in the specified location.

This made me think that it is probably the jetty bundle that can't find the image, and that I would need a fragment. But after creating the fragment I get the exact same result.

4	ACTIVE      org.eclipse.equinox.http.jetty_3.0.100.v20130327-1442
	            Fragments=76

stop 4
osgi> start 4
org.w3c.css.sac.CSSException: Failed to read property background-image: Failed to read image: images/my-image.jpg


I also tried to register the image as a resource and than use swt-resources/my-image.jpg. Same difference.

So now I am officially lost!

Any suggestions are highly appreciated.

Kind Regards,

Erwin
Re: How to specify Composite background image in CSS. [message #1094342 is a reply to message #1094333] Sun, 25 August 2013 14:41 Go to previous messageGo to next message
Ivan Furnadjiev is currently offline Ivan Furnadjiev
Messages: 1816
Registered: July 2009
Senior Member
Hi Erwin,
first your background-image definition should be applied to Composite
CSS element like:
Composite.backgroundimage{
background-image: url( images/my-image.jpg );
}
Second - try to remove the "-" from the image name.
HTH,
Ivan

On 8/25/2013 5:22 PM, Erwin Hogeweg wrote:
> Hi,
>
> I am trying to move the definition of a Composite background image
> from code to CSS. In order to do so I created the CSS definition below...
>
>
> backgroundimage{
> background-image: url( images/my-image.jpg );
> }
>
>
> .. and changed the code as follows:
>
> Composite theImage = null;
> Image bodyImage = null;
> try {
> theImage = new Composite(wrapper, SWT.NONE);
> // TODO: Need to read image from css. This doesn't work
> (yet)...
> theImage.setData(RWT.CUSTOM_VARIANT, "backgroundimage");
> // bodyImage = new Image(Display.getCurrent(),
> //
> getClass().getClassLoader().getResourceAsStream("images/my-image.jpg"));
> } catch (SWTException swte) {
> // for WindowBuilder test.
> bodyImage = new Image(stack.getDisplay(), 709, 475);
> }
>
>
> When I run the app though I see the following error message appear:
>
> org.w3c.css.sac.CSSException: Failed to read property
> background-image: Failed to read image: images/my-image.jpg
>
>
> So there is clearly something wrong with the definition of the image
> location. I followed the instructions from this site:
> http://help.eclipse.org/indigo/index.jsp?topic=/org.eclipse.rap.help/help/html/advanced/theming.html
>
> and verified that the image is in the specified location.
>
> This made me think that it is probably the jetty bundle that can't
> find the image, and that I would need a fragment. But after creating
> the fragment I get the exact same result.
>
> 4 ACTIVE org.eclipse.equinox.http.jetty_3.0.100.v20130327-1442
> Fragments=76
>
> stop 4
> osgi> start 4
> org.w3c.css.sac.CSSException: Failed to read property
> background-image: Failed to read image: images/my-image.jpg
>
>
> I also tried to register the image as a resource and than use
> swt-resources/my-image.jpg. Same difference.
>
> So now I am officially lost!
>
> Any suggestions are highly appreciated.
>
> Kind Regards,
>
> Erwin

--
Ivan Furnadjiev

Twitter: @EclipseRAP
Blog: http://eclipsesource.com/blogs/

Professional services for RAP and RCP?
http://eclipsesource.com/services/rap/
Re: How to specify Composite background image in CSS. [message #1094392 is a reply to message #1094342] Sun, 25 August 2013 16:35 Go to previous messageGo to next message
Erwin Hogeweg is currently offline Erwin Hogeweg
Messages: 32
Registered: July 2009
Member
Thanks Ivan,

I tried both suggestions, but with the same result:

org.w3c.css.sac.CSSException: Failed to read property background-image: Failed to read image: images/myimage.jpg



Regards,

Erwin
Re: How to specify Composite background image in CSS. [message #1094767 is a reply to message #1094392] Mon, 26 August 2013 06:52 Go to previous messageGo to next message
Ivan Furnadjiev is currently offline Ivan Furnadjiev
Messages: 1816
Registered: July 2009
Senior Member
Hi Erwin,
and where the image is located in your bundle ("images" folder in the
root of your bundle)? You could have a look at
"org.eclipse.rap.design.example" bundle for an example of complete
custom theme - fancy/business.
HTH,
Ivan

On 8/25/2013 7:35 PM, Erwin Hogeweg wrote:
> Thanks Ivan,
>
> I tried both suggestions, but with the same result:
>
> org.w3c.css.sac.CSSException: Failed to read property
> background-image: Failed to read image: images/myimage.jpg
>
>
> Regards,
>
> Erwin

--
Ivan Furnadjiev

Twitter: @EclipseRAP
Blog: http://eclipsesource.com/blogs/

Professional services for RAP and RCP?
http://eclipsesource.com/services/rap/
Re: How to specify Composite background image in CSS. [message #1095247 is a reply to message #1094767] Mon, 26 August 2013 20:46 Go to previous message
Erwin Hogeweg is currently offline Erwin Hogeweg
Messages: 32
Registered: July 2009
Member
Thanks Ivan,

> You could have a look at "org.eclipse.rap.design.example" bundle for an example of complete custom theme - fancy/business.

That helped a lot. Of course it was a user error. It is loading the image now.

Regards,

Erwin
Previous Topic:[ANN] RAP 2.2M1 published
Next Topic:The alias '/rwt-resources' is already in use.
Goto Forum:
  


Current Time: Fri Sep 19 14:11:26 GMT 2014

Powered by FUDForum. Page generated in 0.11451 seconds
.:: Contact :: Home ::.

Powered by: FUDforum 3.0.2.
Copyright ©2001-2010 FUDforum Bulletin Board Software