क्लाइंटबंडल छवि का उपयोग पृष्ठभूमि-छवि

Question

के रूप में करें I UIBENDER टेम्पलेट में पृष्ठभूमि-छवि के रूप में ClientBundle से एक छवि का उपयोग करने का प्रयास कर रहा हूं। मैंने एक गाइड के रूप में this discussion का उपयोग किया, लेकिन यह काम करने में असमर्थ था।

मेरी जावा वर्ग में मेरे पास है:

public static interface PriceButtonStyles extends ClientBundle 
{ 
    String paidIcon(); 

    @ClientBundle.Source("paid_button_53x31.png") 
    DataResource paid_buttonAsDataResource(); 
} 

@UiField 
PriceButtonStyles priceButtonStyle; 

और फिर इसी टेम्पलेट फ़ाइल में मैं संदर्भ इसे पसंद:

<ui:style field="priceButtonStyle" type="com.example.client.PriceButton.PriceButtonStyles"> 

    @url paidIconUrl paid_buttonAsDataResource; 

    .paidIcon { 
     background: paidIconUrl 0 0 no-repeat; 

    } 
</ui:style> 

इस बिंदु पर

पहले से ही मेरी आईडीई "paidIconUrl" स्ट्रिंग दिखा रहा है लाल में, यह इंगित करता है कि कुछ सही नहीं है:

और वास्तव में, जब मैं इसे चलाने के लिए कोशिश मैं:

ERROR: Type com.ecample.client.PriceButton.PriceButtonStyles does not extend com.google.gwt.resources.client.CssResource Element <ui:style field='priceButtonStyle' type='com.example.client.PriceButton.PriceButtonStyles'> (:7). 
ERROR: Uncaught exception escaped. com.google.gwt.event.shared.UmbrellaException: One or more exceptions caught, see full set in UmbrellaException#getCauses 

इसके अलावा पर Google Groups discussion में यह सुझाव दिया है कि इस <ui:data> बजाय <ui:style> साथ काम कर सकते हैं, तो मुझे लगता है कि काम करने के लिए कोशिश की। लेकिन ऐसा लगता है कि आप दोनों सीएसएस शैलियों (उदा। मेरी paidIcon() विधि) और <ui:data> संसाधनों में डेटा स्रोत शामिल नहीं कर सकते हैं। मैं <ui:data> पर अधिक दस्तावेज नहीं ढूंढ पाया, इसलिए मैं वास्तव में इसके साथ स्ट्रॉ पर बस पकड़ रहा हूं।

Answer 1

यहां मैं यह कैसे करता हूं। यह आपके दृष्टिकोण से थोड़ा अलग है लेकिन इस तरह की स्थिति में मेरे लिए बहुत अच्छा काम किया है। आपका ClientBundle इस प्रकार दिखाई देगा:

.buttonBackground { 
    gwt-image:'paidButtonPNG'; 
    background-repeat:no-repeat; 
} 

आपका * .ui.xml इस प्रकार दिखाई देगा:

<ui:with field="res" type="com.ecample.client.PriceButton.PriceButtonStyles"></ui:with> 
<g:Label styleName="{res.priceButtonStyles.buttonBackground}"><g:Label> 

public static interface PriceButtonStyles extends ClientBundle 
{ 
    @Source("PriceButtonStyles.css") 
    Styles priceButtonStyles(); 

    @Source("paid_button_53x31.png") 
    ImageResource paidButtonPNG(); 

    interface Styles extends CssResource { 
     String buttonBackground(); 
    } 
} 

तो फिर तुम पहले @Source से PriceButtonStyles.css की आवश्यकता होगी

भले ही आपकी शैलियों एक सीएसएस फ़ाइल में हों, फिर भी यह संकलक द्वारा कम से कम और obfuscated हो जाता है।
संपादित करें: मत भूलना कॉल करने के लिए
GWT.<PriceButtonStyles> create(PriceButtonStyles.class).priceButtonStyles().ensureInjected(); इस लिए सबसे अच्छी जगह अपने EntryPoint विधि

Answer 2

है छवियाँ, जहां src गुण सेट करना चाहते हैं इसके अलावा, आप सेट करना होगा

<g:Image url="{res.minimize.getSafeUri.asString}" ....> 

<!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="xxx.myRes"></ui:with> 
.... 

और ग्राहक बंडल एल:

रेस इस तरह instantiated है इस तरह ooks:

package xxx; 

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

public interface myRes extends ClientBundle { 

    @Source("minimize.png") 
    ImageResource minimize(); 

} 

क्लाइंटबंडल बनाना (उदा। GWT.<TitleBarBundle>create(myRes.class);) मेरे मामले में आवश्यक नहीं था।

क्रिस बोइसिंग के आपके उत्तर के लिए धन्यवाद, लेकिन मुझे लगा जैसे मुझे अपने अनुभव भी आपके साथ साझा करना था।

सादर, स्टीफन