Images Class
Contains members that allow you to manage document images.
#Declaration
export class Images
#Methods
#createFloating(position, options) Method
Creates a floating image at the specified position in the document.
#Declaration
createFloating(
position: number,
options: IInsertedFloatingImageOptions
): FloatingImage
#Parameters
Name | Type | Description |
---|---|---|
position | number | The document position in which to create the image. |
options | IInserted |
The image options. |
#Returns
Type | Description |
---|---|
Floating |
The newly created image. |
#Remarks
var imgUrl = 'your-image-URL';
var size = new DevExpress.RichEdit.Size(
richEdit.unitConverter.centimetersToTwips(5), richEdit.unitConverter.centimetersToTwips(5)
);
var position = new DevExpress.RichEdit.HorizontalAlignedPosition(
DevExpress.RichEdit.FloatingObjectHorizontalAlignment.Left,
DevExpress.RichEdit.FloatingObjectHorizontalAnchorElement.LeftMargin
);
richEdit.document.images.createFloating(richEdit.selection.active, {
url: imgUrl,
actualSize: size,
wrapType: DevExpress.RichEdit.WrapType.BehindText,
horizontalPosition: position
});
#createInline(position, options) Method
Creates an inline image at the specified position in the document.
#Declaration
createInline(
position: number,
options: IInsertedInlineImageOptions
): InlineImage
#Parameters
Name | Type | Description |
---|---|---|
position | number | The document position in which to create the image. |
options | IInserted |
The image options. |
#Returns
Type | Description |
---|---|
Inline |
The newly created image. |
#Remarks
The example below demonstrates how to create an inline image with the specified settings in the document, and add a figure caption field and image description below the image.
var imgUrl = 'your-image-URL';
var size = new DevExpress.RichEdit.Size(richEdit.unitConverter.centimetersToTwips(12),
richEdit.unitConverter.centimetersToTwips(8));
var imgDescription = 'An image';
// adds a figure caption and image description below the image
function insertImageDescription(img){
richEdit.document.insertParagraph(img.interval.start);
var positionAfterImg = img.interval.start + 2;
richEdit.document.insertParagraph(positionAfterImg);
richEdit.document.insertText(positionAfterImg, ' ' + img.description);
richEdit.selection.setSelection(positionAfterImg);
richEdit.executeCommand(DevExpress.RichEdit.ReferencesTabCommandId.CreateFigureCaptionField);
richEdit.document.insertParagraph(positionAfterImg);
};
richEdit.document.images.createInline(richEdit.selection.active, {
url: imgUrl,
actualSize: size,
description: imgDescription,
callback: insertImageDescription
});
#find(position) Method
Returns a list of images that are placed at the specified position, interval, or an array of intervals.
#Declaration
find(
position: number | Interval | Interval[]): (InlineImage | FloatingImage
)[]
#Parameters
Name | Type | Description |
---|---|---|
position | number | Interval | Interval[] | A document position, an interval, or an array of intervals. |
#Returns
Type | Description |
---|---|
Floating |
A list of images. |
#Remarks
// find all images in the second section
var images = richEdit.document.images.find(richEdit.document.sections.getByIndex(1).interval);
#getAllImages Method
Returns a list of all images in the document.
#Declaration
getAllImages(): (InlineImage | FloatingImage)[]
#Returns
Type | Description |
---|---|
Floating |
An array of document images. |
#Remarks
The code sample below demonstrates how to download the first image in the Rich Text Editor.
var img = richEdit.document.images.getAllImages()[0];
DevExpress.RichEdit.Utils.download(img.base64, 'imageName' + img.extension);
#getIterator Method
Returns an object that allows you to iterate over an image collection.
#Declaration
getIterator(
startPosition?: number
): ImageIterator
#Parameters
Name | Type | Description |
---|---|---|
start |
number | The document position to start traversing through the images. |
#Returns
Type | Description |
---|---|
Image |
An object that allows you to iterate over an image collection. |
#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);