B4J Kanban board application

PaulMeuris

Well-Known Member
Licensed User
You can use a kanban board to visualize the different stages of workflows in an organization.
Each task or work item is represented by a card that is placed in a stage list on the board.
Each team might have different needs about which stages to monitor. This means that the application has to be flexible enough to cope with these differences.
Each card can contain different items about the task: a description, a checklist, a statusbar and so on.
You can read more about it on this website: Kanban board examples
This is a first attempt to write a B4J application that uses a kanban board.
Here’s how it might look like for the first visualization:
1692424519455.png

Each card can have a different height and this means that a scrollbar will appear if the list gets to long.
If there are more than 7 stage lists than a horizontal scrollbar will appear. Horizontal scrolling is also active when you resize the window to a smaller size.
A card can be dragged and dropped vertically in the same list. The horizontal dragging and dropping is not implemented yet. A card can be removed by right clicking with the mouse on the name (or below the description).
The data structures and data forms needed are not implemented yet.
The source code will be available in one of the next messages… Any comments, tips ?
 

Magma

Expert
Licensed User
Longtime User
Wow... seems perfect!

Also big restaurants with good organize can use it to share the work at chefs-members-of-kitchens...

As i am thinking the use use-list of it can be unlimited (it service, car service, factories)...

Keep Coding :)
 

Magma

Expert
Licensed User
Longtime User
Do you use customlistview ?

I think you can also use B4xtable and in cells customlistview (never tested - but anything is possible with b4xtable)..
It will be easier for the Headers and i think will be easy the rows can be only two (because at 2nd you will use CLV for every stage/column)... just and idea.. i think will help to be more justified and easier with scrollbars... but not tested
 

PaulMeuris

Well-Known Member
Licensed User
Do you use customlistview ?
Yes, i use 7 CustomListViews (CLVs) in the example.
The headers are part of the pane that also contains the CLV. These panes are added to the main CustomListView with a horizontal orientation. In case there are more than 7 stages the horizontal scrollbar will appear.
Do you have some idea's about the data structures (task information, person or employee information, checklists information, ...)?
It would be nice if a card can be dragged (horizontally) from one CLV to another CLV and in the right item position. That seems to be a real challenge...
 

Magma

Expert
Licensed User
Longtime User
It would be nice if a card can be dragged (horizontally) from one CLV to another CLV and in the right item position. That seems to be a real challenge...

not dragging at this project attaching but trying to switch CLV next and prev arrows add it... (but had no time to set the new tags - actually stuck somehow there - check the source i think will help you)

add two button for Items (previous and next) to move at your customlistviews...

As for the datastructure... I have an idea... what about reading an SQLite database (all the tables... every table will be a column/stage and the fields of every record will be one panel form) - so will be customizable every time...
 

Attachments

  • CLVDragger(1).zip
    5.1 KB · Views: 179

PaulMeuris

Well-Known Member
Licensed User
@Magma, thank you for the idea's and the testing and thanks to the other members for the likes, loves and wow's.
You can find the source code i used in the attachments.
Today i'm testing some alternative.
In the beginning of this year i implemented a Simple Layout Designer application (see the tutorial overview link in my signature).
With this application you can create good looking designs like this one:
1692532652820.png

But this is just a design and not a fully functional kanban board application.
Some of that code i can use to try to implement a kanban application where the panels (panes) can be moved around on the screen positioning them in a large grid.
The panels can snap to the large grid.
kanban_move_cards.png

This might be a good alternative. There can be cards (or panels) with different content (labels, buttons, textarea's, checkboxes, ...)
Each column of the grid represents a stage in a workflow.
To be continued...
 

Attachments

  • kanban_board.zip
    8.8 KB · Views: 184
Top