PC SOFT

ONLINE HELP
FOR WINDEV, WEBDEV AND WINDEV MOBILE

  • Overview of Looper control
  • Creating a Looper control
  • Creating an horizontal Looper control
  • Attributes of a Looper control
  • Attributes of a Looper control in WEBDEV
  • Attributes of a Looper control in WINDEV or WINDEV Mobile
  • Vocabulary
  • Notes
  • Swapping a Table control and a Looper control
  • Refactoring: creating a Looper control from the selected controls
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 Looper control
A Looper control is used to repeat the controls found in a specific area. More precisely, a Looper control is a "container" control that is used to repeat several times all the controls (edit controls, static controls, combo boxes, ...) included in it.
The Looper control simplifies the display and the input of information.
Compared to the Table control, the Looper control presents richer interfaces as all types of controls can be repeated.
The information displayed in the Looper control can:
  • be defined by programming: we talk of Memory looper.
  • come from a data file or from a query: we talk of Browsing looper.
  • come from a WLanguage variable: we talk of Looper control on source.
Versions 15 and later
Android The Looper control is available for the Android applications.
New in version 15
Android The Looper control is available for the Android applications.
Android The Looper control is available for the Android applications.
Versions 16 and later
Universal Windows 10 App The Looper control is available for the Windows Phone applications.
WINDEVLinux The Looper control is available for the WINDEV applications in Linux.
Universal Windows 10 App Only the memory Looper controls are available.
New in version 16
Universal Windows 10 App The Looper control is available for the Windows Phone applications.
WINDEVLinux The Looper control is available for the WINDEV applications in Linux.
Universal Windows 10 App Only the memory Looper controls are available.
Universal Windows 10 App The Looper control is available for the Windows Phone applications.
WINDEVLinux The Looper control is available for the WINDEV applications in Linux.
Universal Windows 10 App Only the memory Looper controls are available.
Versions 17 and later
iPhone/iPad The Looper control is available for the iPhone/iPad applications.
WEBDEV - Browser code The Looper control is available in browser code.
New in version 17
iPhone/iPad The Looper control is available for the iPhone/iPad applications.
WEBDEV - Browser code The Looper control is available in browser code.
iPhone/iPad The Looper control is available for the iPhone/iPad applications.
WEBDEV - Browser code The Looper control is available in browser code.
Versions 18 and later
Universal Windows 10 App The Looper control is now available for the applications in Windows Store apps mode.
New in version 18
Universal Windows 10 App The Looper control is now available for the applications in Windows Store apps mode.
Universal Windows 10 App The Looper control is now available for the applications in Windows Store apps mode.
Versions 21 and later
Universal Windows 10 App The Looper control is now available for the applications in Universal Windows 10 App mode.
New in version 21
Universal Windows 10 App The Looper control is now available for the applications in Universal Windows 10 App mode.
Universal Windows 10 App The Looper control is now available for the applications in Universal Windows 10 App mode.
Notes:
Creating a Looper control
To create a Looper control:
  1. In the window or page editor, click (or select "Insert .. Control .. Looper").On the "Creation" pane, in the "Data" group:
    • WINDEVWINDEV Mobile expand "Looper" and select "Looper (vertical)".
      Versions 18 and later
      WINDEVWindowsAndroidiPhone/iPad Note: You have the ability to create an horizontal looper via "Horizontal looper".
      New in version 18
      WINDEVWindowsAndroidiPhone/iPad Note: You have the ability to create an horizontal looper via "Horizontal looper".
      WINDEVWindowsAndroidiPhone/iPad Note: You have the ability to create an horizontal looper via "Horizontal looper".
    • WEBDEV - Server code expand "Looper" and select "Looper".
      Versions 23 and later
      Note: You have the ability to create a Galley looper via "Gallery in row" and "Gallery in column".
      New in version 23
      Note: You have the ability to create a Galley looper via "Gallery in row" and "Gallery in column".
      Note: You have the ability to create a Galley looper via "Gallery in row" and "Gallery in column".
  2. Click the position where the control will be created in the window or page. The wizard for creating a Looper control is automatically started.
Notes:
  • Versions 20 and later
    WINDEV The dimensions of created control are optimized in order to occupy the available space at the specified position. If the control size does not suit your, press [CTRL Z]: the default control size will be restored.
    New in version 20
    WINDEV The dimensions of created control are optimized in order to occupy the available space at the specified position. If the control size does not suit your, press [CTRL Z]: the default control size will be restored.
    WINDEV The dimensions of created control are optimized in order to occupy the available space at the specified position. If the control size does not suit your, press [CTRL Z]: the default control size will be restored.
  • Versions 17 and later
    iPhone/iPad The wizard for creating windows for iPhone and iPad can also be used to create preset loopers. See Windows for iPhone and iPad for more details.
    New in version 17
    iPhone/iPad The wizard for creating windows for iPhone and iPad can also be used to create preset loopers. See Windows for iPhone and iPad for more details.
    iPhone/iPad The wizard for creating windows for iPhone and iPad can also be used to create preset loopers. See Windows for iPhone and iPad for more details.
To display the control characteristics, select "Description" from the popup menu of control.
For more details:
Versions 18 and later
WINDEVWindowsAndroidiPhone/iPad

Creating an horizontal Looper control

You also have the ability to create horizontal Looper controls. In this case, the control will include an horizontal scrollbar used to scroll the different rows.
To create an Horizontal Looper control:
  1. On the "Creation" pane, in the "Data" group, expand "Looper" and select "Horizontal looper".
  2. Click the position where the control will be created in the window or page. The wizard for creating a Looper control is automatically started.
To display the control characteristics, select "Description" from the popup menu of control.
New in version 18
WINDEVWindowsAndroidiPhone/iPad

Creating an horizontal Looper control

You also have the ability to create horizontal Looper controls. In this case, the control will include an horizontal scrollbar used to scroll the different rows.
To create an Horizontal Looper control:
  1. On the "Creation" pane, in the "Data" group, expand "Looper" and select "Horizontal looper".
  2. Click the position where the control will be created in the window or page. The wizard for creating a Looper control is automatically started.
To display the control characteristics, select "Description" from the popup menu of control.
WINDEVWindowsAndroidiPhone/iPad

Creating an horizontal Looper control

You also have the ability to create horizontal Looper controls. In this case, the control will include an horizontal scrollbar used to scroll the different rows.
To create an Horizontal Looper control:
  1. On the "Creation" pane, in the "Data" group, expand "Looper" and select "Horizontal looper".
  2. Click the position where the control will be created in the window or page. The wizard for creating a Looper control is automatically started.
To display the control characteristics, select "Description" from the popup menu of control.
Attributes of a Looper control
WEBDEV - Server codeWEBDEV - Browser codePHP

Attributes of a Looper control in WEBDEV

A Looper control includes:
  • controls, that are repeated on each row.
  • attributes. An attribute is used to define the control characteristic that will be modified on each row. For example, if the value and the color of the PRICE control must change on each row, you will have to define two different attributes for the same control.
To find out or modify the characteristic of a control (its value, its color, ...), all you have to do is handle this control or the corresponding attribute by programming.
WINDEVAndroidiPhone/iPadWindows MobileUniversal Windows 10 AppJava

Attributes of a Looper control in WINDEV or WINDEV Mobile

A Looper control includes controls that are repeated on each row.
Versions 16 and later
WINDEVWindows The content of the tables, charts, ... can differ in each row. See Displaying a different content on each row for more details.
New in version 16
WINDEVWindows The content of the tables, charts, ... can differ in each row. See Displaying a different content on each row for more details.
WINDEVWindows The content of the tables, charts, ... can differ in each row. See Displaying a different content on each row for more details.
To find out or modify the characteristic of a control (its value, its color, ...), all you have to do is handle this control by programming.
Note: For compatibility with WEBDEV, you also have the ability to use the attributes. In this case, to find out or modify the characteristic of a control (its value, its color, ...), all you have to do is handle this control or the corresponding attribute by programming.
Vocabulary
To easily handle a Looper control, you must be familiar with the following vocabulary:
NameDefinition
AttributeAn attribute corresponds to the association between the control found in the looper and the property of this control that will be modified on each row.
For each attribute, you must define:
  • the name of the attribute.
  • the name of the control in the looper.
  • the property of the control that will be modified on each row (value, color, ...).
WINDEVWINDEV Mobile Reminder: The attributes are not mandatory.
Browsing looperThe Looper control is based on a data file or on a query. A record found in the data file is displayed on each row. Two types of browsing Looper controls are available:
  • Browsing looper "Loaded in memory": The content of the looper is loaded in memory then it is displayed. The access to the different control elements is faster. This mode is reserved for the data files containing less than 100 000 records.
  • Browsing looper in "Direct access (no limit)": The Looper control displays the content of the data file or query directly. The current record corresponds to the selected element. Each move performed in the control involves an access to the linked data file. This mode is reserved for the data files containing more than 100 000 records.
Memory looperThe Looper control is not based on a data file or on a query. The elements displayed in the control are defined by the developer (by programming).
Looper on sourceThe Looper control is based on a variable (global to the project, to the window or to the page, class member, ...).
Notes

Swapping a Table control and a Looper control

WINDEV, WINDEV Mobile and WEBDEV allow you to automatically transform a Table control into a Looper control:
  1. Select the Table control to transform.
  2. Select "Control .. Swap .. Table to Looper".On the "Modification" pane, in the "Transformations" group, expand "Refactoring and swapping" and select "Table to Looper".

Refactoring: creating a Looper control from the selected controls

WINDEV, WINDEV Mobile and WEBDEV allow you to automatically create a Looper control from the controls currently selected:
  1. Select the requested controls.
  2. Select "Control .. Refactoring .. Create a looper from the selection".On the "Modification" pane, in the "Transformations" group, expand "Refactoring and swapping" and select "Create a looper from the selection".
Related Examples:
The Looper control (display the bounds) Unit examples (WEBDEV): The Looper control (display the bounds)
[ + ] This example explains how to display the bounds of a looper with custom pager.
Displaying/Hiding an input area Unit examples (WEBDEV): Displaying/Hiding an input area
[ + ] This example explains how to display/hide an input area via a looper.
Adding an input area is performed by adding a row in the looper.
The Looper control (selection bar) Unit examples (WEBDEV): The Looper control (selection bar)
[ + ] This example explains how to simulate a selection bar in a looper
The Looper control (modify the number of rows displayed) Unit examples (WEBDEV): The Looper control (modify the number of rows displayed)
[ + ] This example explains how to modify the number of rows displayed in a looper.
The Ajax Looper control Unit examples (WEBDEV): The Ajax Looper control
[ + ] This example explains how to use the Ajax looper. This example allows you to:
- Clear the looper
- Fill the looper
- Sort the looper
The Ajax Looper control in PHP Unit examples (WEBDEV): The Ajax Looper control in PHP
[ + ] This example presents the use of Ajax loopers in PHP.
This example allows you to:
- Clear the looper
- Fill the looper
- Sort the looper
The Looper control Unit examples (WINDEV): The Looper control
[ + ] Using the Looper control.
You have the ability to add a row with LooperAddLine.
The following syntax is used to retrieve the existing values:
  AttributeName[Subscript]
webmillion Complete examples (WEBDEV): webmillion
[ + ] The following topics are presented in this example:
1/ Using queries
2/ Using "browsing" loopers in automatic browse
3/ Using "browsing" loopers in manual browse

Summary of the example supplied with WEBDEV:
This Web application, powered by WEBDEV, is used to display, find and order tee-shirts.
Once the order is placed, you have the ability to use the PayBox module for secure payment.

This example contains a page used to generate a data file containing an important number of records.
WM Managing Contacts Cross-platform examples (WINDEV Mobile): WM Managing Contacts
[ + ] This example presents the management of contacts for Android et iOS.
It is used o:
- list the contacts found on the phone
- call the contacts
- send SMSs to the contacts
- ...
WM ToDo List Cross-platform examples (WINDEV Mobile): WM ToDo List
[ + ] This example is a manager of To-Do Lists.
The project is using the gestures in the loopers in order to move and delete the lists and tasks.
The data is stored in a HFSQL database.
WM Registered Cross-platform examples (WINDEV Mobile): WM Registered
[ + ] This application is an attendance manager. It allows you to list the persons who attended a meeting.
The database is filled beforehand with the list of registered persons.
You have the ability to find a person by using his/her name.
The following topics are presented in this example:
1/ using a browsing looper based on a query
2/ using a database in HFSQL format.
Photo_Gallery Complete examples (WEBDEV): Photo_Gallery
[ + ] This example is a site of photo gallery and it includes 2 main sections:
- the "visitor" section, developed in AWP mode therefore referenceable.
- the management section, developed in standard WEBDEV mode therefore secured.  
 
Among the available features, you will find:
- an organization of your photos by album
- different modes for presentation the photos: slide show mode, scroll mode, detailed mode
- a link to the social networks
- the ability for the visitors to comment your publications
- a contact form
- for the site management, you have the ability to upload your photos, to describe them, to turn them around, to encrust a watermark..
Minimum required version
  • Version 9
This page is also available for…
Comments
Click [Add] to post a comment