ImageEditor - Image Saving

  • Save Image
  • Export Image
  • Undo
  • Redo
  • Flip
  • Rotate
Zoom:100%Size:0x0pxPos.:(-,-)Last Action:None
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

The "Export" command of the ImageEditor allows exporting to the following image formats:

  • PNG
  • JPG
  • GIF
  • BMP

Note that changing the format of the edited image might grade the picture's quality. The format, in which the image is saved, determines its size - whether the result file would be with a bigger compression and less quality or vice versa, whether the transperancy of the image would be persisted or not, etc.

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
<%@ Page Title="" Language="C#" Inherits="Telerik.Web.Examples.ImageEditor.ImageSaving.DefaultCS"CodeFile="DefaultCS.aspx.cs"  %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link href="../../common/styles.css" rel="stylesheet" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container size-wide">
        <telerik:RadImageEditor RenderMode="Lightweight" ID="RadImageEditor1" runat="server" ImageUrl="~/ImageEditor/images/stars.jpg" Width="790px" Height="500px">
        <Tools>
            <telerik:ImageEditorToolGroup>
                <telerik:ImageEditorTool CommandName="Save"></telerik:ImageEditorTool>
                <telerik:ImageEditorTool CommandName="Export"></telerik:ImageEditorTool>
                <telerik:ImageEditorToolSeparator></telerik:ImageEditorToolSeparator>
                <telerik:ImageEditorToolStrip CommandName="Undo">
                </telerik:ImageEditorToolStrip>
                <telerik:ImageEditorToolStrip CommandName="Redo">
                </telerik:ImageEditorToolStrip>
                <telerik:ImageEditorToolSeparator></telerik:ImageEditorToolSeparator>
                <telerik:ImageEditorTool CommandName="Flip"></telerik:ImageEditorTool>
                <telerik:ImageEditorTool CommandName="Rotate"></telerik:ImageEditorTool>
            </telerik:ImageEditorToolGroup>
        </Tools>
    </telerik:RadImageEditor>
    </div>
    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?