PC SOFT

WINDEVWEBDEV AND WINDEV MOBILE
ONLINE HELP

Home | Sign in | English UK
  • Overview
  • Step 1: Size and options of the clipped window
  • Step 2: Background image of the clipped window
  • Step 3: Modifying the ClipWindow procedure
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
WDClip: Using 9-slice scaling with a clipped window
Warning
From version 16, WDClip is not supplied with WINDEV anymore.
Overview
The WINDEV windows can be resized by the user ("Resizable" option in the "Details" tab of the window description). In most cases, if a background image is displayed in the window, 9-slice scaling is used to avoid distorting the background image when the window is resized.
The code generated by WDClip is used to take 9-slice scaling into account when resizing a clipped window. Therefore, the background image is automatically resized and it always corresponds to the visible section of the window. See 9-slice scaling for more details.
The explanations given in this page assume that your window already contains all the WLanguage processes generated by WDClip (see: WDClip: Use).
The different steps for implementing 9-slice scaling in a clipped window are as follows:
  1. Modify the size and the options of the clipped window.
  2. Modify the 9-slice scaling options.
  3. Modify the "ClipWindow" procedure generated by WDClip.
Step 1: Size and options of the clipped window
To use 9-slice scaling in a clipped window, some options of the window must be modified (height, width, etc.). These options depend on the style of the window (with or without border, with or without title bar, ...). These options can be modified in the "Style" tab of the window description.
  1. Display the window description ("GUI" from the popup menu of the window) and select the "Details" tab.
  2. Modify the width of the window ("Width"). The width of the window must:
    • Be equal to the width of the background image if the window has no border and no title bar.
    • Take into account the width of the right and left borders if the window has a border.
      Note: the width of a border is equal to 4 pixels.
  3. Modify the height of the window ("Height"). The height of the window must:
    • Be equal to the height of the background image if the window has no border and no title bar.
    • Take into account the height of the top and bottom borders if the window has a border.
      Note: the height of a border is equal to 4 pixels.
    • Take into account the height of the title bar if the window has a title bar.
      Note: the height of a a title bar is equal to 19 pixels.

  4. If the window has no title bar, check "Move by background". This option allows you to move the window by clicking its background.

  5. Check (if necessary) "Store the size and position of the window". This option allows you to store the size and position of the window when it is closed. When the window is reopened, its size and position will be the ones saved before its previous closing.
  6. Validate the description ("OK" button).
Step 2: Background image of the clipped window
This step is used to define the characteristics of the background image.
  1. Display the window description ("Description" from the popup menu of window) and select the "Image" tab.
  2. Check "Sizing handle included in the image". The standard sizing handle will not appear in the bottom right corner of the window.

  3. Check "Use 9-slice scaling" and click on to display the default settings of the 9-slice scaling mode.
    The image is divided into 9 sections:
    • 3 horizontal sections (top, center and bottom).
    • 3 vertical sections (left, center and right).
  4. Modify the value of each margin according to your image. Write these values down, you will need them later.

Step 3: Modifying the ClipWindow procedure
The procedure generated by WDClip is used to take into account the values of the margins specified in the options of the 9-slice scaling mode.
  1. In the "Code" pane, select "Local procedures". Double-click the "ClipWindow" procedure. The code window of the procedure is displayed.
  2. In the code window, find the following line: "//******Specify the margins of the 9-slice scaling mode for resizing".
//******Specify the margins of the 9-slice scaling mode for resizing

eLeftMargin is int = <left margin>
eRightMargin is int = <right margin>
eTopMargin is int = <top margin>
eBottomMargin is int = <bottom margin>
3. Enter the values of the left, right, top and bottom margins specified in the settings of the 9-slice scaling mode.
Minimum version required
  • Version 9
Comments
Click [Add] to post a comment