ONLINE HELP
 WINDEV, WEBDEV AND WINDEV MOBILE
Help / Developing an application or website / Controls, windows and pages / Controls: Available types / Kanban control
  • Overview of the Kanban control
  • Creating a Kanban control
  • Characteristics of the Kanban control
  • Internal windows
  • Internal pages
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 of the Kanban control
Originally, Kanban is a Japanese method aimed at improving processes for a better, more efficient production cycle.
Today, Kanban also refers to a method in which tasks are visually classified, allowing for better task management.
Each task is written on a "card" that will move to a different list (column) according to its progress status.
In addition to tasks, these cards can represent any other type of resource: user story, requirement, suggestion, manufacturing stage, delivery, troubleshooting, etc.
A Kanban board is commonly shared between several users. Each member of the team knows the progress status of the project, and knows what both themselves and the other members have to do.
In addition to better communication, this card-based method provides a clear overview of the production chain and the progress of the tasks, thus allowing members to easily identify bottlenecks and prioritize certain tasks.
You can use the same Kanban control in WINDEV, WEBDEV and WINDEV Mobile. All the main features are the same, with some adjustments for mobile and web to better take advantage of each platform. For example, the control adapts to portrait mode on mobile devices.
Creating a Kanban control
To create a Kanban control:
  1. On the "Creation" tab, in the "Graphic controls" group, expand "Office" and select "Kanban".
  2. Click at the desired location to create the control. The control appears in the editor.
Remark: The dimensions of the control are optimized to take up the available space at the specified position. If the control size does not suit you, press Ctrl + Z: the control size will be reset to default.
To view the characteristics of the control, select "Description" in the context menu.
WEBDEV - Server code Remark: Kanban controls are not available in Active WEBDEV Pages.
Characteristics of the Kanban control
Kanban controls are composed of lists of cards ("Kanban lists").
The main options of the Kanban control are as follows:
  • Ability to define the different lists in the control ("General" tab).
  • Ability to define the dimensions and display mode of the lists ("Details" tab).
  • Ability to select internal windows/pages ("Details" tab):
    • to display cards.
    • to add and delete cards (if this feature is enabled).
WINDEVAndroidiPhone/iPad

Internal windows

You can use two types of internal windows to customize the Kanban control:
  • Internal window to display cards.
  • Internal window to customize the Add/Delete area.
To fully customize the display mode of the cards (for translation purposes, for example):
  1. Open the Kanban control description window.
  2. In the "Details" tab, select the internal window used to display the cards:
    • "None": the default display mode will be used.
    • "Preset window": If this option is selected, the WDAAF internal component is immediately added to the current project. The "IW_KANBAN_CARD" internal window is automatically selected in "Display cards in".
      Remark: If the WDAAF component already exists, only the window is added to the component.
    • Any internal window in your project.
  3. If necessary, validate the control description window.
To fully customize the Add/Delete area:
  1. Open the Kanban control description window.
  2. In the "Details" tab, select the internal window used to display the cards:
    • "None": the default display mode will be used.
    • "Preset window": If this option is selected, the WDAAF internal component is immediately added to the current project. The "IW_KANBAN_LIST_FOOTER" internal window is automatically selected in "Add/Delete area".
      Remark: If the WDAAF component already exists, only the window is added to the component.
    • Any internal window in your project.
  3. If necessary, validate the control description window.
Remarks:
  • Each custom internal window is available in the "Project explorer" pane, in the "Internal components" folder. It can be edited in the window editor.
    Caution: these internal windows only allow you to customize the design of the elements. Only the "Global declarations" event is executed. No other events are executed. Therefore, you cannot add buttons with a specific click code.
  • If you use the preset window, the style options of the card (selected in the "Style" tab) will be applied.
WEBDEV - Server codeWEBDEV - Browser code

Internal pages

You can use two types of internal pages to customize the Kanban control:
  • Internal page used to display cards.
  • Internal page to customize the Add/Delete area.
The WDAAF internal component is immediately added to the current WEBDEV project when you create a Kanban control. This component contains two preset pages:
  • WEBDEVKanban: page used to customize the cards.
  • WEBDEVKanbanPlus: page used to customize the Add/Delete button at the bottom of the Kanban list.
By default, these internal pages are used to customize the cards and the buttons at the bottom of the list.
To modify the internal pages used for customizing the cards and the buttons at the bottom of the list:
  1. Open the Kanban control description window.
  2. In the "Details" tab, select:
    • the internal page used to display the cards.
    • the internal page used to display the buttons at the bottom of the list.
  3. You can use a preset internal page or any internal page in your project. The "Undefined" option sets the default display mode.
  4. If necessary, validate the control description window.
Remarks:
  • Each page of the WDAAF component is available in the "Project explorer" pane, in the "Internal components" folder. It can be edited in the page editor.
    Caution: these pages only allow you to customize the design of the elements. Only the "Global declarations" event is executed. No other events are executed. Therefore, you cannot add buttons with a specific click code.
  • If you use the preset page, the style options of the card (selected in the "Style" tab) will be applied.
Related Examples:
WD Kanban Training (WINDEV): WD Kanban
[ + ] This example illustrates how to use, save and load a Kanban control
WW_Kanban Training (WEBDEV): WW_Kanban
[ + ] This example illustrates how to use, save and load a Kanban control
WM Kanban Cross-platform examples (WINDEV Mobile): WM Kanban
[ + ] This example illustrates how to use, save and load a Kanban control
See also
Minimum version required
  • Version 28
This page is also available for…
Comments
Click [Add] to post a comment

Last update: 07/03/2023

Send a report | Local help