Commands
The commands of RadImageEditor allows you to execute actions over the image element, like rotate, flip, undo and more.
The RadImageEditor commands apply an effect over the image or execute an action like undo, redo and open/save image. The commands are defined in the ImageEditorCommands, ImageEditorRoutedCommands and ImageCommands classes.
ImageEditorCommands
An instance of the ImageEditorCommands class is created and assigned to the Commands property of RadImageEditor which can be used to access the commands. The ImageEditorCommands instance is associated with the corresponding RadImageEditor control and it executes the commands over its image.
Example 1: Using an image editor command in XAML
<Grid>
<Grid.RowDefinitions>
<RowDefinitions/>
<RowDefinitions Height="Auto"/>
</Grid.RowDefinitions>
<telerik:RadImageEditor x:Name="radImageEditor"/>
<telerik:RadButton Content="Open image" Command="{Binding ElementName=radImageEditor, Path=Commands.Open}" Grid.Row="1"/>
</Grid>
Example 2: Using an image editor command in code
this.radImageEditor.Commands.Open.Execute(null);
The following list shows the available commands in the ImageEditorCommands class.
-
OpenImageCommand: Opens a dialog that allows you to select an image file which will get loaded into the corresponding
RadImageEditorelement. The CommandParameter of the command is optional and it expects a string describing the file extension filter of the file dialog.Example 3: Using OpenImageCommand
C#this.radImageEditor.Commands.Open.Execute("Image Files(*.BMP;*.JPG;*.GIF)|*.BMP;*.JPG;*.GIF|All files (*.*)|*.*"); -
SaveImageCommand: Opens a dialog that allows you to select where on the file system the current image will get saved. The CommandParameter of the command is optional and it expects a string describing the file extension filter of the file dialog.
Example 4: Using SaveImageCommand
C#this.radImageEditor.Commands.Save.Execute("Image Files(*.BMP;*.JPG;*.GIF)|*.BMP;*.JPG;*.GIF|All files (*.*)|*.*"); -
UndoCommand: Undo the last change applied to the image. This command doesn't use the CommandParameter.
Example 5: Using UndoCommand
C#this.radImageEditor.Commands.Undo.Execute(null); -
RedoCommand: Executes a redo action over the current image. This command doesn't use the CommandParameter.
Example 6: Using RedoCommand
C#this.radImageEditor.Commands.Undo.Execute(null); -
Rotate90ClockwiseCommand: Rotates the image by 90 degrees clockwise. This command doesn't use the CommandParameter.
Example 7: Using Rotate90ClockwiseCommand
C#this.radImageEditor.Commands.Rotate90Clockwise.Execute(null); -
Rotate90CounterclockwiseCommand: Rotates the image by 90 degrees clockwise. This command doesn't use the CommandParameter.
Example 8: Using Rotate90CounterclockwiseCommand
C#this.radImageEditor.Commands.Rotate90Counterclockwise.Execute(null); -
Rotate180Command: Rotates the image by 180 degrees clockwise. This command doesn't use the CommandParameter.
Example 9: Using Rotate180Command
C#this.radImageEditor.Commands.Rotate180.Execute(null); -
InvertColorsCommand: Inverts the colors in the image. This command doesn't use the CommandParameter.
Example 10: Using InvertColorsCommand
C#this.radImageEditor.Commands.InvertColors.Execute(null); -
FlipVerticalCommand: Flips the image vertically. This command doesn't use the CommandParameter.
Example 11: Using FlipVerticalCommand
C#this.radImageEditor.Commands.FlipVertical.Execute(null); -
FlipHorizontalCommand: Flips the image horizontally. This command doesn't use the CommandParameter.
Example 12: Using FlipHorizontalCommand
C#this.radImageEditor.Commands.FlipHorizontal.Execute(null); -
ExecuteToolCommand: Executes a tool. The CommandParameter is required and it expects an object of type ITool.
Example 13: Using ExecuteToolCommand
C#ITool tool = new BlurTool(); this.radImageEditor.Commands.ExecuteTool.Execute(tool);
ImageCommands
The ImageCommands class contains static commands that apply image adjustments like crop, blur, resize, draw, etc. The adjustments are executed via classes that implement the IImageCommand interface.
The actions in the ImageCommands class are not dependent on the RadImageEditor control. Instead they work with an instance of RadBitmap which in the context of RadImageEditor holds its current picture. Each command expects a RadBitmap object and returns a modified copy after the corresponding adjustments are applied.
The following list shows the available commands in the ImageCommands class.
-
FlipCommand: Flips the image horizontally or vertically. The context expected by the command is of type
FlipCommandContextwhich contains information about the flip orientation.Example 14: Using ExecuteToolCommand
C#var context = new FlipCommandContext(Orientation.Vertical); RadBitmap newImage = ImageCommands.Flip.Execute(this.radImageEditor.Image, context); this.radImageEditor.Image = newImage;The command also provide two public static methods that can be used instead of the
Executemethod.Example 15: Using FlipCommand static methods
C#RadBitmap horizontallyFlippedImage = FlipCommand.FlipHorizontal(this.radImageEditor.Image); RadBitmap verticallyFlippedImage = FlipCommand.FlipVertical(this.radImageEditor.Image); -
RotateCommand: Rotates the image by the specified degree. The context expected by the command is of type
RotateCommandContextwhich contains information about the rotation degrees and the color of the background that will be shown behind the rotated image.Example 16: Using RotateCommand
C#var context = new RotateCommandContext(22, Colors.Green); RadBitmap newImage = ImageCommands.Rotate.Execute(this.radImageEditor.Image, context); this.radImageEditor.Image = newImage; -
ContrastCommand: Changes the contrast and brightness of the image. The context expected by the command is of type
ContrastCommandContextwhich contains information about the level of brightness and contrast that will be applied over the image. The default brightness is 0 and the allowed values are between -1 and 1. The default contrast is 1.5 and the allowed values are between 0 and 2.Example 17: Using ContrastCommand
C#var context = new ContrastCommandContext(brightness: 0.25, contrast: 0.25); RadBitmap newImage = ImageCommands.Contrast.Execute(this.radImageEditor.Image, context); this.radImageEditor.Image = newImage; -
BlurCommand: Applies a blur effect over the image. The context expected by the command is of type
BlurCommandContextwhich contains information about the blur amount and the input size.Example 18: Using BlurCommand
C#var context = new BlurCommandContext(0.5, new Size(500, 500)); RadBitmap newImage = ImageCommands.Blur.Execute(this.radImageEditor.Image, context); this.radImageEditor.Image = newImage; -
SharpenCommand: Sharpens the image. The context expected by the command is of type
SharpenCommandContextwhich contains information about the blur amount and the input size.Example 19: Using SharpenCommand
C#var originalImage = this.radImageEditor.Image; var context = new SharpenCommandContext(0.5, new Size(originalImage.Width, originalImage.Height)); RadBitmap newImage = ImageCommands.Sharpen.Execute(originalImage, context); this.radImageEditor.Image = newImage; -
HueShiftCommand: Applies a hue shift effect over the image. The context expected by the command is of type
HueShiftCommandContextwhich contains information about hue offset.Example 20: Using HueShiftCommand
C#var context = new HueShiftCommandContext(40); RadBitmap newImage = ImageCommands.HueShift.Execute(this.radImageEditor.Image, context); this.radImageEditor.Image = newImage; -
InvertColorsCommand: Inverts the colors in the image. This command doesn't use a context object.
Example 21: Using InvertColorsCommand
C#RadBitmap newImage = ImageCommands.InvertColors.Execute(this.radImageEditor.Image, null); this.radImageEditor.Image = newImage; -
SaturationCommand: Applies saturation to the image. The context expected by the command is of type
SaturationCommandContextwhich contains information about saturation.Example 22: Using SaturationCommand
C#var context = new SaturationCommandContext(40); RadBitmap newImage = ImageCommands.Saturation.Execute(this.radImageEditor.Image, context); this.radImageEditor.Image = newImage; -
CropCommand: Crops the image. The context expected by the command is of type
CropCommandContextwhich contains information about the top left position where the crop starts and the final size of the cropped image.Example 23: Using CropCommand
C#var context = new CropCommandContext(10, 10, 250, 250); RadBitmap newImage = ImageCommands.Crop.Execute(this.radImageEditor.Image, context); this.radImageEditor.Image = newImage; -
ResizeCommand: Resizes the image. The context expected by the command is of type
ResizeCommandContextwhich contains information about the new width and height of the image.Example 24: Using ResizeCommand
C#var context = new ResizeCommandContext(250, 250); RadBitmap newImage = ImageCommands.Resize.Execute(this.radImageEditor.Image, context); this.radImageEditor.Image = newImage; -
CanvasResizeCommand: Resizes the canvas. The context expected by the command is of type
CanvasResizeCommandContextwhich contains information about the image alignment, the new size of the canvas and the background color.Example 25: Using CanvasResizeCommand
C#var context = new CanvasResizeCommandContext(Colors.Green, HorizontalAlignment.Left, VerticalAlignment.Top, 250, 250); RadBitmap newImage = ImageCommands.CanvasResize.Execute(this.radImageEditor.Image, context); this.radImageEditor.Image = newImage; -
RoundCornersCommand: Adds round corners around the image. The context expected by the command is of type
RoundCornersCommandContextwhich contains information about the corner radius, the border and the background.Example 26: Using RoundCornersCommandd
C#var context = new RoundCornersCommandContext(10, Colors.Green, 2, Colors.Black); RadBitmap newImage = ImageCommands.RoundCorners.Execute(this.radImageEditor.Image, context); this.radImageEditor.Image = newImage; -
DrawTextCommand: Draws text over the image. The context expected by the command is of type
DrawTextCommandContextwhich contains information about text and its position.Example 27: Using DrawTextCommand
C#var context = new DrawTextCommandContext(16, Colors.Green, "My text", new Point(100, 100), 0); RadBitmap newImage = ImageCommands.DrawText.Execute(this.radImageEditor.Image, context); this.radImageEditor.Image = newImage; -
DrawCommand: Draws a shape path over the image. The context expected by the command is of type
DrawCommandContextwhich contains information about the drawn path.Example 28: Using DrawCommand
C#var path = new Path(); path.Data = new EllipseGeometry(new Point(100, 100), 10, 10); path.Fill = Brushes.Green; path.Stroke = Brushes.Red; path.StrokeThickness = 3; var requiredParent = new Grid(); requiredParent.Children.Add(path); var context = new DrawCommandContext(path); RadBitmap newImage = ImageCommands.Draw.Execute(this.radImageEditor.Image, context); this.radImageEditor.Image = newImage;
ImageEditorRoutedCommands
The ImageEditorRoutedCommands class contains static RoutedCommands which wrap few of the commands of the ImageEditorCommands class.
The following list shows the available commands in the ImageEditorRoutedCommands class.
-
FlipHorizontal
-
FlipVertical
-
Rotate90Clockwise
-
Rotate90Counterclockwise
-
InvertColors
-
ExecuteTool
-
Undo
-
Redo
-
Open
-
Save
Example 29: Using the ImageEditorRoutedCommands
<Grid>
<telerik:RadImageEditor x:Name="radImageEditor" />
<telerik:RadButton Content="Invert Colors"
Command="commands:ImageEditorRoutedCommands.InvertColors"
CommandTarget="{Binding ElementName=radImageEditor}"/>
</Grid>
The commands namespace declaration points to the following namespace: xmlns:commands="clr-namespace:Telerik.Windows.Media.Imaging.ImageEditorCommands.RoutedCommands;assembly=Telerik.Windows.Controls.ImageEditor".