background image on panel in GWT

501 views
Skip to first unread message

Ramanan Nathamuni

unread,
Jan 29, 2016, 3:33:04 AM1/29/16
to GWT Users
Hi all,

I am using Netbeans project,and I have attached image to correct my problem

my problem is in my project I have class extends FlowPanel, I want to add the Image as background on this class. The image from images folder 

I tried css as well as class itself. ie.
the css is
 
.desktopPanel{
    background-image: url("\cti\gwtdemo\client\images\intelview-bkground.jpg");
    background-color: lightgray;

}
 and in the class i have written

public class DesktopPanel extends FlowPanel {

    private final ClientMain cmain;
    Image image = new Image();

    public DesktopPanel(ClientMain cmain) {
        this.cmain = cmain;
        image.setWidth("100%");
        image.setHeight("100%");
        image.setStyleName("backgroundImg");
        image.setUrl("cti\\gwtdemo\\client\\images\\traffic-bkground.jpg");
        addStyleName("desktopPanel");
        // add(new Label("Desktop"));
    }

}

but I could not see the image in Panel. please go through the attached file and correct my problems 

Thanks in advance
Ramanan
bkg.png

Jens

unread,
Jan 29, 2016, 4:32:10 AM1/29/16
to GWT Users

.desktopPanel{
    background-image: url("\cti\gwtdemo\client\images\intelview-bkground.jpg");
    background-color: lightgray;

}

Your image url must point to a valid URL when your app is deployed. I am pretty sure that images inside your java src folder are not available to the browser once deployed. You need to put your images either into "Web Pages/images" so they are part of your deployment or create a folder "cti/gwtdemo/public/images" and put them into that folder. GWT will copy all files in the "public" folder to the module output folder and thus should be available when your .war file will be deployed.

Also with CSS you usually use forward slashes in url().

-- J.
Reply all
Reply to author
Forward
0 new messages