EditableImage
*Este contenido se traduce usando la IA (Beta) y puede contener errores. Para ver esta página en inglés, haz clic en aquí.
EditableImage permite la creación y manipulación de imágenes en tiempo de ejecución.
Para crear un vacío EditableImage , use AssetService:CreateEditableImage() . Para crear un EditableImage a partir de una imagen existente, use AssetService:CreateEditableImageAsync() .
EditableImage se puede utilizar en cualquier propiedad Content que tome una imagen, como ImageLabel.ImageContent o MeshPart.TextureContent.Esto se hace al establecer la propiedad de contenido en Content.fromObject(editableImage) .
El sistema de coordenadas EditableImage es relativo a la parte superior izquierda de la imagen:
- Superior izquierda: (0, 0)
- Abajo a la derecha: (Size.X - 1, Size.Y - 1)
Cuando usas AssetService:PromptCreateAssetAsync() para publicar un objeto que tiene una propiedad Content que se refiere a un EditableImage, la imagen editable se publica como una imagen y la propiedad se establece en una nueva ID de activo.
Actualizar limitaciones
Solo se puede actualizar un solo EditableImage en el lado de la pantalla por marco.Por ejemplo, si actualizas tres objetos EditableImage que se están mostrando actualmente, tomará tres marcos para que todos se actualicen.
Habilitando EditableImage para experiencias publicadas
Para fines de seguridad, el uso de EditableImage falla por defecto para las experiencias publicadas.Para habilitar el uso de EditableImage , debe tener edad de 13+ verificada y Identificación verificada.Después de que estés verificado, abre Studio .Seleccione Archivo > Configuración del juego > Seguridad y habilite la opción Permitir API de malla e imagen .Recuerde revisar los términos de uso antes de habilitar el alternar/activar.
Permisos
Para evitar el mal uso, AssetService:CreateEditableImageAsync() solo te permite cargar y editar recursos de imagen:
- Que son propiedad del creador de la experiencia (si la experiencia es propiedad de un individuo).
- Que son propiedad de un grupo (si la experiencia es propiedad del grupo).
- Que son propiedad del usuario de Studio iniciado de sesión (si el archivo del lugar aún no se ha guardado o publicado en Roblox).
Las APIs lanzan un error si se usan para cargar un activo que no cumple con los criterios anteriores.
Resumen
Métodos
- DrawCircle(center : Vector2,radius : number,color : Color3,transparency : number,combineType : Enum.ImageCombineType):()
Traza un círculo en el punto especificado.
Dibuja otro EditableImage en esta posición EditableImage en la posición dada.
Proyecta otro EditableImage en un EditableMesh y almacena el resultado en este EditableImage .
- DrawImageTransformed(position : Vector2,scale : Vector2,rotation : number,image : EditableImage,options : Dictionary?):()
Dibuja una imagen en este EditableImage con transformaciones que incluyen escalado y rotación, colocándola en la posición especificada.
Dibuja una línea entre dos puntos proporcionados.
- DrawRectangle(position : Vector2,size : Vector2,color : Color3,transparency : number,combineType : Enum.ImageCombineType):()
Dibuja un rectángulo del tamaño dado en la posición superior izquierda dada.
Lee una región rectangular de píxeles en un buffer.
Escribe una región rectangular de píxeles en la imagen.
Propiedades
Size
Tamaño del EditableImage en píxeles.El tamaño máximo es 1024×1024.Un EditableImage no se puede redimensionar; esta propiedad es de solo lectura.Para cambiar el tamaño o recortar una imagen, crea un nuevo EditableImage y usa DrawImageTransformed() para transferir el contenido; luego llama Destroy() .
Métodos
Destroy
Destruye el contenido de la imagen, recuperando inmediatamente la memoria utilizada.
Devuelve
DrawCircle
Dibuja un círculo en el punto especificado en el EditableImage .Si el círculo es semitransparente, se mezclará con los píxeles detrás de él usando la fusión de fuente.
Parámetros
Centro del círculo, respecto a la esquina superior izquierda del EditableImage . Se permiten posiciones fuera de los límites del lienzo.
Radio del círculo en píxeles.
Color del círculo.
Transparencia del círculo con 0 siendo completamente opaco y 1 siendo completamente transparente.
Cómo los píxeles de la imagen fuente se mezclan con los píxeles de la imagen agregada.
Devuelve
DrawImage
Dibuja otro EditableImage en esta posición EditableImage en la posición dada.Se permiten posiciones fuera de los límites del lienzo de modo que solo se dibuje una parte de la nueva imagen.
Parámetros
Posición en la que se dibujará la esquina superior izquierda de la imagen agregada.
El EditableImage para dibujar en este EditableImage .
Cómo los píxeles de la imagen fuente deben mezclarse con los píxeles de la imagen agregada.
Devuelve
DrawImageProjected
Proyecta otro EditableImage en un EditableMesh y almacena el resultado en este EditableImage usando la configuración de proyección y pincel especificada.
Parámetros
El EditableMesh utilizado para proyectar.
Diccionario de configuración de proyección que incluye los siguientes pares de clave-valor:
Diccionario de configuración de pincel que incluye los siguientes pares de clave-valor:
- AlphaBlendType ( Enum.ImageAlphaType ) que determina cómo se mezclarán los valores alfa de esta proyección.
- ColorBlendType ( Enum.ImageCombineType ) que determina cómo se mezclarán los valores de color de esta proyección.
- Decal ( EditableImage ) como la imagen utilizada para la proyección.
- FadeAngle (número) como el ángulo en grados para que los bordes de proyección se desactivado.
- BlendIntensity (número) como el valor entre 0 y 1 que controla cuánta de la proyección se mezcla en la imagen resultante.
Devuelve
DrawImageTransformed
Este método te permite dibujar un EditableImage en este EditableImage con transformaciones aplicadas, como el escalado y la rotación.El parámetro de posición especifica dónde se colocará el punto pivote de la imagen fuente en esta imagen después de las transformaciones.Se permiten posiciones fuera de los límites del lienzo de modo que solo se dibuje una parte de la nueva imagen.
Parámetros
Posición en píxeles donde se colocará el punto de pivote de la imagen fuente en esta imagen.
Factores de escalado para la imagen de origen a lo largo de los ejes X y Y.
El ángulo de rotación en grados, aplicado alrededor del punto de pivote de la imagen fuente.
La fuente EditableImage para dibujar en esta imagen.
Diccionario opcional para configuración adicional:
- CombineType : Especifica cómo se mezclan los píxeles de la imagen de origen con los de la imagen de destino. El predeterminado es Enum.ImageCombineType.AlphaBlend .
- SamplingMode : Especifica el método de muestreo (por ejemplo, Default para bilinear o Pixelated para el vecino más cercano). El predeterminado es Enum.ResamplerMode.Default .
- PivotPoint : Especifica el punto de pivote dentro de la imagen fuente para el escalado y la rotación. El predeterminado es el centro de la imagen fuente (es decir, Image.Size / 2 ).
Devuelve
Muestras de código
The following code draws a rotated and scaled image onto another.
local AssetService = game:GetService("AssetService")
-- Example of drawing a rotated and scaled image onto another EditableImage
local srcImage = AssetService:CreateEditableImage({ Size = Vector2.new(256, 256) })
local dstImage = AssetService:CreateEditableImage({ Size = Vector2.new(512, 512) })
-- Drawing with a rotation of 45 degrees, scaling by 2x, and placing at (100, 100)
dstImage:DrawImageTransformed(
Vector2.new(100, 100), -- Position
Vector2.new(2, 2), -- Scale
45, -- Rotation (degrees)
srcImage, -- Source image
{
CombineType = Enum.ImageCombineType.AlphaBlend, -- Optional, default is AlphaBlend
SamplingMode = Enum.ResamplerMode.Default, -- Optional, default is Default
PivotPoint = srcImage.Size / 2, -- Optional, default is center of the source image
}
)The following code shows how cropping an image can be done using the EditableImage:DrawImageTransformed() method.
local AssetService = game:GetService("AssetService")
-- Source image
local srcImage = AssetService:CreateEditableImageAsync(Content.fromUri(assetUri))
-- Crop area defined by offset and size
local cropOffset = Vector2.new(50, 50)
local cropSize = Vector2.new(100, 100)
-- Destination image with size of the crop area
local dstImage = AssetService:CreateEditableImage({ Size = cropSize })
-- Position (top-left corner)
local position = Vector2.new(0, 0)
-- Scale factors (no scaling)
local scale = Vector2.new(1, 1)
-- Rotation angle (no rotation)
local rotation = 0
-- Draw the source image onto the destination image with adjusted pivot to crop the image
dstImage:DrawImageTransformed(position, scale, rotation, srcImage, {
CombineType = Enum.ImageCombineType.Overwrite,
PivotPoint = cropOffset, -- Set pivot point to cropOffset to start drawing from there
})DrawLine
Dibuja una línea anti-aliada de un píxel en el EditableImage uno entre los dos puntos proporcionados.
Parámetros
Punto de inicio de la línea.
Punto final de la línea.
Color de la línea.
Transparencia de la línea.
Cómo los píxeles de la imagen fuente se mezclan con los píxeles de la imagen agregada.
Devuelve
DrawRectangle
Dibuja un rectángulo en el EditableImage de la dimensión dada en la posición superior izquierda dada.
Parámetros
Posición de la parte superior izquierda del rectángulo. A diferencia de otros métodos de dibujo, esto no puede estar fuera de los límites del lienzo del EditableImage .
Tamaño del rectángulo para dibujar, en píxeles.
Color del rectángulo.
Transparencia del rectángulo.
Cómo los píxeles de la imagen fuente se mezclan con los píxeles de la imagen agregada.
Devuelve
ReadPixelsBuffer
Lee una región rectangular de píxeles de un EditableImage y la devuelve como un búfer.Cada número en el búfer es un solo byte, con píxeles almacenados en una secuencia de cuatro bytes (rojo, verde, azul y alfa).
Tenga en cuenta que este método usa alfa en lugar de transparencia, a diferencia de los métodos de dibujo EditableImage.
Parámetros
Esquina superior izquierda de la región rectangular de píxeles para leído.
Tamaño de la región rectangular de píxeles para leído.
Devuelve
Buffering donde cada píxel se representa por cuatro bytes (rojo, verde, azul y alfa respectivamente).La longitud del búfer se puede calcular como Size.X * Size.Y * 4 bytes.
Muestras de código
The following code reads two pixels from a EditableImage and creates a part with the average color between them.
local AssetService = game:GetService("AssetService")
local options = { Size = Vector2.new(32, 32) }
local editableImage = AssetService:CreateEditableImage(options)
local pixelsBuffer = editableImage:ReadPixelsBuffer(Vector2.zero, Vector2.new(2, 1))
local color1 =
Color3.fromRGB(buffer.readu8(pixelsBuffer, 0), buffer.readu8(pixelsBuffer, 1), buffer.readu8(pixelsBuffer, 2))
local transparency1 = (255 - buffer.readu8(pixelsBuffer, 3)) / 255
local color2 =
Color3.fromRGB(buffer.readu8(pixelsBuffer, 4), buffer.readu8(pixelsBuffer, 5), buffer.readu8(pixelsBuffer, 6))
local transparency2 = (255 - buffer.readu8(pixelsBuffer, 7)) / 255
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 = workspaceWritePixelsBuffer
Escribe una región rectangular de píxeles a un EditableImage desde un buffer.Cada número en el búfer es un solo byte, con píxeles almacenados en una secuencia de cuatro bytes (rojo, verde, azul y alfa).
Tenga en cuenta que este método usa alfa en lugar de transparencia, a diferencia de los métodos de dibujo EditableImage.
Parámetros
Esquina superior izquierda de la región rectangular para dibujar los píxeles.
Tamaño de la región rectangular de píxeles para escribir.
Un buffer donde cada píxel se representa por cuatro bytes (rojo, verde, azul y alfa respectivamente).La longitud del búfer debe ser Size.X * Size.Y * 4 bytes.
Devuelve
Muestras de código
The following code reads the pixels of a EditableImage and writes back the inverted color values of those pixels.
local AssetService = game:GetService("AssetService")
local options = { Size = Vector2.new(32, 32) }
local editableImage = AssetService:CreateEditableImage(options)
local pixelsBuffer = editableImage:ReadPixelsBuffer(Vector2.zero, editableImage.Size)
for i = 1, editableImage.Size.X * editableImage.Size.Y do
local pixelIndex = (i - 1) * 4
buffer.writeu8(pixelsBuffer, pixelIndex, 255 - buffer.readu8(pixelsBuffer, pixelIndex))
buffer.writeu8(pixelsBuffer, pixelIndex + 1, 255 - buffer.readu8(pixelsBuffer, pixelIndex + 1))
buffer.writeu8(pixelsBuffer, pixelIndex + 2, 255 - buffer.readu8(pixelsBuffer, pixelIndex + 2))
-- Set alpha to 255 to make all pixels fully opaque.
buffer.writeu8(pixelsBuffer, pixelIndex + 3, 255)
end
editableImage:WritePixelsBuffer(Vector2.zero, editableImage.Size, pixelsBuffer)