Skip to main content

IconProps

                            
                              
                                interface 
                                IconProps
                                extends 
                                
                                  
                                    
                                      ImgProps
                                    
                                  
                                
                              
                              

Properties

alignContent

Inherited from ImgProps.alignContent

alignItems

Inherited from ImgProps.alignItems

alignSelf

Inherited from ImgProps.alignSelf

alpha

                            
                              
                                alpha
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              

The alpha value of this image.

Unlike opacity, the alpha value affects only the image itself, leaving thefill, stroke, and children intact.

Inherited from ImgProps.alpha

antialiased

Inherited from ImgProps.antialiased

arrowSize

Controls the size of the end and start arrows.

To make the arrows visible make sure to enable startArrow and/or endArrow .

Inherited from ImgProps.arrowSize

basis

Inherited from ImgProps.basis

bottom

The position of the bottom edge of this node.

This shortcut property will set the node's position so that the bottom edgeends up in the given place.If present, overrides the position property.

Inherited from ImgProps.bottom

bottomLeft

The position of the bottom left corner of this node.

This shortcut property will set the node's position so that the bottom leftcorner ends up in the given place.If present, overrides the position property.

Inherited from ImgProps.bottomLeft

bottomRight

The position of the bottom right corner of this node.

This shortcut property will set the node's position so that the bottomright corner ends up in the given place.If present, overrides the position property.

Inherited from ImgProps.bottomRight

cache

                            
                              
                                cache
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      boolean
                                    
                                  
                                
                              
                              
Inherited from ImgProps.cache

cachePadding

Controls the padding of the cached canvas used by this node.

By default, the size of the cache is determined based on the bounding boxof the node and its children. That includes effects such as stroke orshadow. This property can be used to expand the cache area further.Usually used to account for custom effects created by shaders .

Inherited from ImgProps.cachePadding

cachePaddingBottom

Controls the padding of the cached canvas used by this node.

By default, the size of the cache is determined based on the bounding boxof the node and its children. That includes effects such as stroke orshadow. This property can be used to expand the cache area further.Usually used to account for custom effects created by shaders .

Inherited from ImgProps.cachePaddingBottom

cachePaddingLeft

Controls the padding of the cached canvas used by this node.

By default, the size of the cache is determined based on the bounding boxof the node and its children. That includes effects such as stroke orshadow. This property can be used to expand the cache area further.Usually used to account for custom effects created by shaders .

Inherited from ImgProps.cachePaddingLeft

cachePaddingRight

Controls the padding of the cached canvas used by this node.

By default, the size of the cache is determined based on the bounding boxof the node and its children. That includes effects such as stroke orshadow. This property can be used to expand the cache area further.Usually used to account for custom effects created by shaders .

Inherited from ImgProps.cachePaddingRight

cachePaddingTop

Controls the padding of the cached canvas used by this node.

By default, the size of the cache is determined based on the bounding boxof the node and its children. That includes effects such as stroke orshadow. This property can be used to expand the cache area further.Usually used to account for custom effects created by shaders .

Inherited from ImgProps.cachePaddingTop

children

Inherited from ImgProps.children

clip

                            
                              
                                clip
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      boolean
                                    
                                  
                                
                              
                              
Inherited from ImgProps.clip

closed

                            
                              
                                closed
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      boolean
                                    
                                  
                                
                              
                              

Whether the curve should be closed.

Closed curves have their start and end points connected.

Inherited from ImgProps.closed

color

The color of the icon

Provide the color in one of the following formats:

  • named color like red , darkgray , …
  • hexadecimal string with # like #bada55 , #141414 Value can be either RGB or RGBA: #bada55 , #bada55aa (latter is partially transparent)The shorthand version (e.g. #abc for #aabbcc is also possible.)

columnGap

Inherited from ImgProps.columnGap

composite

                            
                              
                                composite
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      boolean
                                    
                                  
                                
                              
                              
Inherited from ImgProps.composite

compositeOperation

                            
                              
                                compositeOperation
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      GlobalCompositeOperation
                                    
                                  
                                
                              
                              
Inherited from ImgProps.compositeOperation

cornerSharpness

Controls the sharpness of smoothCorners .

This property only affects the way rounded corners are drawn. To controlthe corner radius use the radius property.

Requires smoothCorners to be enabled to have any effect.By default, corner sharpness is set to 0.6 which represents a smooth,circle-like rounding. At 0 the edges are squared off.

Inherited from ImgProps.cornerSharpness

direction

Inherited from ImgProps.direction

end

                            
                              
                                end
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              

A percentage from the start after which the curve should be clipped.

The portion of the curve that comes after the given percentage will bemade invisible.

This property is usefully for animating the curve appearing on the screen.The value of 0 means the very start of the curve (accounting for the startOffset ) while 1 means the very end (accounting for the endOffset ).

Inherited from ImgProps.end

endArrow

                            
                              
                                endArrow
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      boolean
                                    
                                  
                                
                              
                              

Whether to display an arrow at the end of the visible curve.

Use arrowSize to control the size of the arrow.

Inherited from ImgProps.endArrow

endOffset

The offset in pixels from the end of the curve.

This property lets you specify where along the defined curve the actualvisible portion ends. For example, setting it to 20 will make the last20 pixels of the curve invisible.

This property is useful for trimming the curve using a fixed distance.If you want to animate the curve appearing on the screen, use end instead.

Inherited from ImgProps.endOffset

fill

Inherited from ImgProps.fill

filters

                            
                              
                                filters
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      Filter
                                      []
                                    
                                  
                                
                              
                              
Inherited from ImgProps.filters

fontFamily

Inherited from ImgProps.fontFamily

fontSize

                            
                              
                                fontSize
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.fontSize

fontStyle

Inherited from ImgProps.fontStyle

fontWeight

Inherited from ImgProps.fontWeight

gap

Inherited from ImgProps.gap

grow

                            
                              
                                grow
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.grow

height

Inherited from ImgProps.height

icon

                            
                              
                                icon
                                : 
                                SignalValue
                                
                                  
                                    
                                      string
                                    
                                  
                                
                              
                              

The identifier of the icon.

You can find identifiers on Icônes .They can look like this:

  • mdi:language-typescript
  • ph:anchor-simple-bold
  • ph:activity-bold

justifyContent

Inherited from ImgProps.justifyContent

key

                            
                              
                                key
                                ?: 
                                string
                              
                              
Inherited from ImgProps.key

layout

Inherited from ImgProps.layout

left

The position of the left edge of this node.

This shortcut property will set the node's position so that the left edgeends up in the given place.If present, overrides the position property.

Inherited from ImgProps.left

letterSpacing

Inherited from ImgProps.letterSpacing

lineCap

                            
                              
                                lineCap
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      CanvasLineCap
                                    
                                  
                                
                              
                              
Inherited from ImgProps.lineCap

lineDash

                            
                              
                                lineDash
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                      []
                                    
                                  
                                
                              
                              
Inherited from ImgProps.lineDash

lineDashOffset

Inherited from ImgProps.lineDashOffset

lineHeight

Inherited from ImgProps.lineHeight

lineJoin

                            
                              
                                lineJoin
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      CanvasLineJoin
                                    
                                  
                                
                              
                              
Inherited from ImgProps.lineJoin

lineWidth

Inherited from ImgProps.lineWidth

margin

Inherited from ImgProps.margin

marginBottom

Inherited from ImgProps.marginBottom

marginLeft

Inherited from ImgProps.marginLeft

marginRight

Inherited from ImgProps.marginRight

marginTop

Inherited from ImgProps.marginTop

maxHeight

Inherited from ImgProps.maxHeight

maxWidth

Inherited from ImgProps.maxWidth

middle

The position of the center of this node.

This shortcut property will set the node's position so that the center endsup in the given place.If present, overrides the position property.When offset is not set, this will be the same as the position .

Inherited from ImgProps.middle

minHeight

Inherited from ImgProps.minHeight

minWidth

Inherited from ImgProps.minWidth

offset

Inherited from ImgProps.offset

offsetX

                            
                              
                                offsetX
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.offsetX

offsetY

                            
                              
                                offsetY
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.offsetY

opacity

                            
                              
                                opacity
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.opacity

padding

Inherited from ImgProps.padding

paddingBottom

Inherited from ImgProps.paddingBottom

paddingLeft

Inherited from ImgProps.paddingLeft

paddingRight

Inherited from ImgProps.paddingRight

paddingTop

Inherited from ImgProps.paddingTop

position

Inherited from ImgProps.position

radius

Rounds the corners of this rectangle.

The value represents the radius of the quarter circle that is used to roundthe corners. If the value is a number, the same radius is used for allcorners. Passing an array of two to four numbers will set individual radiifor each corner. Individual radii correspond to different corners dependingon the number of values passed:

                            
                              
                                // top-left-and-bottom-right | top-right-and-bottom-left
                                
                                
[ 10 , 30 ]
// top-left | top-right-and-bottom-left | bottom-right
[ 10 , 20 , 30 ]
// top-left | top-right | bottom-right | bottom-left
[ 10 , 20 , 30 , 40 ]
Inherited from ImgProps.radius

ratio

                            
                              
                                ratio
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.ratio

ref

                            
                              
                                ref
                                ?: 
                                ReferenceReceiver
                                
                                  
                                    
                                      any
                                    
                                  
                                
                              
                              
Inherited from ImgProps.ref

The position of the right edge of this node.

This shortcut property will set the node's position so that the right edgeends up in the given place.If present, overrides the position property.

Inherited from ImgProps.right

rotation

                            
                              
                                rotation
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.rotation

rowGap

Inherited from ImgProps.rowGap

scale

Inherited from ImgProps.scale

scaleX

                            
                              
                                scaleX
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.scaleX

scaleY

                            
                              
                                scaleY
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.scaleY

shaders

                            
                              
                                shaders
                                ?: 
                                PossibleShaderConfig
                              
                              
Experimental
This is an experimental feature . The behavior and API may change drastically between minor releases.
Inherited from ImgProps.shaders

shadowBlur

Inherited from ImgProps.shadowBlur

shadowColor

Inherited from ImgProps.shadowColor

shadowOffset

Inherited from ImgProps.shadowOffset

shadowOffsetX

Inherited from ImgProps.shadowOffsetX

shadowOffsetY

Inherited from ImgProps.shadowOffsetY

shrink

                            
                              
                                shrink
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.shrink

size

Inherited from ImgProps.size

skew

Inherited from ImgProps.skew

skewX

                            
                              
                                skewX
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.skewX

skewY

                            
                              
                                skewY
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.skewY

smoothCorners

Enables corner smoothing.

This property only affects the way rounded corners are drawn. To controlthe corner radius use the radius property.

When enabled, rounded corners are drawn continuously using Bézier curvesrather than quarter circles. The sharpness of the curve can be controlledwith cornerSharpness .

You can read more about corner smoothing in this article by Nick Lawrence .

Inherited from ImgProps.smoothCorners

smoothing

                            
                              
                                smoothing
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      boolean
                                    
                                  
                                
                              
                              

Whether the image should be smoothed.

When disabled, the image will be scaled using the nearest neighborinterpolation with no smoothing. The resulting image will appear pixelated.

Inherited from ImgProps.smoothing

spawner

Deprecated

Use children instead.

Inherited from ImgProps.spawner

src

                            
                              
                                src
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      
                                        
                                          
                                            null
                                          
                                          
                                            string
                                          
                                        
                                      
                                    
                                  
                                
                              
                              

The source of this image.

Inherited from ImgProps.src

start

                            
                              
                                start
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              

A percentage from the start before which the curve should be clipped.

The portion of the curve that comes before the given percentage will bemade invisible.

This property is usefully for animating the curve appearing on the screen.The value of 0 means the very start of the curve (accounting for the startOffset ) while 1 means the very end (accounting for the endOffset ).

Inherited from ImgProps.start

startArrow

                            
                              
                                startArrow
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      boolean
                                    
                                  
                                
                              
                              

Whether to display an arrow at the start of the visible curve.

Use arrowSize to control the size of the arrow.

Inherited from ImgProps.startArrow

startOffset

The offset in pixels from the start of the curve.

This property lets you specify where along the defined curve the actualvisible portion starts. For example, setting it to 20 will make the first20 pixels of the curve invisible.

This property is useful for trimming the curve using a fixed distance.If you want to animate the curve appearing on the screen, use start instead.

Inherited from ImgProps.startOffset

stroke

Inherited from ImgProps.stroke

strokeFirst

Inherited from ImgProps.strokeFirst

tagName

                            
                              
                                tagName
                                ?: 
                                keyof 
                                HTMLElementTagNameMap
                              
                              
Inherited from ImgProps.tagName

textAlign

                            
                              
                                textAlign
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      CanvasTextAlign
                                    
                                  
                                
                              
                              
Inherited from ImgProps.textAlign

textDirection

                            
                              
                                textDirection
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      CanvasDirection
                                    
                                  
                                
                              
                              
Inherited from ImgProps.textDirection

textWrap

Inherited from ImgProps.textWrap

top

The position of the top edge of this node.

This shortcut property will set the node's position so that the top edgeends up in the given place.If present, overrides the position property.

Inherited from ImgProps.top

topLeft

The position of the top left corner of this node.

This shortcut property will set the node's position so that the top leftcorner ends up in the given place.If present, overrides the position property.

Inherited from ImgProps.topLeft

topRight

The position of the top right corner of this node.

This shortcut property will set the node's position so that the top rightcorner ends up in the given place.If present, overrides the position property.

Inherited from ImgProps.topRight

width

Inherited from ImgProps.width

wrap

Inherited from ImgProps.wrap

x

                            
                              
                                x
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.x

y

                            
                              
                                y
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.y

zIndex

                            
                              
                                zIndex
                                ?: 
                                SignalValue
                                
                                  
                                    
                                      number
                                    
                                  
                                
                              
                              
Inherited from ImgProps.zIndex