Betterlook.pbi - Make your PB app UI better-looking (WIP - Windows x64)

[nsstudios]

Thank you for considering accessibility and sharing an example program.
Right now (at least with NVDA screen reader and Windows 10 22h2), the only thing I can access is the title bar, and the text "Any standard PB gadgets here". Everything else just reads as "Unknown" with NVDA, or "pain" with Narrator.

[firace]

Thank you for considering accessibility and sharing an example program.
Right now (at least with NVDA screen reader and Windows 10 22h2), the only thing I can access is the title bar, and the text "Any standard PB gadgets here". Everything else just reads as "Unknown" with NVDA, or "pain" with Narrator.

Thanks for your feedback! I've posted a new version of the demo. Hopefully more components should be readable?
Anyway implementing better accessibility is on my to-do list.

[nsstudios]

Thank you once more for having accessibility in mind.
The situation is a little better: in order, when I open the app and tab:

1. Says literally nothing.
2. Says nothing again.
3. Main
4. Tools
5. Alerts
6. Unknown
7. Unknown
8. Unknown
9. Unknown
10. unknown
11. About
12. Unknown
13. Unknown
14. Unknown
15. Unknown
16. Analyze
17. Quit

And then it wraps back to two first controls that say nothing.
I can seem to activate controls with space, or at least the quit button works that way, for others I can't tell that anything is happening.
Also if I simulate a left click/left double click, the title changes from button pressed to side menu event.
It's awesome to see improvement, thank you for having accessibility in mind once again, and feel free to take your time, I understand that there's other areas that demand your attention as well. It means a lot that you're even considering it.

[firace]

Thank you once more for having accessibility in mind.
The situation is a little better: in order, when I open the app and tab:

1. Says literally nothing.
2. Says nothing again.
3. Main
4. Tools
5. Alerts
6. Unknown
7. Unknown
8. Unknown
9. Unknown
10. unknown
11. About
12. Unknown
13. Unknown
14. Unknown
15. Unknown
16. Analyze
17. Quit

And then it wraps back to two first controls that say nothing.
I can seem to activate controls with space, or at least the quit button works that way, for others I can't tell that anything is happening.
Also if I simulate a left click/left double click, the title changes from button pressed to side menu event.
It's awesome to see improvement, thank you for having accessibility in mind once again, and feel free to take your time, I understand that there's other areas that demand your attention as well. It means a lot that you're even considering it.

Thanks for your excellent feedback! I've posted a new build, which hopefully fixes some of the issues you have reported.
Narrator should detect 6 readable items in this demo.

[nsstudios]

I can report improvement, yes.

1. Main
2. Tools
3. Alerts
4. About
5. Analyze
6. Quit

The only thing now is that it doesn't recognize the type of the control. Usually it would say Main link, or main button. I think it's quite obvious here that the control is button, but it worries me for other controls like checkboxes, radio buttons, etc. where it wouldn't be super obvious.

[firace]

Here's what the code for a simple "Hello World" betterlook app looks like.
Ease of use was a top priority throughout the creation of the pbi.

Code: Select all

IncludeFile "betterlook.pbi"

;; simply define the side menu layout in one single line, as follows: 

SideMenuLayout$ = "🔥    Main |🔧    Tools |🔔    Alerts | | | | |🌙    About"   ;; icons are actually part of the Segoe Windows font! And '|' is the item separator

OpenWindowML(0, 40, 90, 650, 430, "Hello World", $F1F1F1, $121212, SideMenuLayout$, 160, $5C1200)  


;; if converting an existing app: insert your GUI code here 
;; tip: by encapsulating your GUI code inside a ContainerGadget, you won't need to adapt 
;;      all existing gadget coordinates to account for the extra space occupied by the sidemenu

ButtonGadgetML(46, 520 , 415,  120, 32,  "Button 1",   $F3F3F3, $4535DC)  

Repeat 
  Event = WaitWindowEvent()
  WindowHandlerML(0, Event)     
Until Event = #PB_Event_CloseWindow

This is the result:

[blueb]

Looks good.

Will you be able to control colors?

e.g. Panels, Buttons, and other objects ( text and background )

[firace]

Looks good.

Will you be able to control colors?

e.g. Panels, Buttons, and other objects ( text and background )

Sure - See below screenshot.
However, I personally tend to leave the main window color unchanged, as customizing the colors of some standard PB gadgets can be a hassle

[firace]

Getting ready to share the kit with a first group of users!

I have decided to share the full source code to allow for a proper evaluation.
Also I chose to go for an early release and allow people to give it a try already, rather than waiting for a 'perfect' product.

Important: You must agree not to share the source code publicly without my prior approval.

During the first few weeks, priority will be given to users who have been active on this forum for at least 2 years.


To obtain a download link, please PM me and I will try to get back to you promptly (within 24-36 hours).
The package includes the full source code, and a couple example programs.

The evaluation period is 45 days. Then:

For use in commercial apps, please contact me to purchase a license at a reasonable cost.

For use in personal/family/freeware apps:
FREE forever! (Donations are optional but welcome and will definitely encourage me to keep improving the library.)
Also, if you build nice-looking programs using the library, I would love to see some screenshots!


Note: Procedure names and parameters are still likely to change during the next few weeks.

I am planning to rename the library to one of the below options. Which one do you prefer?

• betterlook.pbi (current)
• modernlook.pbi
• freshlook.pbi
• modernkit.pbi
• altlook.pbi
• prolook.pbi

[Axolotl]

just my spontaneous idea ...

I always prefer meaningful names.
This is an App UI Kit for designing user interfaces, right?
Maybe something like
-- ModernAppUIKit .. modern it is but maybe only today in 2023?

[firace]

Here's another screenshot of a possible GUI using this library.
Will send out the package to those who requested it later this week (possibly as early as tomorrow).
Apologies for not replying to all PMs so far, due to time constraints...

[ebs]

@firace,

I got your BetterLook source code - thank you!!

I started experimenting and noticed that the path to the IncludeFile in the two examples contains an elaborate folder structure. Since I put the PBI file in the same folder, I changed it to:

Code: Select all

IncludeFile "betterlook.pbi"

for convenience.

My first question/comment: I would love a way to specify the font used for OpenWindowML(), InfoGadgetML(), and ButtonGadgetML(). I went through and manually changed the font from "Segoe UI"/"Segoe UI Symbol" to "Tahoma". It looks very much the same, but I think it has some better Unicode glyph characters.

Thanks again for the chance to get an advance look at your excellent work!

[Bisonte]

@firace,

I got your BetterLook source code - thank you!!
...

Missed I something ? Where did you find it ?

[firace]

@firace,

I got your BetterLook source code - thank you!!

I started experimenting and noticed that the path to the IncludeFile in the two examples contains an elaborate folder structure. Since I put the PBI file in the same folder, I changed it to:

Code: Select all

IncludeFile "betterlook.pbi"

for convenience.

My first question/comment: I would love a way to specify the font used for OpenWindowML(), InfoGadgetML(), and ButtonGadgetML(). I went through and manually changed the font from "Segoe UI"/"Segoe UI Symbol" to "Tahoma". It looks very much the same, but I think it has some better Unicode glyph characters.

Thanks again for the chance to get an advance look at your excellent work!

Thanks for your nice feedback!
- I've posted a new version fixing the path issue and including a new example file demonstrating how to handle events
- Will consider making the font an easy to modify parameter in a later release

[firace]

@firace,

I got your BetterLook source code - thank you!!
...

Missed I something ? Where did you find it ?

Please see the May 29 post higher on this page
When I have a minute I will also update the top post with that information to make it easier to find.