SpriteGUIRendererComponent

Outputs the sprite or animation clip on the UI.

# Properties

[{"index":"SpriteAnimClipPlayType AnimClipPlayType","0":"Sets the animation clip's playback type. You can choose to play only once, on repeat, etc."}]

[{"index":"int32 EndFrameIndex","0":"The last frame number when outputting animation."}]

[{"index":"boolean IgnoreMapLayerCheck (Sync)","0":"Does not perform automatic substitution when the Map Layer's name is specified in SortingLayer."}]

[{"index":"DataRef ImageRUID","0":"The RUID of the image to be displayed on the screen."}]

[{"index":"Vector2 LocalPosition","0":"The image output location."}]

[{"index":"Vector2 LocalScale","0":"The image size."}]

[{"index":"string MaterialId (Sync)","0":"Specifies the Id of the material to be applied to the renderer."}]

[{"index":"int32 OrderInLayer (Sync)","0":"Determines the priority within the same layer. A higher number indicates higher priority."}]

[{"index":"boolean OverrideSorting (Sync) (ReadOnly)","0":"Determines whether to set the SortingLayer and OrderInLayer values manually."}]

[{"index":"float PlayRate","0":"The speed of animation playback."}]

[{"index":"PreserveSpriteType PreserveSprite","0":"Defines how to preserve the original image's proportions\/pivot\/size, etc."}]

[{"index":"string SortingLayer (Sync)","0":"When two or more Entities overlap, the priority is determined according to the Sorting Layer."}]

[{"index":"int32 StartFrameIndex","0":"The starting frame number when outputting the animation."}]

##### inherited from ImageComponent:

[{"index":"Color Color","0":"Sets the default color for the image."}]

[{"index":"boolean DropShadow","0":"Sets whether to output shadows for the image."}]

[{"index":"float DropShadowAngle","0":"Sets the angle to output the shadow."}]

[{"index":"Color DropShadowColor","0":"Sets the shadow color."}]

[{"index":"float DropShadowDistance","0":"Distance between image and shadow."}]

[{"index":"float FillAmount","0":"Percentage of the image with Type setting Filled. Use values between 0 and 1."}]

[{"index":"boolean FillCenter","0":"Sets whether to fill the center of the image area when Type is set to Sliced or Tiled."}]

[{"index":"boolean FillClockWise","0":"Sets the direction of filling when FillMethod is set to Radial90, Radial180, or Radial360. It fills clockwise if the value is true."}]

[{"index":"FillMethodType FillMethod","0":"Filling method when setting the Filled type."}]

[{"index":"int32 FillOrigin","0":"You can set the starting point for filling when Type is set to Filled. If FillMethod is Horizontal or Vertical, you can use values from 0 to 1. If FillMethod is Radial90, Radial180, or Radial360, you can use values from 0 to 3."}]

[{"index":"boolean FlipX","0":"Determines whether to invert based on the X axis of an image."}]

[{"index":"boolean FlipY","0":"Determines whether to invert based on the Y axis of an image."}]

[{"index":"int32 FrameColumn (Deprecated)","0":"This property is no longer used. Please use the AnimationClip Editor."}]

[{"index":"int32 FrameRate (Deprecated)","0":"This property is no longer used. Please use the AnimationClip Editor."}]

[{"index":"int32 FrameRow (Deprecated)","0":"This property is no longer used. Please use the AnimationClip Editor."}]

[{"index":"DataRef ImageRUID","0":"The image RUID to be displayed on the screen."}]

[{"index":"boolean Outline","0":"Sets whether to output the image outline."}]

[{"index":"Color OutlineColor","0":"Image outline color."}]

[{"index":"float OutlineWidth","0":"Outline thickness."}]

[{"index":"boolean RaycastTarget","0":"Becomes the subject of screen touch or mouse clicks if the value is set to true. The UI hidden behind will not receive screen touch and mouse click inputs."}]

[{"index":"ImageType Type","0":"How to display the image."}]

##### inherited from Component:

[{"index":"boolean Enable (Sync)","0":"Checks whether Component is activated or not."}]

[{"index":"boolean EnableInHierarchy (ReadOnly) (HideFromInspector)","0":"Displays whether this Component is Enable in the hierarchy. If Entity Enable is false regardless of Component Enable, returns false."}]

[{"index":"Entity Entity (ReadOnly)","0":"The Entity that owns this component."}]

# Methods

[{"index":"void ChangeMaterial(string materialId)","0":"Replaces the material to be applied to the renderer."}]

[{"index":"void SetAlpha(float alpha)","0":"Sets the alpha value of the sprite."}]

##### inherited from ImageComponent:

[{"index":"void SetNativeSize()","0":"Resizes the image to its original size."}]

##### inherited from Component:

[{"index":"boolean IsClient()","0":"Returns whether the current execution environment is a client or not."}]

[{"index":"boolean IsServer()","0":"Returns whether the current execution environment is a server or not."}]

# Events

[{"index":"OrderInLayerChangedEvent","0":"This event occurs when changing the Component's OrderInLayer."}]

[{"index":"SortingLayerChangedEvent","0":"This event occurs when changing the component's SortingLayer."}]

[{"index":"SpriteGUIAnimPlayerChangeFrameEvent","0":"This event is raised when changing the sprite animation's frame."}]

[{"index":"SpriteGUIAnimPlayerEndEvent","0":"This event is raised when finishing the sprite animation's playback."}]

[{"index":"SpriteGUIAnimPlayerEndFrameEvent","0":"Initializes SpriteAnimPlayerEndEvent to the specified value."}]

[{"index":"SpriteGUIAnimPlayerStartEvent","0":"This event is raised when starting the sprite animation's playback."}]

[{"index":"SpriteGUIAnimPlayerStartFrameEvent","0":"This event is raised when playing the first frame of sprite animation."}]

# Examples

This is an example of controlling sprite animation and using the Fill function.  
You can test by adding it to an Entity with SpriteGUIRendererComponent.
    
    
    @Component
    script CircularProgressAnimator extends Component
        property number Fill = 0
        property boolean IsRequire = false
    
        @ExecSpace("ClientOnly")
        method void OnBeginPlay()
        local renderer = self.Entity.SpriteGUIRendererComponent
        if not renderer then
        	return
        end
    
        self.IsRequire = true
        renderer.ImageRUID = "000000"
        renderer.Type = ImageType.Filled
        renderer.FillMethod = FillMethodType.Radial360
        renderer.Color = Color.white
        renderer.AnimClipPlayType = SpriteAnimClipPlayType.ZigzagLoop
        end
    
        @ExecSpace("ClientOnly")
        method void OnUpdate(number delta)
        if not self.IsRequire then
        	return
        end
    
        self.Fill = math.min( self.Fill + delta, 1)
    
        self.Entity.SpriteGUIRendererComponent.FillAmount = self.Fill
        if self.Fill >= 1.0 then
        	self.Fill = 0
        end
        end
    end
    

# SeeAlso

  * FillMethodType
  * ImageType
  * SpriteAnimClipPlayType
  * math
  * Color
  * [Basic UI Components](/docs?postId=744)
  * [Creating UI](/docs?postId=64)