aspnetcore-js-devexpress-dot-richedit-6a50429f.md
Contains members that allow you to manage document images.
export class Images
Creates a floating image at the specified position in the document.
createFloating(
position: number,
options: IInsertedFloatingImageOptions
): FloatingImage
| Name | Type | Description |
|---|---|---|
| position | number |
The document position in which to create the image.
| | options | IInsertedFloatingImageOptions |
The image options.
|
| Type | Description |
|---|---|
| FloatingImage |
The newly created image.
|
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
});
Creates an inline image at the specified position in the document.
createInline(
position: number,
options: IInsertedInlineImageOptions
): InlineImage
| Name | Type | Description |
|---|---|---|
| position | number |
The document position in which to create the image.
| | options | IInsertedInlineImageOptions |
The image options.
|
| Type | Description |
|---|---|
| InlineImage |
The newly created image.
|
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
});
Returns a list of images that are placed at the specified position, interval, or an array of intervals.
find(
position: number | Interval | Interval[]): (InlineImage | FloatingImage
)[]
| Name | Type | Description |
|---|---|---|
| position | number | Interval |
A document position, an interval, or an array of intervals.
|
| Type | Description |
|---|---|
| FloatingImage | InlineImage[] |
A list of images.
|
// find all images in the second section
var images = richEdit.document.images.find(richEdit.document.sections.getByIndex(1).interval);
See Also
How to: Create 'Change Image Size' ribbon items
Returns a list of all images in the document.
getAllImages(): (InlineImage | FloatingImage)[]
| Type | Description |
|---|---|
| FloatingImage | InlineImage[] |
An array of document images.
|
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);
Returns an object that allows you to iterate over an image collection.
getIterator(
startPosition?: number
): ImageIterator
| Name | Type | Description |
|---|---|---|
| startPosition | number |
The document position to start traversing through the images.
|
| Type | Description |
|---|---|
| ImageIterator |
An object that allows you to iterate over an image collection.
|
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);