PC SOFT

ONLINE HELP
FOR WINDEV, WEBDEV AND WINDEV MOBILE

  • Overview of the Thumbnail control
  • Creating a Thumbnail control
  • Creating a Thumbnail control
  • Describing a Thumbnail control
  • Wizard for generating images
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 of the Thumbnail control
The Thumbnail control is used to automatically manage the display of images in thumbnail format.
During a click on the thumbnail, the initial image will be automatically displayed:
  • in a new window of the browser or in a tab of the browser (according to the configuration of the browser).
  • Versions 16 and later
    as a popup (automatic or in an Image control of a cell).
    New in version 16
    as a popup (automatic or in an Image control of a cell).
    as a popup (automatic or in an Image control of a cell).
No code line is required.
This type of control simplifies the creation of "Catalog" pages.
Versions 15 and later
PHP The Thumbnail control is available in PHP.
New in version 15
PHP The Thumbnail control is available in PHP.
PHP The Thumbnail control is available in PHP.
Creating a Thumbnail control

Creating a Thumbnail control

To create a Thumbnail control:
  1. In the page editor, click (or select "Insert .. Control .. Thumbnail").On the "Creation" pane, in the "Usual controls" group, expand "Image" and select "Thumbnail".
  2. Click the position where the control will be created in the page. The control is automatically created.
To display the control characteristics, select "Description" from the popup menu of control.

Describing a Thumbnail control

The main characteristics of a Thumbnail control are as follows. These characteristics are found in the different tabs of the description window of control:
  • Type of the source image ("General" tab). See Choosing the type of image for more details.
  • Source image ("General" tab): The "Image" control is used to specify the path of the large-size image associated with the Thumbnail control. This image will be automatically displayed when a click is performed on the thumbnail.
  • Image of the thumbnail ("General" tab). This control is used to specify the path of the image that will be used as thumbnail. This allows you to display an image that differs from the source image in the Thumbnail control. If this control is not filled, the image of the thumbnail is automatically generated by WEBDEV from the source image.
  • Display mode and transparency ("General" tab). See Choosing the display mode of image for more details. Only the "Homothetic centered" and "Stretched" modes are available.
  • Protection of images ("General" tab): If this option is checked, the popup menu of the thumbnail will not be displayed in the browser. Some operations for handling the thumbnail at browser level (backup, print, ...) will not be available.
    Caution: Only the image displayed as thumbnail is protected. The image opened in the new browser is not protected. The popup menu of this image will be displayed.
    Protection of images ("Details" tab): If this option is checked, the popup menu of the thumbnail will not be displayed in the browser. Some operations for handling the thumbnail at browser level (backup, print, ...) will not be available.
    Caution: Only the image displayed as thumbnail is protected. The image opened in the new browser is not protected. The popup menu of this image will be displayed.
  • Versions 15 and later
    Transition ("General" tab): When the value of thumbnail control is modified, a transition can be selected such as Faded, Overlap or Swipe to make the change of image more harmonious. See Animating an image for more details.
    New in version 15
    Transition ("General" tab): When the value of thumbnail control is modified, a transition can be selected such as Faded, Overlap or Swipe to make the change of image more harmonious. See Animating an image for more details.
    Transition ("General" tab): When the value of thumbnail control is modified, a transition can be selected such as Faded, Overlap or Swipe to make the change of image more harmonious. See Animating an image for more details.
  • Versions 16 and later
    Automatic scroll ("General" tab): This option is accessible for the "dynamic" images or for the images "from a database: path". See Image with automatic scroll for more details.
    New in version 16
    Automatic scroll ("General" tab): This option is accessible for the "dynamic" images or for the images "from a database: path". See Image with automatic scroll for more details.
    Automatic scroll ("General" tab): This option is accessible for the "dynamic" images or for the images "from a database: path". See Image with automatic scroll for more details.
  • Destination ("General" tab): This option allows you to choose the location where the initial image must be displayed during a click on the thumbnail (new browser by default).
    Versions 16 and later
    Several destinations can be defined for a specific display of thumbnail image:
    • Automatic popup: the thumbnail image is displayed in popup format in the page (the page background is grayed). The style of automatic popup can be defined in the "Style" tab of Thumbnail control ("Automatic popup" element).
    • Custom popup:
      • if your page contains a cell and an Image control in the cell, you have the ability to display the image in this cell. To do so, select the name of the cell and the name of the Image control. The image of the thumbnail is displayed in the cell as popup in the page (the page background is grayed).
      • Versions 17 and later
        if your page contains a popup and an Image control in the popup, you have the ability to display the image in this popup. To do so, select the name of popup and Image control. The thumbnail image is displayed in the Image control of popup.
        New in version 17
        if your page contains a popup and an Image control in the popup, you have the ability to display the image in this popup. To do so, select the name of popup and Image control. The thumbnail image is displayed in the Image control of popup.
        if your page contains a popup and an Image control in the popup, you have the ability to display the image in this popup. To do so, select the name of popup and Image control. The thumbnail image is displayed in the Image control of popup.
    New in version 16
    Several destinations can be defined for a specific display of thumbnail image:
    • Automatic popup: the thumbnail image is displayed in popup format in the page (the page background is grayed). The style of automatic popup can be defined in the "Style" tab of Thumbnail control ("Automatic popup" element).
    • Custom popup:
      • if your page contains a cell and an Image control in the cell, you have the ability to display the image in this cell. To do so, select the name of the cell and the name of the Image control. The image of the thumbnail is displayed in the cell as popup in the page (the page background is grayed).
      • Versions 17 and later
        if your page contains a popup and an Image control in the popup, you have the ability to display the image in this popup. To do so, select the name of popup and Image control. The thumbnail image is displayed in the Image control of popup.
        New in version 17
        if your page contains a popup and an Image control in the popup, you have the ability to display the image in this popup. To do so, select the name of popup and Image control. The thumbnail image is displayed in the Image control of popup.
        if your page contains a popup and an Image control in the popup, you have the ability to display the image in this popup. To do so, select the name of popup and Image control. The thumbnail image is displayed in the Image control of popup.
    Several destinations can be defined for a specific display of thumbnail image:
    • Automatic popup: the thumbnail image is displayed in popup format in the page (the page background is grayed). The style of automatic popup can be defined in the "Style" tab of Thumbnail control ("Automatic popup" element).
    • Custom popup:
      • if your page contains a cell and an Image control in the cell, you have the ability to display the image in this cell. To do so, select the name of the cell and the name of the Image control. The image of the thumbnail is displayed in the cell as popup in the page (the page background is grayed).
      • Versions 17 and later
        if your page contains a popup and an Image control in the popup, you have the ability to display the image in this popup. To do so, select the name of popup and Image control. The thumbnail image is displayed in the Image control of popup.
        New in version 17
        if your page contains a popup and an Image control in the popup, you have the ability to display the image in this popup. To do so, select the name of popup and Image control. The thumbnail image is displayed in the Image control of popup.
        if your page contains a popup and an Image control in the popup, you have the ability to display the image in this popup. To do so, select the name of popup and Image control. The thumbnail image is displayed in the Image control of popup.

Wizard for generating images

When selecting an image file (for the initial image or for the thumbnail), depending on the selected image, a wizard is displayed. This wizard is used to:
  • compress the image automatically (for the images whose size exceeds 20 KB). This option also allows you to convert the image into one of the formats adapted to the Internet pages. If this option is not selected:
    • If the image is using a format not adapted to the Internet pages, the image will be converted whenever the page is generated, so this generation may be slowed down.
    • If the image is using a format suited for the pages but if its size is too large, the time for displaying the page may be slowed down.
      If you choose to perform the conversion immediately, you have the ability to select the image format and its quality. You also have the ability to use the progressive JPEG format. This format displays a page progressively while the browser loads the page.
  • automatically convert the image into one of the formats suited for the Internet pages. If this option is not selected, the image will be converted whenever the page is generated, so this generation may be slowed down. If you choose to perform the conversion immediately, you have the ability to select the image format and its quality.
  • define the image location: you can:
    • copy the image into the site directory (_WEB directory or one of its sub-directories) in order to optimize the generation time of page,
    • leave the image at its location (recommended when the file is shared between several contributors).
Minimum required version
  • Version 10
Comments
Click [Add] to post a comment