RadImageEditor
Telerik Image Editor control.
Definition
Namespace:Telerik.Web.UI
Assembly:Telerik.Web.UI.dll
Syntax:
[RequiredScript(typeof(RadImageEditorScripts))]
[ClientScriptResource("Telerik.Web.UI.RadImageEditor", "Telerik.Web.UI.Common.Core.js")]
[TelerikToolboxCategory("Miscellaneous")]
[ToolboxBitmap(typeof(RadImageEditor), "Toolbox.Icons.ImageEditor.png")]
[EmbeddedSkin("ImageEditor")]
[EmbeddedSkin("ImageEditor", "Default")]
[RequiredCss("Telerik.Web.UI.Skins.Common.fonticons.css", RenderMode.Lightweight, typeof(RadImageEditor))]
public class RadImageEditor : RadWebControl, IComponent, IDisposable, IParserAccessor, IUrlResolutionService, IDataBindingsAccessor, IControlBuilderAccessor, IControlDesignerAccessor, IExpressionsAccessor, IAttributeAccessor, IScriptControl, IControlResolver, IPostBackDataHandler, ISkinnableControl, IControl, INamingContainer
Inheritance: objectControlWebControlRadWebControlRadImageEditor
Implements:
Inherited Members
Constructors
public RadImageEditor()
Fields
public const string CanvasToolsPath = "Telerik.Web.UI.ImageEditor.Resources.CanvasTools.xml"
public const string DefaultHandlerUrl = "~/Telerik.Web.UI.WebResource.axd"
public const string DefaultToolsPath = "Telerik.Web.UI.ImageEditor.Resources.ToolsFile.xml"
public const string FlipBothImageUrl = "Telerik.Web.UI.Skins.Common.ImageEditor.flipBoth.png"
public const string FlipHorizontalImageUrl = "Telerik.Web.UI.Skins.Common.ImageEditor.flipHorizontal.png"
public const string FlipNoneImageUrl = "Telerik.Web.UI.Skins.Common.ImageEditor.flipNone.png"
public const string FlipVerticalImageUrl = "Telerik.Web.UI.Skins.Common.ImageEditor.flipVertical.png"
Properties
Gets the name of the last (active) command executed by the ImageEditor.
[ClientControlProperty]
[ClientPropertyName("currentCommand")]
public virtual string ActiveCommand { get; }
Gets or sets a value that indicates where the user is allowed to save the image. The options available are: "Client", "Server" and "ClientAndServer". The default is ClientAndServer.
[ClientControlProperty]
[ClientPropertyName("allowedSavingLocation")]
public virtual AllowedSavingLocation AllowedSavingLocation { get; set; }
Gets or sets the alternate text displayed in the edited image when the image is unavailable.
public virtual string AlternateText { get; set; }
Gets or sets a value that indicates whether or not the canvas mode of the ImageEditor will be enabled.
[ClientControlProperty]
[ClientPropertyName("canvasMode")]
public virtual CanvasMode CanvasMode { get; set; }
protected virtual FileBrowserContentProvider ContentProvider { get; set; }
The CssClass property will now be used instead of the former Skin and will be modified in AddAttributesToRender()
protected override string CssClassFormatString { get; }
Overrides:
Gets the unique identifier of the current EditableImage.
[ClientControlProperty]
[ClientPropertyName("imageKey")]
public virtual string CurrentImageKey { get; protected set; }
public virtual string CurrentImageUrl { get; protected set; }
Gets or sets the location to a detailed description for the edited image.
public virtual string DescriptionUrl { get; set; }
Specify settings related to the EditableImage behavior.
[PersistenceMode(PersistenceMode.InnerProperty)]
public EditableImageConfiguration EditableImageSettings { get; }
Gets or sets a bool value that indicates whether the control can be resized.
[ClientControlProperty]
[ClientPropertyName("enableResize")]
public bool EnableResize { get; set; }
Gets or sets a value indicating where the image editor will look for its dialogs.
public virtual string ExternalDialogsPath { get; set; }
A relative path to the dialogs location. For example: "~/controls/RadImageEditorDialogs/".
If specified, the ExternalDialogsPath property will allow you to customize and load the image editor dialogs from normal ASCX files.
Gets or sets the height of the RadImageEditor control
[ClientControlProperty]
[ClientPropertyName("height")]
public override Unit Height { get; set; }
Overrides:
Specifies the URL of the HTTPHandler that serves the cached image.
public virtual string HttpHandlerUrl { get; set; }
The HTTPHandler should either be registered in the application configuration file, or a file with the specified name should exist at the location, which HttpHandlerUrl points to.
If a file is to serve the files, it should inherit the class Telerik.Web.UI.WebResource
Specifies where the cached imaged from the operation will be stored
public virtual ImageStorage ImageCacheStorageLocation { get; set; }
Configures the ImageEditor's ContentProvider.
[PersistenceMode(PersistenceMode.InnerProperty)]
public ImageManagerConfiguration ImageManager { get; }
GUID key used to get all the image keys from the CacheProvider, related with the current instance of the ImageEditor control.
public virtual string ImageStorageKey { get; }
Gets or sets the location of an image to edit within the Image editor
[Bindable(true)]
[ClientControlProperty]
[ClientPropertyName("serverImageUrl")]
public virtual string ImageUrl { get; set; }
Gets or sets a string containing the localization language for the RadImageEditor UI
public virtual string Language { get; set; }
The Localization property specifies the strings that appear in the runtime user interface of RadImageEditor.
public ImageEditorStrings Localization { get; }
Gets or sets a value indicating where the image editor will look for its .resx localization files. By default these files should be in the App_GlobalResources folder. However, if you cannot put the resource files in the default location or .resx files compilation is disabled for some reason (e.g. in a DotNetNuke environment), this property should be set to the location of the resource files.
public string LocalizationPath { get; set; }
A relative path to the dialogs location. For example: "~/controls/RadImageEditorResources/".
If specified, the LocalizationPath property will allow you to load the image editor localization files from any location in the web application.
Gets or sets the lower limit of the zoom level. This is the lowest percentage value up to which the user can zoom out the image in the RadImageEditor.
The default is 25%.
[ClientControlProperty]
[ClientPropertyName("lowerZoomBound")]
public virtual int LowerZoomBound { get; set; }
The name of the javascript function called when a command is fired on the RadImageEditor. This event is triggered when the ImageEditor's ToolBar buttons are clicked or the RadImageEditor.fire(commandName) method is invoked.
[ClientControlEvent]
[ClientPropertyName("commandExecuted")]
public string OnClientCommandExecuted { get; set; }
The name of the javascript function called when a command is firing on the RadImageEditor. This event is triggered when the ImageEditor's ToolBar buttons are clicked or the RadImageEditor.fire(commandName) method is invoked. The event can be canceled.
[ClientControlEvent]
[ClientPropertyName("commandExecuting")]
public string OnClientCommandExecuting { get; set; }
The name of the javascript function called when a tool widget dialog is loaded from the server.
[ClientControlEvent]
[ClientPropertyName("dialogLoaded")]
public string OnClientDialogLoaded { get; set; }
The name of the javascript function called after a change is applied on the image edited.
[ClientControlEvent]
[ClientPropertyName("imageChanged")]
public string OnClientImageChanged { get; set; }
The name of the javascript function called before a change is applied on the image edited. The event can be canceled.
[ClientControlEvent]
[ClientPropertyName("imageChanging")]
public string OnClientImageChanging { get; set; }
The name of the javascript function called when the image in the editor loads in the browser.
[ClientControlEvent]
[ClientPropertyName("imageLoad")]
public string OnClientImageLoad { get; set; }
The name of the javascript function called when the control loads in the browser.
[ClientControlEvent]
[ClientPropertyName("load")]
public string OnClientLoad { get; set; }
The name of the javascript function called when the resizing on the control ends.
[ClientControlEvent]
[ClientPropertyName("resizeEnd")]
public string OnClientResizeEnd { get; set; }
The name of the javascript function called when the resizing is started on the control.
[ClientControlEvent]
[ClientPropertyName("resizeStart")]
public string OnClientResizeStart { get; set; }
The name of the javascript function called after the image is saved on the client or the server.
[ClientControlEvent]
[ClientPropertyName("saved")]
public string OnClientSaved { get; set; }
The name of the javascript function called before the image is saved on the client or the server. The event can be canceled.
[ClientControlEvent]
[ClientPropertyName("saving")]
public string OnClientSaving { get; set; }
The name of the javascript function called, when a given Keyboard ShortCut of the RadImageEditor was hit. The event can be cancelled.
[ClientControlEvent]
[ClientPropertyName("shortCutHit")]
public string OnClientShortCutHit { get; set; }
The name of the javascript function called when the tool's panel dialog is closed.
[ClientControlEvent]
[ClientPropertyName("toolsDialogClosed")]
public string OnClientToolsDialogClosed { get; set; }
Specifies the rendering mode of the control. Setting the mode to Lightweight will yield HTML 5/CSS 3 html and css.
public override RenderMode RenderMode { get; set; }
Overrides:
Lightweight rendering mode might change the outlook of the component in some older browsers that don't support CSS3/HTML5.
Gets or sets a bool value that indicates whether RadAjaxLoadingPanel will be shown over the tools panel.
public bool ShowAjaxLoadingPanel { get; set; }
Gets or sets the skin name for the control user interface.
public override string Skin { get; set; }
A string containing the skin name for the control user interface. The default is string.Empty.
Overrides:
If this property is not set, the control will render using the skin named "Default". If EnableEmbeddedSkins is set to false, the control will not render skin.
Gets or sets a value that controls the behavior of the RadImageEditor's StatusBar.
public StatusBarMode StatusBarMode { get; set; }
protected override bool SupportsRenderingMode { get; }
Overrides:
protected override HtmlTextWriterTag TagKey { get; }
Overrides:
Gets or sets value that controls the behavior of the Toolbar. The options available are: "Default" and "Docked".
[ClientControlProperty]
[ClientPropertyName("toolBarMode")]
public virtual ToolBarMode ToolBarMode { get; set; }
Gets or sets the position of the Toolbar relative to the edited content (content area).
[ClientControlProperty]
[ClientPropertyName("toolBarPosition")]
public virtual ToolBarPosition ToolBarPosition { get; set; }
Tools
ImageEditorToolGroupCollection
Gets the collection containing RadImageEditor tools.
[PersistenceMode(PersistenceMode.InnerProperty)]
public ImageEditorToolGroupCollection Tools { get; }
Gets or sets a string containing the path to the XML toolbar configuration file.
[Bindable(true)]
public string ToolsFile { get; set; }
Use "~" (tilde) as a substitution of the web-application's root directory.
You can also provide this property with an absolute URL which returns a valid XML toolbar configuration file, e.g. http://MyServer/MyApplication/Tools/MyToolsFile.aspx
The panel type to use for loading the tools dialogs' content
public virtual ToolsLoadPanelTypes ToolsLoadPanelType { get; set; }
Gets or sets the maximal number of operations that will be stored in the Undo stack. Zero (0) is the default value, meaning there is no limit on the number of operations stored.
[ClientControlProperty]
[ClientPropertyName("undoLimit")]
public virtual int UndoLimit { get; set; }
The collection of commands that are applied on the client, and need to be applied on the server.
[Browsable(false)]
public virtual ImageOperationCollection UndoStack { get; }
Gets or sets the upper limit of the zoom level. This is the highest percentage value up to which the user can zoom in the image in the RadImageEditor.
The default is 400%.
[ClientControlProperty]
[ClientPropertyName("upperZoomBound")]
public virtual int UpperZoomBound { get; set; }
Methods
protected override void AddAttributesToRender(HtmlTextWriter writer)
Overrides:
Applies the IImageOperation(s) to the passed EditableImage in the order they appear in the operations collection.
public EditableImage ApplyImageOperations(IEnumerable<IImageOperation> operations, EditableImage editableImage)
Collection of IImageOperation(s) to apply.
editableImageEditableImageThe EditableImage to apply the operations to.
Returns:The modified EditableImage object.
Applies the IImageOperation(s) to the current EditableImage in the order they appear in the operations collection.
public EditableImage ApplyImageOperations(IEnumerable<IImageOperation> operations)
Collection of IImageOperation(s) to apply.
Returns:The modified EditableImage object.
protected virtual EditableImage ApplyServerOperation(Dictionary<string, object> data)
Code moved into this method from OnPreRender to make sure it executed when the framework skips OnPreRender() for some reason
protected override void ControlPreRender()
Overrides:
protected override void CreateChildControls()
Overrides:
protected override void DescribeComponent(IScriptDescriptor descriptor)
Overrides:
Forces the ToolsFile to be parsed and loaded at any given time.
public virtual void EnsureToolsFileLoaded()
Extracts the file name from the value of the ImageUrl property.
Gets a reference to the Telerik.Web.UI.ImageEditor.EditableImage that is currently associated with the ImageEditor control.
public EditableImage GetEditableImage()
The Telerik.Web.UI.ImageEditor.EditableImage currently associated with
Gets the format of the image as a string. The format may be different from the actual filename extension.
Applies settings to the ImageEditor when the MetroTouch Skin is used.
protected virtual void HandleMetroTouchSkin(bool isMetroTouch)
Bool value indicating whether the MetroTouch Skin is used.
protected static ICacheImageProvider InitCacheImageProvider(Type cacheImageProvider)
protected virtual void InitContentProvider()
Returns a bool value that indicates whether the command is built-in in the RadImageEditor, or is a custom one.
Loads the client state data
protected override void LoadClientState(Dictionary<string, object> clientState)
Overrides:
protected override void LoadControlState(object savedState)
Overrides:
protected virtual void LoadToolsFile(bool loadOnlyEmptyCollections)
Loads ImageEditor tools from the passed XmlDocument.
public virtual void LoadToolsFile(XmlDocument doc)
The XmlDocument from which the tools are loaded.
Restores view-state information from a previous request that was saved with the System.Web.UI.WebControls.WebControl.SaveViewState() method.
protected override void LoadViewState(object state)
An object that represents the control state to restore.
Overrides:
Raises the ImageChanged event and passes the event related data.
protected virtual void OnImageChanged(EditableImage image)
The editable image that is being modified.
Raises the ImageEditing event and passes the event related data.
protected virtual void OnImageEditing(ImageEditorEditingEventArgs editingEventArgs)
The event arguments passed to the event handler methods.
Raises the ImageLoading event and passes the event related data.
protected virtual void OnImageLoading(ImageEditorLoadingEventArgs loadingEventArgs)
The event arguments passed to the event handler methods.
Raises the ImageSaving event and passes the event related data.
protected virtual void OnImageSaving(ImageEditorSavingEventArgs savingEventArgs)
The event arguments passed to the event handler methods.
Calls the event handler methods of the DialogLoading event.
protected void RaiseDialogLoadingEvent(string dialogName, Control panel, object eventKey)
The name of the dialog that is being loaded.
panelControlThe panel to which the dialog control loaded will be added.
eventKeyobjectThe key used to find the event handler method handling the event.
Calls the event handler methods of the ImageChanged event.
protected void RaiseImageChangedEvent(EditableImage image, object eventKey)
The editable image that is being modified.
eventKeyobjectThe key used to find the event handler method handling the event.
Calls the event handler methods of the ImageEditing event.
protected void RaiseImageEditingEvent(ImageEditorEditingEventArgs editingEventArgs, object eventKey)
The event arguments that will be passed to the event handling methods.
eventKeyobjectThe key used to find the event handler method handling the event.
Calls the event handler methods of the ImageLoading event.
protected void RaiseImageLoadingEvent(ImageEditorLoadingEventArgs loadingEventArgs, object eventKey)
The event arguments that will be passed to the event handling methods.
eventKeyobjectThe key used to find the event handler method handling the event.
Calls the event handler methods of the ImageSaving event.
protected void RaiseImageSavingEvent(ImageEditorSavingEventArgs savingEventArgs, object eventKey)
The event arguments that will be passed to the event handling methods.
eventKeyobjectThe key used to find the event handler method handling the event.
Registers a custom command in case it is missing as a button from the toolbar.
public void RegisterCustomCommand(string commandName)
The name of the command
This method should be called before PreRender
protected override void RenderChildren(HtmlTextWriter writer)
Overrides:
protected override void RenderContents(HtmlTextWriter writer)
Overrides:
Clears all the changes currently applied to the image, and restores the original image.
public void ResetChanges()
Applies the current pending changes on the current RadImageEditor's EditableImage, saves the EditableImage using the ContentProvider's SaveImage method, and invokes the ImageSaving event.
This method requires AllowedSavingLocation propety of RadImageEditor to be set to "Server" or "ClientAndServer".
public string SaveEditableImage(EditableImage editableImage, string imageName, bool overwrite)
The EditableImage to save.
imageNamestringThe name to use if the image is saved on the FileSystem. Use string.Empty to use the existing name.
overwriteboolBool value indicating whether the existing image in the ContentProvider should be overwritten.
Returns:Returns a string message that indicates whether the saving was successful. Empty string means the saving was successful.
Applies the current pending changes on the current RadImageEditor's EditableImage, saves the EditableImage using the ContentProvider's SaveImage method, and invokes the ImageSaving event.
This method requires AllowedSavingLocation propety of RadImageEditor to be set to "Server" or "ClientAndServer".
public string SaveEditableImage(string imageName, bool overwrite)
The name to use if the image is saved on the FileSystem. Use string.Empty to use the existing name.
overwriteboolBool value indicating whether the existing image in the ContentProvider should be overwritten.
Returns:Returns a string message that indicates whether the saving was successful. Empty string means the saving was successful.
Saves any state that was modified after the System.Web.UI.WebControls.Style.TrackViewState() method was invoked.
protected override object SaveViewState()
An object that contains the current view state of the control; otherwise, if there is no view state associated with the control, null.
Overrides:
Causes the control to track changes to its view state so they can be stored in the object's System.Web.UI.Control.ViewState property.
protected override void TrackViewState()
Overrides:
Events
Fires when an operation's dialog is loading its content.
public event ImageEditorDialogEventHandler DialogLoading
Fires when the image has been changed.
public event ImageChangedEventHandler ImageChanged
Fires just before the image is edited on the server. It is fired only during callbacks when the user performs a server operation. Server operations include the following: Crop, AddText, InsertImage. The event can be cancelled and the image edited accordingly.
public event ImageEditorEditingEventHandler ImageEditing
Fires just before the image is loaded from the file system. This event can be canceled and the edited image loaded from a custom location. The event is fired only when the ImageEditor needs to load the initial image.
public event ImageEditorLoadingEventHandler ImageLoading
Fires just before the image is saved on the file system. This event can be canceled and the edited image saved into a custom location.
public event ImageEditorSavingEventHandler ImageSaving