Image Class

Implements the base functionality of an image object.

Declaration

export abstract class Image

Inheritance

Properties

actualSize Property

Specifies the actual image size.

Declaration

actualSize: Size

Property Value

Type Description
Size

The image size.

Remarks

The example below demonstrates how to maintain the aspect ratio when you resize an inserted image.

function resizeImage(img){
    var newWidth = richEdit.unitConverter.centimetersToTwips(10);
    var newHeight = newWidth / img.originalSize.width * img.originalSize.height;
    img.actualSize = new DevExpress.RichEdit.Size(newWidth, newHeight);
};
richEdit.document.images.createInline(richEdit.selection.active, {
    url: 'https://images.unsplash.com/photo-1561037404-61cd46aa615b', callback: resizeImage});

base64 Property

Returns the image content that is encoded with base64 digits.

Declaration

readonly base64: string

Property Value

Type Description
string

The image content.

description Property

Specifies the image description.

Declaration

description: string

Property Value

Type Description
string

The description.

extension Property

Returns the image extension.

Declaration

readonly extension: string

Property Value

Type Description
string

The image extension, for instance '.jpeg'.

interval Property

Returns the text buffer interval that contains the image.

Declaration

readonly interval: Interval

Property Value

Type Description
Interval

An object that contains the interval settings.

Remarks

// remove all images from the second document section
var sectionInterval = richEdit.document.sections.getByIndex(1).interval;
var imgIterator = richEdit.document.images.getIterator(sectionInterval.start);
while(imgIterator.next() && (imgIterator.image.interval.end < sectionInterval.end))
  imgIterator.image.delete();

isLoaded Property

Returns whether the image is loaded.

Declaration

readonly isLoaded: boolean

Property Value

Type Description
boolean

true if the image is loaded; otherwise, false.

originalSize Property

Returns the original size of the image.

Declaration

readonly originalSize: Size

Property Value

Type Description
Size

The image size.

Remarks

The example below demonstrates how to resize the inserted image keeping aspect ratio.

function resizeImage(img){
    var newWidth = richEdit.unitConverter.centimetersToTwips(10);
    var newHeight = newWidth/img.originalSize.width*img.originalSize.height;
    img.actualSize = new DevExpress.RichEdit.Size(newWidth, newHeight);
};
richEdit.document.images.createInline(richEdit.selection.active, {
    url: 'https://images.unsplash.com/photo-1561037404-61cd46aa615b', callback: resizeImage});

url Property

Returns the image URL.

Declaration

readonly url: string | undefined

Property Value

Type Description
string

The image URL.

undefined

The image has no URL.

Methods

changeWrapType(wrapType) Method

Applies a wrap type to the image.

Declaration

changeWrapType(
    wrapType: WrapType
): InlineImage | FloatingImage

Parameters

Name Type Description
wrapType WrapType

The new wrap type.

Returns

Type Description
InlineImage

An object that contains settings of the current image (if the wrapType parameter value is Inline).

FloatingImage

An object that contains settings of the current image (if the wrapType parameter value is not Inline).

Remarks

The example below demonstrates how to change the wrapping type of every document image to Inline.

var imgIterator = richEdit.document.images.getIterator();
while(imgIterator.next())
  imgIterator.image.changeWrapType(DevExpress.RichEdit.WrapType.Inline);

delete Method

Deletes the image from the document.

Declaration

delete(): void

Remarks

// remove all images from the second document section
var sectionInterval = richEdit.document.sections.getByIndex(1).interval;
var imgIterator = richEdit.document.images.getIterator(sectionInterval.start);
while(imgIterator.next() && (imgIterator.image.interval.end < sectionInterval.end))
  imgIterator.image.delete();

getWrapType Method

Returns the image's wrap type.

Declaration

abstract getWrapType(): WrapType

Returns

Type Description
WrapType

A wrap type value.

onLoaded(callback) Method

A function that is called after the image is loaded in the document.

Declaration

onLoaded(
    callback: (image: Image) => void
): void

Parameters

Name Type Description
callback (image: Image) => void

The function. The image parameter returns the processed image.

Remarks

The onLoaded function allows you to perform actions after an image is loaded in the document. Use the image parameter to get information about the loaded image, for instance, original image size.

richEdit.events.contentInserted.addHandler(function(s, e){
  var subDocument = s.document.subDocuments.getById(s.subDocumentId);
  var images = richEdit.document.images.find(e.interval);
  images.forEach(function(image) {
    image.onLoaded(function(image){
      console.log(image.isLoaded); // true
      console.log(image.actualSize);
      console.log(image.originalSize);
      console.log(image.base64);
    });
  });
});