इमेज फ़ील्ड, स्ट्रिंग को वैल्यू के तौर पर और स्ट्रिंग को टेक्स्ट के तौर पर सेव करता है. इसकी वैल्यू, इमेज का एसआरसी होती है. वहीं, इसका टेक्स्ट एक वैकल्पिक स्ट्रिंग होती है, जो इमेज के बारे में बताती है या उसे दिखाती है.
इमेज फ़ील्ड
कोलैप्स किए गए ब्लॉक पर इमेज फ़ील्ड
कॉन्टेंट बनाने के
JSON
{
"type": "example_image",
"message0": "image: %1",
"args0": [
{
"type": "field_image",
"src": "https://www.gstatic.com/codesite/ph/images/star_on.gif",
"width": 15,
"height": 15,
"alt": "*"
}
]
}
JavaScript
Blockly.Blocks['example_image'] = {
init: function() {
this.appendDummyInput()
.appendField("image:")
.appendField(new Blockly.FieldImage(
"https://www.gstatic.com/codesite/ph/images/star_on.gif",
15,
15,
"*"));
}
};
इमेज कंस्ट्रक्टर में ये चीज़ें शामिल होती हैं:
पैरामीटर | ब्यौरा |
---|---|
src |
यह एक स्ट्रिंग है, जो रास्टर इमेज फ़ाइल की ओर ले जाती है. |
width |
इसे शून्य से अलग किसी संख्या में बदलना होगा. |
height |
इसे शून्य से अलग किसी संख्या में बदलना होगा. |
opt_alt |
(ज़रूरी नहीं) एक ऐसी स्ट्रिंग जो इमेज के बारे में सटीक जानकारी देती है या उसे दिखाती है. ब्लॉक छोटा होने पर, इमेज की जगह इसका इस्तेमाल किया जाता है. अगर यह null या undefined है, तो खाली स्ट्रिंग का इस्तेमाल किया जाएगा. |
opt_onClick |
(ज़रूरी नहीं) फ़ील्ड पर क्लिक करने पर कॉल किया जाने वाला फ़ंक्शन. |
opt_flipRtl |
(ज़रूरी नहीं) बूलियन वैल्यू. अगर true है, तो दाएं से बाएं मोड में इमेज को वर्टिकल ऐक्सिस पर फ़्लिप किया जाता है. यह डिफ़ॉल्ट रूप से false पर सेट होता है. "बाईं ओर मुड़ें" और "दाईं ओर मुड़ें" आइकॉन के लिए काम की सुविधा. |
एपिसोड क्रम से लगाने की सेटिंग
इमेज फ़ील्ड को क्रम से नहीं लगाया जा सकता.
क्लिक हैंडलर
इमेज फ़ील्ड, पुष्टि करने वाले व्यक्ति को स्वीकार नहीं करता है. इसके बजाय, यह साफ़ तौर पर एक फ़ंक्शन को स्वीकार करता है. इस फ़ंक्शन को तब कॉल किया जाता है, जब फ़ील्ड पर क्लिक किया जाता है. इसका मतलब है कि इमेज, ब्लॉक पर मौजूद बटन की तरह काम कर सकती हैं.
क्लिक हैंडलर को JavaScript कंस्ट्रक्टर में सेट किया जा सकता है. इसके अलावा, इसे setOnClickHandler
फ़ंक्शन का इस्तेमाल करके भी सेट किया जा सकता है.
यहां क्लिक हैंडलर का एक उदाहरण दिया गया है. इसे कॉल करने पर, ब्लॉक छोटा हो जाता है.
function() {
this.getSourceBlock().setCollapsed(true);
}