Go back to Built-in plugins
ImageResize plugin provides the resizing functionality of an inline image. With this plugin user can resize an inline image by drag and drop the resizing handles of an inline image.
Create plugin instance
ImageResize is an optional plugin. To use this plugin, you need to manually create instance of this plugin and add it to your editor by createEditor() API or constructor of Editor class. To manually create an instance of this plugin, you can use its constructor:
constructor(
private minWidth: number = 10,
private minHeight: number = 10,
private selectionBorderColor: string = '#DB626C',
private forcePreserveRatio: boolean = false
);
Parameters
minWidth
Minimum widht of the image during resize. Default value is 10px.
minHeight
Minimum height of the image during resize. Default value is 10px.
selectionBorderColor
Color of the resizing border and resizing handle. Default value is '#DB626C'.
forcePreserveRatio
Whether we want to force the inline image preserve its wdith/height ratio during resizing. Default value is false.
Event
When finish resizing, this plugin will trigger a ContentChangedEvent with source equal to 'ImageResize` (ChangeSource.ImageResize).
For more inforation about ContentChangedEvent, please reference to ContentChangedEvent
More info
Package: roosterjs-plugin-image-resize
Support from: Support ImageResizePlugin from 6.4.1, renamed to ImageResize in 6.8.0
Source code: ImageResize.ts