3

我是 GWT 的新手，并试图按照文档使用 UIBinders。

我想我已经关注了我从以下一些来源以及更多来源中找到的关于该主题的所有内容。
http://www.gwtproject.org/doc/latest/DevGuideClientBundle.html#ImageResource http://www.gwtproject.org/doc/latest/DevGuideUiBinder.html#Using_an_external_resource
GWT UiBinder 和图像精灵

我收到错误无法从 ImageResource 转换为 Image并且无法在其他地方找到此错误。

我做过的事情：
制作了一个可以看到图像的客户端捆绑包。
在java文件中绑定Image。
将客户端捆绑资源导入 UiBinder。

想法：
这是将图像放入 UiBinders 的最简单/推荐的方法吗？
我必须通过 CSS 还是通过 Java 类来完成？

[ERROR] [ideaburger] - Errors in 'generated://D3BBFDA474FCF1195FACA7F6BC58EB44/com/IdeaBurger/client/SiteHeader_SiteHeaderUiBinderImpl.java'
[ERROR] [ideaburger] - Line 115: Type mismatch: cannot convert from ImageResource to Image
[INFO] [ideaburger] - See snapshot: /tmp/com.IdeaBurger.client.SiteHeader_SiteHeaderUiBinderImpl4360657308873324011.java

这就是我所拥有的。

SiteHeader.ui.xml

<!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">
    <ui:with field='res' type='com.IdeaBurger.assets.Images'/>

    <ui:style>

    </ui:style>
    <ui:Image field="logoImage" resource='{res.logo}' />

    <g:HTMLPanel>
        <g:HorizontalPanel>
            <g:cell>
                <g:Label>One</g:Label>
            </g:cell>
        </g:HorizontalPanel>
    </g:HTMLPanel>
</ui:UiBinder>

SiteHeader.java

package com.IdeaBurger.client;
import com.IdeaBurger.assets.Images;
import com.google.gwt.core.client.GWT;
import com.google.gwt.uibinder.client.UiBinder;
import com.google.gwt.uibinder.client.UiField;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.Image;
import com.google.gwt.user.client.ui.Widget;

public class SiteHeader extends Composite {
    private static SiteHeaderUiBinder uiBinder = GWT
            .create(SiteHeaderUiBinder.class);

    @UiField Images res;
    @UiField Image logoImage;

    interface SiteHeaderUiBinder extends UiBinder<Widget, SiteHeader> {
    }

    public SiteHeader() {
        initWidget(uiBinder.createAndBindUi(this));
    }
}

我的客户包，

图片.java

package com.IdeaBurger.assets;

import com.google.gwt.resources.client.ClientBundle;
import com.google.gwt.resources.client.ImageResource;

public interface Images extends ClientBundle {
    @Source("logo.png")
    ImageResource logo();
}

谢谢

4

1 回答 1

2

好的，我想出了至少一种方法来做到这一点。

我在上面的代码中有很多错误，这就是我需要做的修复它。

  • 图片标签应该在 HTMLPanel 内
  • Image 标签似乎想要一个字符串而不是图像资源
  • 我认为g:Image标签需要是img并且资源应该是src
  • 需要使用safeUri

这是工作代码：

SiteHeader.ui.xml

<!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">
    <ui:with field='res' type='com.IdeaBurger.assets.Images'/>

    <ui:style>

    </ui:style>

    <g:HTMLPanel>
        <img src='{res.logo.getSafeUri}' />
        <g:HorizontalPanel>
            <g:cell>
                <g:Label>One</g:Label>
            </g:cell>
        </g:HorizontalPanel>
    </g:HTMLPanel>
</ui:UiBinder>

SiteHeader.java

package com.IdeaBurger.client;
import com.IdeaBurger.assets.Images;
import com.google.gwt.core.client.GWT;
import com.google.gwt.uibinder.client.UiBinder;
import com.google.gwt.uibinder.client.UiField;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.Widget;

public class SiteHeader extends Composite {
    private static SiteHeaderUiBinder uiBinder = GWT
            .create(SiteHeaderUiBinder.class);

    @UiField Images res;

    interface SiteHeaderUiBinder extends UiBinder<Widget, SiteHeader> {
    }

    public SiteHeader() {
        initWidget(uiBinder.createAndBindUi(this));
    }
}

干杯

于 2014-12-11T23:46:15.333 回答