PC SOFT

ONLINE HELP
FOR WINDEV, WEBDEV AND WINDEV MOBILE

Home | Sign in | English US
  • Overview
  • Clipping the window according to the background image
  • The main steps
  • Notes
  • Creating the image that defines the shape of the window
  • Using a clipped window
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaReports and QueriesUser code (UMC)
WEBDEV
WindowsLinuxPHPWEBDEV - Browser code
WINDEV Mobile
AndroidAndroid Widget iPhone/iPadApple WatchUniversal Windows 10 AppWindows Mobile
Others
Stored procedures
Overview
An image can be used to easily define the shape of a window. WINDEV analyzes this image and it uses the shape defined by the image. This image will be used to specify the visible and invisible sections of the window.
This allows you to create outstanding interfaces.
Clipping the window according to the background image

The main steps

WINDEV allows you to use an image directly from the editor to define the shape of the window. To do so:
  1. Create the image that will be used as background image of the window. The transparency color of this image must be defined. This color can be:
    • magenta.
    • the color of the first pixel found in the top left corner of the image.
      See the next paragraph for more details.
  2. In the description of the window:
    • check "Clip the Window" in the "Image" tab. WINDEV proposes to automatically adapt the style options of the window in order to get a better result.
    • specify the transparency options corresponding to the background image used (use magenta as transparency color for example).
      Note: You also have the ability to configure the transparency options of the windows. See Translucent effect of windows for more details.
  3. Validate. The window is automatically clipped in the editor.

Notes

  • WDClip can also be used to clip a window according to a background image.
    See the help about WDClip for more details.
  • Caution: Some specific shapes (hole for example) cannot be performed via "Clip the window". Only WDClip enables you to create some windows that use these specific shapes.
    See the help about WDClip for more details.
  • The project RAD or the window RAD proposes several skin templates of clipped windows (the Halo skin template for example).
Creating the image that defines the shape of the window
The image that defines the shape of the window is created via a drawing software.
In this image, define the color that will be used as transparency color when clipping the window ("Light Magenta" for example). All the areas containing this color will be made invisible when the clipped window is displayed.
Caution: The borders should be as sharp as possible (no gradient, ...) in order to avoid the unexpected display effects when the clipped window is previewed or opened. Indeed, a single color is used to define the transparency for the entire image.
Example:

  • An image whose borders are very sharp will produce a perfectly clipped window:

  • An image whose borders are smoothed will produce a window that will not be perfectly clipped:
Using a clipped window
WINDEV allows you to:
  • use a drop-down menu in the clipped windows. To do so, specify the position of the main menu in the "Details" tab of the description window.
  • associate a context-sensitive help with the window (via the mechanism of advanced tooltips). To do so, create a button whose preset action is "Context-sensitive help".
  • manage the translucent effect of windows.
Minimum required version
  • Version 9
Comments
Click [Add] to post a comment