EditableImage
EditableImage allows for the runtime creation and manipulation of images. It can be created from an existing image using AssetService:CreateEditableImageAsync(), or a blank EditableImage can be created with Instance.new(). EditableImage overrides the image/texture displayed when parented to certain objects as follows:
| Object | Overridden |
|---|---|
| MeshPart | MeshPart.TextureID |
| ImageLabel | ImageLabel.Image |
| ImageButton | ImageButton.Image |
| Decal | Decal.Texture |
| Texture | Texture.Texture |
| SurfaceAppearance | SurfaceAppearance.ColorMap |
The EditableImage coordinate system is relative to the top left of the image:
- Top-left: (0, 0)
- Bottom-right: (Size.X - 1, Size.Y - 1)
When publishing an object via AssetService:PromptCreateAssetAsync() that has a property overridden by a child EditableImage, the editable image will be published as an image and the overridden property will be set to the new asset ID.
Summary
Properties
Size of the EditableImage in pixels.
Methods
Copies a subregion of the EditableImage to a new EditableImage.
Crops the EditableImage to the specified subregion.
Draws a circle at the specified point.
Draws another EditableImage into this EditableImage at the given position.
Draws a line between two provided points.
Draws a rectangle of the given size at the given top-left position.
- write parallel
Reads a rectangular region of pixels.
Resizes the contents and canvas.
Rotates the image around its center.
Writes a rectangular region of pixels into the image.
Properties
Size
Size of the EditableImage in pixels. The maximum size is 1024×1024 and attempting to set this property to a larger size will cause it to be clamped at 1024.
Setting this property changes the canvas size of the editable image but does not resize the contents. If changing to a larger size, new pixels will be set to an RGBA value of [0, 0, 0, 0]. If changing to a smaller size, existing pixels will be cropped. Consider using Resize() to update the contents while changing the size.
Methods
Copy
Copies a subregion of the EditableImage to a new EditableImage.
Parameters
Top-left corner of the region to copy, with (0, 0) being the top-left corner of the source image.
Bottom-right corner of the region to copy, exclusive. For example, a max of EditableImage.Size would end the subregion at the bottom and right edges of the source image.
Returns
A new EditableImage containing the specified subregion.
Crop
Crops the EditableImage to the specified subregion.
Parameters
Top-left corner of the region to crop to, with (0, 0) being the top-left corner of the source image.
Bottom-right corner of the region to crop to, exclusive. For example, a max of EditableImage.Size would end the subregion at the bottom and right edges of the source image.
Returns
DrawCircle
Draws a circle at the specified point on the EditableImage. If the circle is semi-transparent, it will be blended with the pixels behind it using source over blending.
Parameters
Center of the circle, relative to the top-left corner of the EditableImage. Positions outside the canvas bounds are allowed.
Radius of the circle in pixels.
Color of the circle.
Transparency of the circle with 0 being fully opaque and 1 being fully transparent.
Returns
DrawImage
Draws another EditableImage into this EditableImage at the given position. Positions outside the canvas bounds are allowed such that only part of the new image is drawn.
Parameters
Position at which the top-left corner of the added image will be drawn.
The EditableImage to draw into this EditableImage.
How the pixels of the source image should be blended with the pixels of the added image.
Returns
DrawLine
Draws an anti-aliased line on the EditableImage one pixel thick between the two provided points.
Parameters
Start point of the line.
End point of the line.
Color of the line.
Transparency of the line.
Returns
DrawProjectionImage
Parameters
Returns
DrawRectangle
Draws a rectangle on the EditableImage of the given size at the given top-left position.
Parameters
Position of the top-left of the rectangle. Unlike other drawing methods, this cannot be outside the canvas bounds of the EditableImage.
Size of the rectangle to draw, in pixels.
Color of the rectangle.
Transparency of the rectangle.
Returns
ReadPixels
Reads a rectangular region of pixels. The pixels will be returned as a flat array where each pixel is represented by four numbers between 0 and 1 (red, green, blue, and alpha respectively). Note that this method uses alpha instead of transparency, unlike the EditableImage drawing methods.
Parameters
Top-left corner of the rectangular region of pixels to read.
Size of the rectangular region of pixels to read.
Returns
Flat array where each pixel is represented by four numbers between 0 and 1 (red, green, blue, and alpha respectively). The length of the array can be calculated as Size.X * Size.Y * 4.
Code Samples
local editableImage = Instance.new("EditableImage")
local pixels = editableImage:ReadPixels(Vector2.zero, Vector2.new(2, 1))
local color1 = Color3.new(pixels[1], pixels[2], pixels[3])
local transparency1 = 1 - pixels[4]
local color2 = Color3.new(pixels[5], pixels[6], pixels[7])
local transparency2 = 1 - pixels[8]
local averageColor = color1:Lerp(color2, 0.5)
local averageTransparency = (transparency1 + transparency2) / 2
local part = Instance.new("Part")
part.Color = averageColor
part.Transparency = averageTransparency
part.Parent = workspaceResize
Resizes the contents and canvas of the EditableImage using bilinear interpolation. Max allowed size is 1024×1024.
Parameters
New size of the EditableImage.
Returns
Rotate
Rotates the EditableImage around its center using bilinear interpolation.
Parameters
Degrees to rotate the image.
Whether the size of the canvas should be updated.
Returns
WritePixels
Writes a rectangular region of pixels into the EditableImage. The pixels are provided as a flat array where each pixel is represented by four numbers between 0 and 1 (red, green, blue, and alpha respectively). Note that this method uses alpha instead of transparency, unlike other EditableImage drawing methods.
Parameters
Top-left corner of the rectangular region to draw the pixels into.
Size of the rectangular region of pixels to write.
Flat array where each pixel is represented by four numbers between 0 and 1 (red, green, blue, and alpha respectively). The length of the array should be Size.X * Size.Y * 4.
Returns
Code Samples
local editableImage = Instance.new("EditableImage")
local pixels = editableImage:ReadPixels(Vector2.zero, editableImage.Size)
for i = 1, editableImage.Size.X * editableImage.Size.Y do
local pixelIndex = 1 + ((i - 1) * 4)
pixels[pixelIndex] = 1 - pixels[pixelIndex]
pixels[pixelIndex + 1] = 1 - pixels[pixelIndex + 1]
pixels[pixelIndex + 2] = 1 - pixels[pixelIndex + 2]
end
editableImage:WritePixels(Vector2.zero, editableImage.Size, pixels)