[null,null,["최종 업데이트: 2025-07-26(UTC)"],[[["\u003cp\u003eImage fields in Blockly store image source (src) as their value and alternative text (alt) for accessibility.\u003c/p\u003e\n"],["\u003cp\u003eThey are created using the \u003ccode\u003eBlockly.FieldImage\u003c/code\u003e constructor in JavaScript, requiring src, width, and height parameters.\u003c/p\u003e\n"],["\u003cp\u003eImage fields are not serializable and cannot be stored directly in block data.\u003c/p\u003e\n"],["\u003cp\u003eThey can function as buttons using an optional onClick handler to trigger actions like collapsing the block.\u003c/p\u003e\n"]]],["An image field's value is the image's `src` URL, and its text is the `alt` string. Key actions include: specifying the `src`, `width`, `height`, and optional `alt` and `onClick` parameters during creation. The `onClick` function enables images to act as buttons. The `opt_flipRtl` parameter is used to mirror the image. The field is constructed through JSON or JavaScript. Image fields are not serializable. The `setOnClickHandler` function can also be used to set the `onClick` function.\n"],null,["# Image fields\n\nAn image field stores a string as its value, and a string as its text. Its\nvalue is the src of the image, while its text is an alt string\ndescribing/representing the image.\n\n#### Image field\n\n#### Image field on collapsed block\n\nCreation\n--------\n\n### JSON\n\n {\n \"type\": \"example_image\",\n \"message0\": \"image: %1\",\n \"args0\": [\n {\n \"type\": \"field_image\",\n \"src\": \"https://www.gstatic.com/codesite/ph/images/star_on.gif\",\n \"width\": 15,\n \"height\": 15,\n \"alt\": \"*\"\n }\n ]\n }\n\n### JavaScript\n\n Blockly.Blocks['example_image'] = {\n init: function() {\n this.appendDummyInput()\n .appendField(\"image:\")\n .appendField(new Blockly.FieldImage(\n \"https://www.gstatic.com/codesite/ph/images/star_on.gif\",\n 15,\n 15,\n \"*\"));\n }\n };\n\nThe image constructor takes in:\n\n| Parameter | Description |\n|---------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| `src` | A string that points to a [raster image](https://developer.mozilla.org/en-US/docs/Glossary/raster_image) file. |\n| `width` | Must cast to a non-zero number. |\n| `height` | Must cast to a non-zero number. |\n| `opt_alt` | (Optional) A string that accurately describes/represents the image. This is used instead of the image when the block is collapsed. If it is `null` or `undefined` an empty string will be used. |\n| `opt_onClick` | (Optional) A function to call when the field is clicked. |\n| `opt_flipRtl` | (Optional) A boolean. If `true`, the image is flipped across the vertical axis when in right-to-left mode. Defaults to `false`. Useful for \"turn left\" and \"turn right\" icons. |\n\nSerialization\n-------------\n\nImage fields are not serializable.\n\nClick handler\n-------------\n\n| **Note:** For information on validators in general see [Validators](/blockly/guides/create-custom-blocks/fields/validators).\n\nThe image field does not accept a validator; instead it explicitly accepts a\nfunction that is called whenever the field is clicked. This means that images\ncan act like buttons that exist on blocks.\n\n*The on click handler can be set in the [JavaScript Constructor](#creation) or\nusing the\n[setOnClickHandler](/blockly/reference/js/blockly.fieldimage_class.setonclickhandler_1_method)\nfunction.*\n\nHere is an example of an on click handler that collapses the block when\ncalled. \n\n function() {\n this.getSourceBlock().setCollapsed(true);\n }"]]
