When I have shown The online forms to my sighted mother, she has found, that in some cases, text labels can fit on A line, but there is no some input box to fill out on some lines. Is it possible to add auto formatting option, so even if somebody would create 40 or more input boxes with text labels, that all input boxes could be visually available when using htmlwidgets unit? The most sad reality is The fact, that when I Am using screen reader on Android device or on standard deskto computer, I have no chance to determine, that some editable field could not fit on some line.. By other words. My mother could see all textual labels, but some inptut editable fields were not presented thanks to lack of free space on A line. If it would be possible to include some automatic formattting routines to The htmlwidgets unit, it would be excellent.
I Am sending whole code as A demonstration.
Or to avoid those issues. Should I move from Htmlwidgets unit to WEB unit? Should I rather simply write GUi by using HTML language by using Seamonkey HTMl editor, which even support tables creation?
Should I rather follow The same approach which is being used by Pacman game? But my HTMl knowledge is not so good to create editable fields. Thank you very much for yours patience.
Sure. For blind users, it is OK, because screen readers do not inform them, that some editable field do not fit on A line. But in this case, I would code only for visually impaired users for The rest of my life and resulting WEB app could always have some severe visuall issue.

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.freepascal.org/pipermail/pas2js/attachments/20201004/8ec4865d/attachment.htm> -------------- next part --------------
A non-text attachment was scrubbed...
Name: project1.lpr
Type: application/octet-stream
Size: 3515 bytes
Desc: not available
URL: <http://lists.freepascal.org/pipermail/pas2js/attachments/20201004/8ec4865d/attachment.obj>

That will not happen.

As I wrote in other mails: When programming the browser, layout must happen through CSS.

When you program for the browser, you must embrace the browser, and not try to import concepts that were developed in the early 90s for a limited range of hardware.

Modern programs must run on a variety of devices, and for this reason, CSS offers a lot of possibilities to adapt to various screen sizes.

And for this reason, there is no 'formatting' in the basic HTML webwidgets.

If you need good formatting that works on various screen sizes, you really should be using a framework like Bootstrap, Materialize, Foundation, UIKit etc.

Personally I use bootstrap, that is why there are some webwidget classes that work together with bootstrap formatting, but nothing stops people from writing classes that work with other CSS frameworks , or even write their own.

I realize that this means you must take an additional hurdle, but I believe that in the end you will make better programs because of it.

You will go a long way if you use the bootstrap components: the TRowWidget and TColumnWidget will allow you to position your widgets in a consistent manner, and bootstrap will then make sure it looks good. If you take the time to study some of the bootstrap CSS classes and apply them to your widgets, your programs will look good for sighted people as well.

It's really not so difficult, but it requires you let go of old habits. (and as we all know, old habits die hard)

Michael.

OK. So I will migrate to bootstrap. I Am only hoping, that screen readers will perfectly get The necessary info from such WEB apps. Thank you very much for yours realistic and foundet answer.

Mgr. Janusz Chmiel wrote

OK. So I will migrate to bootstrap. I Am only hoping, that screen readers will perfectly get The necessary info from such WEB apps.

You will see that the bootstrap site uses aria-* attributes a lot, exactly with the purpose to make life easier for the visually impaired.

Really, CSS exists on top of the HTML structure. All you need to do is apply the correct CSS classes to your widgets.

The screen readers can perfectly ignore these classes, and I suppose they do so.

Thank you very much for yours realistic and foundet answer.

I'm glad to help.

Michael.

I have compiled and tried The bootstraptable. Sure, really. Screen reader read everything excellently. No issues.
But I have found out, that .html file have no 1 KB syze. So some basic HTMl knowledge will be may be required to create some PP with GUI. Or does something create .html file automatically?
I will analyse The example. It contain various widgets including very accessible table. I have only one problem. If I will not have to create .csss templates myself from scratch.
It would be problem. And thank you very much that you have pointed Me to this widget. Sure. Using only htmlwidgets have been very simple for Me. But I understand, that I can not expect nice GUI from this perspective. Thank you that you have releasing Bootstrap units for free. Since I know about very expensive product based on Delphi from Germany. i would had to buy expensive Delphi license, and I would had to buy 440 Euros product from one company from Germany.
SO I would had to invest more than 800 Euros. So thank you very much that you have so good will that you are not only developing various frameworks for free. BUt that you have even patience to even help such amateour advanced users like I AM. I Am really deeply appreciating you because of it.

You really don't need extensive HTML. Please look at the examples that come with pas2js, many of them use bootstrap.

All you need is 3 lines in the header of your html file:

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" > <script src="https://code.jquery.com/jquery-3.4.1.js" ></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.js"></script>

That's all. The rest is accomplished by setting the necessary classes on your widgets.

I will analyse The example. It contain various widgets including very accessible table. I have only one problem. If I will not have to create .csss templates myself from scratch.

You don't need to create .css if you are satisfied with bootstrap. I have written several commercial web programs with the html widgets, and I have not yet had to create a single css file.

Bootstrap is sufficient for most purposes, and if you really need something flashy, there are many themes built on top of bootstrap.

If you are referring to TMS Software, it is a Belgian company :-)

Michael.