Inline Image
The ImageInline class allows images to be displayed inside the document. The ImageInline can only be used in the context of a Paragraph class. As it is an inline element, it gets placed after the previous inline element until the end of the line. If there is no space left, the element will be wrapped on the next line.
This topic will explain you how to use the ImageInline element.
Add in Code Behind
Here is an example of how to add an ImageInline element in the code behind.
Section section = new Section();
Paragraph paragraph = new Paragraph();
ImageInline image;
Telerik.WinControls.RichTextEditor.UI.Size size = new Telerik.WinControls.RichTextEditor.UI.Size(236, 50);
using (MemoryStream ms = new MemoryStream())
{
Image.FromFile(@"C:\logo.png").Save(ms, System.Drawing.Imaging.ImageFormat.Png);
image = new ImageInline(ms, size, "png");
}
paragraph.Inlines.Add(image);
section.Children.Add(paragraph);
this.radRichTextEditor1.Document.Sections.Add(section);
Dim section As New Section()
Dim paragraph As New Paragraph()
Dim image As ImageInline
Dim my_size As New Telerik.WinControls.RichTextEditor.UI.Size(236, 50)
Using ms As New MemoryStream()
System.Drawing.Image.FromFile("C:\logo.png").Save(ms, System.Drawing.Imaging.ImageFormat.Png)
image = New ImageInline(ms, my_size, "png")
End Using
paragraph.Inlines.Add(image)
section.Children.Add(paragraph)
Me.radRichTextEditor1.Document.Sections.Add(section)
Add via UI
Here is an example of how to allow the user to select an image and add it to the document. For that purpose a RadButton and an OpenFileDialog are used. When the file stream from the OpenFileDialog gets obtained, it's passed to the InsertImage() API method of RadRichTextEditor. This method takes as an argument the extension of the image, which can be again obtained from the FileInfo object. After calling the InsertImage() method, the image will appear in the document with its default width and height.
private void ImageButton_Click(object sender, RoutedEventArgs e)
{
OpenFileDialog openDialog = new OpenFileDialog();
openDialog.Filter = "Images|*.jpg;*.png";
openDialog.Multiselect = false;
DialogResult dialogResult = openDialog.ShowDialog();
if (dialogResult == DialogResult.Yes)
{
Stream stream = openDialog.OpenFile();
string extension = Path.GetExtension(openDialog.FileName);
this.radRichTextEditor1.InsertImage(stream, extension);
}
}
Private Sub ImageButton_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
Dim openDialog As New OpenFileDialog()
openDialog.Filter = "Images|*.jpg;*.png"
openDialog.Multiselect = False
Dim myDialogResult As DialogResult = openDialog.ShowDialog()
If myDialogResult = System.Windows.Forms.DialogResult.Yes Then
Dim stream As Stream = openDialog.OpenFile()
Dim extension As String = Path.GetExtension(openDialog.FileName)
Me.radRichTextEditor1.InsertImage(stream, extension)
End If
End Sub