2012-07-22 16 views
7

में कोई छवि लोड करने के लिए कैसे मैं डार्ट भाषा और HTML5 कैनवास तत्व को आजमा रहा हूं, लेकिन मैं एक समस्या से फंस गया हूं। मुझे नहीं पता कि डार्ट में एक छवि कैसे लोड करें। मैं CanvasRenderingContext2D प्राप्त कर सकता हूं और इसके साथ मैं fillText() और fillRect() को कॉल कर सकता हूं और सबकुछ काम करता है, लेकिन मैं यह समझने की कोशिश कर रहा हूं कि छवि को कैसे लोड किया जाए और drawImage के साथ खींचे।डार्ट

उत्तर

10

बनाएँ और छवि

ImageElement image = new ImageElement(src: "my_image.png"); 
image.onLoad.listen((e) { 
    // Draw once the image is loaded 
}); 

लोड कैनवास पर ऊपर छवि ड्रा के बाद यह

context.drawImage(image, destX, destY); 
+0

हाय, मैं डार्ट के लिए नया हूँ और जब मैं image.on.load.add समारोह की कोशिश करते हुए कहा कि मैं "लोड" का सदस्य नहीं है कोई त्रुटि मिलती है: वहाँ अभी भी एक और तरीका यह करने के लिए है आयोजन। इसके अलावा कोड संकेत इस के साथ बहुत उपयोगी नहीं है। मैं डार्ट संपादक संस्करण 0.4.2_r20259 और डार्ट एसडीके संस्करण 0.4.2.8_r20259 का उपयोग कर रहा हूं। –

+1

ठीक है, मुझे पता चला क्यों: डार्टलंग कोर में एक अपडेट था ... [डार्ट न्यूज़ एंड अपडेट्स] (http://news.dartlang.org/2013/01/new-dom-event-streams-api.html) । अब "image.on.load.add" को "image.onLoad.listen" के रूप में लिखा जाना चाहिए। –

+0

चूंकि एम 1 ऑफ डार्ट जारी किया गया था, इसलिए सिंटैक्स ने फ़ाइल नाम से पहले "src:" जोड़ दिया है (नया ImageElement (src: "my_image.png");) या इससे रनटाइम त्रुटि हो जाएगी। – daftspaniel

9

नई छवि ऑनलोड वाक्य रचना भरी हुई है:

readFile() { 
    ImageElement image = new ImageElement(src: "plant.png"); 
    document.body.nodes.add(image); 
    image.onLoad.listen(onData, onError: onError, onDone: onDone, cancelOnError: true); 
    } 

    onData(Event e) { 
    print("success: "); 
    } 

    onError(Event e) { 
    print("error: $e"); 
    } 

    onDone() { 
    print("done"); 
    } 
1

मैं इस सवाल का पता पुराना है लेकिन शायद यह किसी और की मदद कर सकता है।

void main() { 
    ImageElement image = new ImageElement(src: "pic.png"); 
    img.onLoad.listen(onData); 
    img.onError.listen(onError); 
} 

void onData(Event e) { 
    print("Load success"); 
} 

void onError(Event e) { 
    print("Error: $e"); 
} 
संबंधित मुद्दे