與gwt Uibinder一起使用具有背景圖像集的CSS

Question

我有一個擴展ClientBundle並定義CssResource的類。 我想在模板Uibinder中使用它作為面板的css屬性（這將是背景。但是在運行期間未顯示圖像。請遵循以下代碼：

Image.css：

 .backgroundPage {
    background-image: url("../resources/Universe-Big-Planet.jpg");
    background-repeat:no-repeat;
/*     background-color: red; */
}

BundleResouces.java：

public interface BundleResources extends ClientBundle {

    public final BundleResources IMPL= (BundleResources) GWT.create(BundleResources.class);

    @Source("../resources/Universe-Big-Planet.jpg")
    ImageResource universeBigPlanet();

    @Source("../resources/Wood_blue.jpg")
    ImageResource woodBlue();

    @Source("Images.css")
    MyStyle mystyle();

    public interface MyStyle extends CssResource{
        String backgroundPage();
    }
}

Home.ui.xml（模板）：

<ui:with field='res' type='it.myproject.movieuniverse.client.bundle.BundleResources'/> 
.............................
</ui:style>
    <g:DockLayoutPanel ui:field="background" unit="PX" styleName="{res.mystyle.backgroundPage}">

Home.java：

public Home() {
    initWidget(uiBinder.createAndBindUi(this));
            Window.addResizeHandler(resizeHandler);
            resizeWidget();
            BundleResources.IMPL.mystyle().ensureInjected();
        }   

如果我嘗試使用background-color：紅色，它可以工作，所以CSS正確指向。 我不知道該怎么解決，謝謝！

Answer 1

檢查您的瀏覽器是否嘗試加載該圖像。 路徑很可能是錯誤的。

路徑應該是服務器上可公開訪問的映像，而不是在開發環境中使用ImageResource的情況。

在您的代碼中，您根本沒有使用ImageResource。 如果您打算使用它，則無需在CSS中指定路徑。