ONLINE HELP
 WINDEVWEBDEV AND WINDEV MOBILE

Help / Editors / Window editor and page editor
  • Overview
  • The parallax effect in the window editor
  • Overview
  • Defining the parallax effect in the window editor
  • Defining the parallax through 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
Overview
"Parallax" effects make it possible to scroll the elements in the interface at different speeds.
You can define:
  • a parallax of controls: In a window or in a page, the parallax animations are used to configure the speed at which the control is moved or reduced in relation to the scrollbar move in the window (or in the page).
  • a parallax of background image: In a page, a parallax animation can be used on the background images. When the scrollbar is used, the background image will move at a specific speed relative to the movement of the scrollbar.
The Parallax effects are available:
WINDEV Mobile
The parallax effect in the window editor

Overview

The window editor proposes a parallax effect of control.
For example:
  • If no parallax is defined, the controls and the window scrollbar move at the same speed.
  • If the control is fixed, the control will not move even if the scrollbar is used.
  • The parallax is used to perform specific effects, for example by making the move speed of the control (or its reduction rate) change in relation to the move speed of the window scrollbar.

Defining the parallax effect in the window editor

To define the parallax effect of a control:
  1. Open the control description window.
  2. In the "UI" tab, expand the "Parallax" option.
  3. Choose the requested option:
    • No parallax: The control moves vertically following the movement of the window scrollbar.
    • Material Design effect without reduction: The control moves vertically proportionally to the movement of the window scrollbar. In this case, the movement speed is set to 50% and the reduction speed is set to 0%.
    • Material Design effect with reduction: The control is reduced vertically in relation to the movement of the scrollbar in the window. In this case, the move speed is set to 50% and the reduction speed is set to 50%.
      For an Image control, the image follows the display mode.
      • If the image is stretched, it will be distorted to be entirely displayed in the height of the control.
      • If the image is homothetic centered, it will be reduced proportionally to the control height.
    • Fixed control: The control is fixed. It does not move in the window. It is always visible when the scrollbar moves in the window. In this case, the move speed is set to 0% and the reduction speed is set to 100%.
    • Customize the effect: You have the ability to specify the Y parallax rate (move speed of control) and the Height parallax rate (reduction speed of control).
Remark: The parallax effect is available for all types of controls.

Defining the parallax through programming

The following properties are used to define the parallax of a control through programming:
ParallaxRateHeightThe ParallaxRateHeight property is used to determine and specify how fast a control is reduced when the scrollbar in the window, internal window or page moves.
ParallaxRateYThe ParallaxRateY property is used to determine and specify how fast a control moves when the scrollbar in the window, internal window or page moves.
Minimum version required
  • Version 21
This page is also available for…
Comments
Click [Add] to post a comment

Last update: 06/16/2023

Send a report | Local help