Skip to main content

Interface: ISelectionStyle

A structure defining the appearance of selected design elements.

Example​

 "canvas": {
   "style": {
     "selection": {
       "color": "red",
       "fillColor": "rgba(255,32,128,0.3)",
       "dashPattern": [1, 1, 1, 10],
       "rotationGripSize": 15,
       "rotationGripSizeOnTouchDevice": 33,
       "resizeGripColor": "pink",
       "resizeGripLineColor": "red",
       "resizeGripLineWidth": 1,
       "resizeGripLineDashPattern": [1, 10],
       "resizeGripSize": 10
     }
   }
 }

Properties​

color​

color: string

The color of the selection border, in the RGBA format. The default value is "rgb(48, 194, 255)".

width​

width: number

The selection border width, in pixels. The default value is 2.

fillColor​

fillColor: string

The fill color of the selection, in the RGBA format.

dashPattern​

dashPattern: number[]

The style of dashes of the selection border, as an array of numbers, which mean the length of the dash or gap in the dashed line.

rotationGripSize​

rotationGripSize: number

The diameter of the rotation grip, in pixels. The default value is 24.

rotationGripSizeOnTouchDevice​

rotationGripSizeOnTouchDevice: number

The diameter of the rotation grip on touch devices, in pixels. The default value is 24.

resizeGripColor​

resizeGripColor: string

The fill color of the resizing grips, in the RGBA format. The default value is "rgba(255,255,255,1)".

resizeGripLineColor​

resizeGripLineColor: string

The color of the resizing grip border, in the RGBA format. The default value is "rgba(255,0,0,1)".

resizeGripLineWidth​

resizeGripLineWidth: number

The border width of resizing grips, in pixels. The default value is 1.

resizeGripSize​

resizeGripSize: number

The size of the resizing grip, in pixels. The default value is 11.

Was this page helpful?