adding a background-image to the body or to an HTMLPanel

Hello!

I'd like to add a background-image to the body element or at least to a HTMLPanel in the UIBinder xml file.

Here's my code:

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'

xmlns:g='urn:import:com.google.gwt.user.client.ui' xmlns:b="urn:import:org.gwtbootstrap3.client.ui">

<ui:with field='res' type='de.hs_karlsruhe.client.resources.MyResources' />

<b:Container fluid="true">

<b:Row>

<b:Column size="MD_1">

<g:HTMLPanel styleName="{res.loginCss.maindiv} {res.GWT_AppCss.panel}">

<g:VerticalPanel addStyleNames="{res.loginCss.form}">

<g:HorizontalPanel addStyleNames="{res.loginCss.formPart}">

<g:TextBox ui:field="matrnrTextBox" addStyleNames="{res.loginCss.nameTextBox}" />

</g:HorizontalPanel>

<g:HorizontalPanel addStyleNames="{res.loginCss.formPart}">

<g:PasswordTextBox ui:field="passwordTextBox"

addStyleNames="{res.loginCss.passwordTextBox}" />

</g:HorizontalPanel>

<g:Button text="Login" ui:field="loginButton"

addStyleNames="{res.loginCss.loginButton}" />

</g:VerticalPanel>

</g:HTMLPanel>

</b:Column>

</b:Row>

</b:Container>

</ui:UiBinder>

public class LoginView extends Composite implements ILoginView {

@UiTemplate("LoginView.ui.xml")

interface LoginUiBinder extends UiBinder<Widget, LoginView> {

}

private static LoginUiBinder uiBinder = GWT.create(LoginUiBinder.class);

@UiField

TextBox matrnrTextBox;

@UiField

PasswordTextBox passwordTextBox;

@UiField

Button loginButton;

private ILoginPresenter presenter;

@UiField(provided = true)

final MyResources res;

public LoginView() {

this.res = MyResources.INSTANCE;

res.loginCss().ensureInjected();

initWidget(uiBinder.createAndBindUi(this));

}

@UiHandler("loginButton")

void onClick(ClickEvent e) {

if (presenter != null) {

presenter.onLoginButtonClicked(username, password);

}

}

}

@Override

public Widget asWidget() {

return this;

}

@Override

public void setName(String helloName) {

}

@Override

public void setPresenter(ILoginPresenter presenter) {

this.presenter = presenter;

}

}

public interface MyResources extends ClientBundle {

public static final MyResources INSTANCE = GWT.create(MyResources.class);

@Source("css/login.css")

public MyLoginCssResource loginCss();

@Source("css/GWT_App.css")

public CommonCss GWT_AppCss();

@Source("img/logo.png")

ImageResource logo();

}

public interface CommonCss extends CssResource {

String panel();

}

GWT_App.css

@sprite .panel {

gwt-image: 'logo';

background-color: red;

}

When I use the image in a g:Image element, the image is displayed (not as background, of course)

How can I add a background-image directly to the body? Is this possible using UIBinders? How can I generally style the body using UIBinders? And if that's not possible, how can I add a background-image to the HTMLPanel?

--
You received this message because you are subscribed to the Google Groups "GWT Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at https://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/d/optout.