ONLINE HELP
 WINDEVWEBDEV AND WINDEV MOBILE

Help / Developing an application or website / Controls, windows and pages / Controls: Available types / Image control
  • Display modes
  • Transparency
  • Position, Symmetry
  • Position
  • Symmetry
  • Programming
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
Display modes
An image can be displayed in a window, a window control, a report control, a page control or a block according to several display modes.
These display modes produce different results:

100%: The image is displayed at 100% from the top left corner of the window, the control or the block.

Centered: The image is displayed at 100% and it is centered in the window, control or block.

Stretched: The image is stretched to occupy the entire surface of the window, control or block.
Universal Windows 10 App This mode is not supported in Universal Windows 10 App mode.

Tiled: The image is displayed at 100% and it is repeated in order to occupy the entire surface of the window, control or block.

Homothetic: The image is proportionally enlarged to be entirely displayed in the window, control or block.

Homothetic extended: The image is proportionally enlarged in order for the smallest image side to to be entirely displayed in the window, control or block.

Homothetic centered: The image is homothetic and it is centered in the window, control or block.

Homothetic centered extended: The image is extended and it is centered in the window, control or block.
Homothetic without enlargement: If the image can be entirely displayed in the window, Image control or block, it is displayed at 100%. If the image is bigger than the window, Image control or block, it is automatically reduced proportionally in order to be entirely displayed.

Java This mode is not supported in Java.
Universal Windows 10 App This mode is not supported in Universal Windows 10 App mode.

In homothetic mode, image quality can be improved when the image is reduced from its original size:
  • WINDEV "High-quality display (HQ)" option when selecting the display mode in the "General" tab of the control description.
  • WEBDEV - Server code "High quality" when selecting the display settings in the "General" tab of the control description
AndroidAndroid Widget PHP This option is not available.
WEBDEV - Server code Thumbnail control: Only the "Homothetic centered" and "Stretched" modes are available.
The "Actual preview enabled" option shows the result of the display modes on the image associated with the Image control.
Transparency
When displaying an image, you have the ability to define its transparency options. These options will be kept even if the image is modified programmatically (Image property).
The possible options are as follows:
  • Transparent magenta: The magenta color in the image will be transparent when the image is displayed in the editor or at runtime.
    Transparency: none
    Transparency: none
    Transparent magenta
    Transparent magenta

    Universal Windows 10 AppAndroidAndroid Widget The magenta cannot be used to manage the transparency.
  • Top left pixel: all pixels with the same color as the top left pixel of the image will be transparent.
    WEBDEV - Server code The transparency of the top left pixed does not operate on the generated images (dynamically created on the server).
Caution: The use of a transparent background image significantly slows down the re-display of the window (time multiplied by 3 or 4). We advise you to:
  • avoid using images with a transparent background.
  • for the images in GIF or PSD format, make sure that no transparency color is described in the image format (via an image processing software for example).
Universal Windows 10 App The transparency of the image cannot be managed.
Position, Symmetry
WINDEVUniversal Windows 10 AppiPhone/iPadJava

Position

This parameter is used to define the position of the top left corner of the image in relation to the window or to the window control.
These options will be kept even if the image is modified programmatically (Image property).
WINDEVJava

Symmetry

The symmetry options are used to change the orientation of the image in the image file. These options will be kept even if the image is modified programmatically (Image property).
The options are as follows:
Vertical symmetry
Vertical symmetry
Horizontal symmetry
Horizontal symmetry
Horizontal and vertical symmetry
Horizontal and vertical symmetry
Programming
The images can be managed through programming:
  • via the following properties:
    BackgroundImageThe BackgroundImage property is used to identify and modify the background color of an element: window, page, control or report.
    BackgroundImagePrintedThe BackgroundImagePrinted is used to:
    • Determine if the background image of a report (form or other) should be printed.
    • Print (or not) the background image of a report.
    BackgroundImageStateThe BackgroundImageState property allows you to get and change the number of drawings in the image associated with the background of a button.
    ImageThe Image property gets and sets the background image of a control or block.
    ImageModeThe ImageMode property gets and sets the display mode of an image in an Image control, in the column of a table of type Image or in the background of a Chart control in a window.
  • via the following functions:
    WinBackgroundImageModifies the background image of a window and specifies the display mode of this image.
Minimum version required
  • Version 9
This page is also available for…
Comments
Click [Add] to post a comment

Last update: 06/12/2023

Send a report | Local help