ONLINE HELP
 WINDEVWEBDEV AND WINDEV MOBILE

Help / Developing an application or website / Controls, windows and pages / Controls: Available types / Image Editor control (WEBDEV)
  • Overview
  • Features
  • Opening an image in the editor
  • Drawing on the image
  • Inserting a shape in the image
  • Inserting text into the image
  • Manipulating the image
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaReports and QueriesUser code (UMC)
WEBDEV
WindowsLinuxPHPWEBDEV - Browser code
WINDEV Mobile
AndroidAndroid Widget iPhone/iPadIOS WidgetApple WatchMac CatalystUniversal Windows 10 App
Others
Stored procedures
WEBDEV Image Editor control: Features
Overview
The WEBDEV Image Editor control includes many features, accessible via several ribbons at the top and bottom of the control.
WEBDEV image editor
Features

Opening an image in the editor

To open an image in the Image Editor control, you can:
  • drop an image file directly onto the control,
  • drop an image from the page.
  • click the "+" button in the ribbon at the bottom of the editor.
    Adding an image
    The menu allows you to:
    • open an image from the computer: simply specify the file path in the window that appears (or drop the desired file).
      Add a file
    • open an image from a URL: simply specify the corresponding URL in the window that appears.
      Adding a URL

Drawing on the image

The Image Editor control allows you to draw freely on the displayed image, using the pencil, marker or highlighter tool.
Adding a drawing
When one of these options is selected, a new toolbar appears at the bottom of the control, allowing you to configure the color and thickness of the line.
Configuration
You can also delete the current line.

Inserting a shape in the image

The Image Editor control allows you to insert:
  • a line or an arrow on the displayed image.
    Adding a line
  • a shape (triangle, rectangle or circle).
    Add a shape
When one of these options is selected, a new toolbar appears at the bottom of the control, allowing you to configure the color and thickness of the line.
You can also delete the current shape.

Inserting text into the image

The Image Editor control allows you to insert text into an image.
Adding text
When one of these options is selected, the editable text appears in a text area inside the image, and a new toolbar appears at the bottom of the control, allowing you to configure the font, color, etc, ....
Text configuration
You can also delete the current text.

Manipulating the image

The Image Editor control allows you to manipulate images.
Manipulating the image
You can crop, enlarge and rotate the image. The toolbar at the bottom of the control adapts to show the different options:
Manipulating the image
To zoom the image, you can use:
  • the mouse wheel,
  • the + and - buttons in the toolbar at the top of the editor.
You can save the image at any time by downloading it via the Download button in the toolbar at the top of the editor.
Minimum version required
  • Version 26
Comments
Click [Add] to post a comment

Last update: 05/26/2022

Send a report | Local help