MODULE: DynamicDialogs - creating complex GUIs the easy way

Share your advanced PureBasic knowledge/code with the community.
User avatar
Dreamland Fantasy
Enthusiast
Enthusiast
Posts: 335
Joined: Fri Jun 11, 2004 9:35 pm
Location: Glasgow, UK
Contact:

Re: MODULE: DynamicDialogs - creating complex GUIs the easy

Post by Dreamland Fantasy »

I tried using the DynamicDialogs module a while back, but could never get it to work as expected. I didn't have the time then to figure out why so stuck with creating dialogs using XML text strings.

I've just started working on a new project and would really like to use the DynamicDialog module, but I still can't get it to work as expected. It appears that when trying to pass flags to a ScrollArea gadget, the module is not passing this to the generated XML. Here is some sample code:

Code: Select all

XIncludeFile "DynamicDialogs_suffixed.pbi"

UseModule DynamicDialogs
UseModule DynamicDialogs_suffixed

CreateImage(0, 150, 150)

Window__(0, "Main Window", "", #PB_Window_ScreenCentered | #PB_Window_SystemMenu)
  ScrollArea__(0, "", #PB_Default, #PB_Default, #PB_Default, #PB_ScrollArea_BorderLess | #PB_ScrollArea_Center, 352, 288)
    Image__(1, "", ImageID(0))
  EndScrollArea__()
EndWindow__()

XML_MainWindow$ = GetXML()
Debug XML_MainWindow$

If OpenDialogWindow(0, XML_MainWindow$, 0, "Main Window", 0, 0, 0, 0, 0, #DialogError_MsgBox) = 0
  Debug "Dialog error: " + DialogError(0)
EndIf

Repeat
  Event = WaitWindowEvent()
Until Event = #PB_Event_CloseWindow
and the debug output:

Code: Select all

<window id='0' name='Main Window' flags='#PB_Window_SystemMenu | #PB_Window_TitleBar | #PB_Window_ScreenCentered'>
     <scrollarea id='0' width='352' height='288'>
          <image id='1'/>
     </scrollarea>
</window>

<?INFO - The following lines contain additional information, used by DynamicDialogs to support fonts and imageIDs ?>

<?Image ID='151329954' GadgetID='1' ?>
The code should generate a borderless ScrollArea gadget where the image is centred, but it has a border and the image is aligned top-left.

Kind regards,

Francis
PureLust
Enthusiast
Enthusiast
Posts: 477
Joined: Mon Apr 16, 2007 3:57 am
Location: Germany, NRW

Re: MODULE: DynamicDialogs - creating complex GUIs the easy

Post by PureLust »

Dreamland Fantasy wrote:It appears that when trying to pass flags to a ScrollArea gadget, the module is not passing this to the generated XML.
Hi Francis,

thank you for the Info.
You where right, the ScrollArea-Function was missing the evaluation of the Flags-Parameter ... sorry for that.

I've already uploaded a new Version.
Please download and try again.
Dreamland Fantasy wrote:I tried using the DynamicDialogs module a while back, but could never get it to work as expected.
I guess, the missing Flags-Parameter on ScrollareaGadget was not the only reason why you couldn't get your programs to work as expected.
If you have any further problems or questions, please let me know.

Greets from stormy Germany,
PL.
[Dynamic-Dialogs] - create complex GUIs the easy way
[DeFlicker] - easily deflicker your resizeable Windows
[WinFX] - Window Effects (incl. 'click-through' Window)
User avatar
Dreamland Fantasy
Enthusiast
Enthusiast
Posts: 335
Joined: Fri Jun 11, 2004 9:35 pm
Location: Glasgow, UK
Contact:

Re: MODULE: DynamicDialogs - creating complex GUIs the easy

Post by Dreamland Fantasy »

Thanks for the quick response.

I tried the updated version, but it does not work. The issue is the following line:

Code: Select all

If Flags	: XML$ + " flags='"+Str(Flags)+"'" : EndIf  ; Parameter: Flags

This just puts the flag in as a numeric value which does not appear to work.

I changed the line to the following which worked:

Code: Select all

			If Flags																									; Parameter: Flags
				
				XML$ + " flags='"
  
				If flags & #PB_ScrollArea_Flat        = #PB_ScrollArea_Flat       : XML$ + "#PB_ScrollArea_Flat | "       : EndIf
				If flags & #PB_ScrollArea_Raised      = #PB_ScrollArea_Raised     : XML$ + "#PB_ScrollArea_Raised | "     : EndIf
				If flags & #PB_ScrollArea_Single      = #PB_ScrollArea_Single     : XML$ + "#PB_ScrollArea_Single | "     : EndIf
				If flags & #PB_ScrollArea_BorderLess  = #PB_ScrollArea_BorderLess : XML$ + "#PB_ScrollArea_BorderLess | " : EndIf
				If flags & #PB_ScrollArea_Center      = #PB_ScrollArea_Center     : XML$ + "#PB_ScrollArea_Center | "     : EndIf
				If Right(XML$,3)=" | " : XML$ = Left(XML$, Len(XML$)-3) : EndIf
				XML$ + "'"
				
			EndIf
All is working fine now. :)

Thanks again, and thanks for making this very helpful module. :D

Kind regards,

Francis
PureLust
Enthusiast
Enthusiast
Posts: 477
Joined: Mon Apr 16, 2007 3:57 am
Location: Germany, NRW

Re: MODULE: DynamicDialogs - creating complex GUIs the easy

Post by PureLust »

Dreamland Fantasy wrote:I tried the updated version, but it does not work.
. . .
I changed the line to the following which worked:
Oh, so there WAS a reason why I did it the 'long' way on the other functions.
I just couldn't remember why I did it and that this way was necessary for Dialogs to work right ... so I tried it the 'quick & easy' way now. :mrgreen:

Thanks for mentioning and I'm happy that you understood the code so well, that you could work out the fix by your own.

I uploaded a new Version with the 'long' and correct way to evaluate the Flags - so the downloadable Version should work now as expected.

Thanks again and have fun with DynamicDialogs. :wink:
[Dynamic-Dialogs] - create complex GUIs the easy way
[DeFlicker] - easily deflicker your resizeable Windows
[WinFX] - Window Effects (incl. 'click-through' Window)
nsstudios
Enthusiast
Enthusiast
Posts: 274
Joined: Wed Aug 28, 2019 1:01 pm
Location: Serbia
Contact:

Re: MODULE: DynamicDialogs - creating complex GUIs the easy

Post by nsstudios »

Hi,

You've done an amazing job with this; it surely makes my life a lot easier!
But, I have a problem.
It seems like supplying the multiline flag to a string gadget does nothing... for some reason.
Would appreciate any help.

Code: Select all

EnableExplicit
XIncludeFile "includes\DynamicDialogs\DynamicDialogs_plain.pbi"
Enumeration gd: #c1: #l1: #msg: #l2: #l: #l3: #d: EndEnumeration
UseModule DynamicDialogs
UseModule DynamicDialogs_plain
window(0, "", "test", #Add_MenuSpacer | #Add_StatusBarSpacer | #PB_Window_ScreenCentered|#PB_Window_MaximizeGadget|#PB_Window_MinimizeGadget)
Container(#c1)
vBox(#msg)
text(#l1, "message", "message")
string(#msg, "message", "", #ES_MULTILINE|#ESB_DISABLE_LEFT|#ESB_DISABLE_RIGHT|#ES_AUTOVSCROLL|#ES_AUTOHSCROLL|#WS_VSCROLL)
EndVBox()
vBox(#l)
text(#l2, "chats", "chats")
ListIcon(#l, "listview")
EndVBox()
vBox(#d)
text(#l3, "details", "details")
string(#d, "details", "", #PB_String_ReadOnly|#ES_MULTILINE|#ESB_DISABLE_LEFT|#ESB_DISABLE_RIGHT|#ES_AUTOVSCROLL|#ES_AUTOHSCROLL|#WS_VSCROLL)
EndVBox()
EndContainer()
EndWindow()
OpenDialogWindow(0, GetXML())
SetWindowState(0, #PB_Window_Maximize)
Repeat
Until WaitWindowEvent()=#PB_Event_CloseWindow
Btw, I don't really get the difference between plane and suffixed versions.
User avatar
Andre
PureBasic Team
PureBasic Team
Posts: 2056
Joined: Fri Apr 25, 2003 6:14 pm
Location: Germany (Saxony, Deutscheinsiedel)
Contact:

Re: MODULE: DynamicDialogs - creating complex GUIs the easy

Post by Andre »

Hint: it would be very cool, if you can also add support for toolbars... - HeX0R showed here, how it could be done 8)
Bye,
...André
(PureBasicTeam::Docs & Support - PureArea.net | Order:: PureBasic | PureVisionXP)
PureLust
Enthusiast
Enthusiast
Posts: 477
Joined: Mon Apr 16, 2007 3:57 am
Location: Germany, NRW

Re: MODULE: DynamicDialogs - creating complex GUIs the easy

Post by PureLust »

nsstudios wrote: Fri Oct 23, 2020 6:44 pmYou've done an amazing job with this; it surely makes my life a lot easier!
Thanks, you are welcome. ;)
nsstudios wrote: Fri Oct 23, 2020 6:44 pmIt seems like supplying the multiline flag to a string gadget does nothing... for some reason.
Yes, you are right.
Because DynDialogs uses the PB internal Dialog functions, and they don't support any other Flags than original PB-Parameters, API-Parameter do not work here ... sorry.
And BP does not support changing Flags after the Gadget was generated, so you cannot add multiline afterwards using genuine PB functions.
But ... maybe you could use API functions to add multiline support afterwards - I bet you will find some information about this here in the forum.

Or ... why not just use an EditorGadget() instead of StringGadget()? Afaik, PBs EditorGadget() is nothing else than a multiline StringGadget().

Looking at your example, I found some problems within your code.
e.g. you always give an ID AND a Name to a Gadget.
Further you try to give an ID to commands like hBox() or vBox(), which require 'parameters', but no ID.
In the beginning, it's sometimes a bit hard to understand the logic behind PBs Dialog-Library and how to use it.
For further information about the possibilities and how to correctly use its functions, please have a look at the description for OpenXMLDialog() in the PuraBasic Reference Manual

TIPP: PB usually gives you some Syntax-Help for a command down in the Status-Bar. If you open the DynamicDialogs Include-Files in another IDE-Tab, you will get Syntax-Information about the DynDialog-Commands in the Status-Bar as well (this depends on your IDE settings, but it's very helpful to enable this). For further information about the parameters, pls. look at the PB-Manual (see link above). For available and helpful #constants, supported by DynamicDialogs (like for '#Alignment'), pls have a look at the Sorce code in DD Main-Modul.

Attached pls find an edited version of your example with some comments and EditorGadget() instead of StringGadget():
(I used thy 'suffixed_IDonly' Modul-Version here, instead of the 'plain'-Version. More info about that see comment below.)

Code: Select all

EnableExplicit
XIncludeFile "d:\Eigene Dateien\Programmierung\PureBasic\DynamicDialogs\DynamicDialogs_suffixed_IDonly.pbi"

Enumeration gd: #c1: #l1: #msg: #l2: #l: #l3: #d: EndEnumeration
UseModule DynamicDialogs
UseModule DynamicDialogs_suffixed_IDonly
Window__(0, "test", #Add_MenuSpacer | #Add_StatusBarSpacer | #PB_Window_ScreenCentered|#PB_Window_MaximizeGadget|#PB_Window_MinimizeGadget|#PB_Window_SizeGadget, 800, 600,400,400)
   vBox__(1)            ; I added a vBox(), because I added a "resize me" Textbox at the Ende, which I want to stay at the bottom the whole time. To realize this, use vBox(1) to only expand its first child
      Container__(#c1)  ; a container is not really needed here, - pls remember: PB Dialog container only accept ONE direkt child-element, you need to cover following elements in one major element (like a hBox() or a vBox())
      vBox__()				; vBox() or hBox() have NO ID, only parameters (in your example you placed an ID, where it was requesting a parameter) - pls see OpenXMLDialog()-Help to get more info on that
         vBox__(2)      ; vBox(2) will expand only his 2nd child-Elements - in this case, the String-Element
            Text__(#l1, "message") 
            Editor__(#msg, "Test-Message")
            String__(#PB_Any, "I'm a singlelined String-Gadget... edit me")
         EndVBox__()
         vBox__(2)      ; vBox(2) will expand only his 2nd child-Elements - in this case, the ListIcon-Element
            Text__(#l2, "chats")
            ListIcon__(#l, "my ListView")
         EndVBox__()
         vBox__(2)      ; vBox(2) will expand only his 2nd child-Elements - in this case, the String-Element
            Text__(#l3, "details")
            Editor__(#d, "Here are some Details ..."+Chr(10)+"blaa.."+Chr(10)+"blaablaa.."+Chr(10)+"blaaaa...", #PB_Editor_ReadOnly,#PB_Default,80)
            String__(#PB_Any, "I'm a single-lined and readonly String-Gadget...", #PB_String_ReadOnly)
         EndVBox__()
      EndVBox__()			; close major-child from container
      EndContainer__()  ; close the container
      Text__(#PB_Any, "resize me =>",0,#PB_Default,#PB_Default,#alignRight)  ; now place an 'resize me' Text as 2nd vBox()-Child, which will be aligned right and will not be resized (see above)
   EndVBox__()          ; close the main vBox()-Frame, where only the first child (the container) was resized
EndWindow__()
OpenDialogWindow(0, GetXML())
;SetWindowState(0, #PB_Window_Maximize)

Repeat
Until WaitWindowEvent()=#PB_Event_CloseWindow
nsstudios wrote: Fri Oct 23, 2020 6:44 pm Btw, I don't really get the difference between plane and suffixed versions.
In functionality there is no difference.
But I think it makes a big difference if you use the Auto complete abilities of the PB-IDE and want to have working auto-indentation.
e.g. if you want to add a Text-Gadget, you type 'text' and Auto Complate gives you dozens of opportunities to choose from (at least with my IDE settings).
But by typing 'text_', Auto Complete only gives me my wanted 'Text__(' option from DynamicDialogs. So (at least for me), the suffixed Version is much more comfortable to use than the plain version.
Further the suffix is needed, if you want a working auto indentation for the DynamicDialogs command (which is VERY helpful - more on that further on).
Last but not least, I like the visual difference of the suffix compared to genuine PB commands, so I can immediately see in my code, what commands are from DynDialogs.

BUT !!! There is another Version I prefer most (and which I have used in my example above) - the suffixed, ID only !!!

As you can see in the description about PBs Dialog Library in the reference Manual, you can create and identify a Dialog-Item either via ID-Number (as like all normal PB-Gadgets) or by a Name (given as a string).
Looking at your original example, this could cause a bit confusion as you have given an ID AND a Name for a Gadget ... and sometimes the same NAME for two different Gadgets.
Usually this is ment as an Either-OR ... not as an AND. So, because the Dialog-Library supported this, I included this in my Wrapper.
But as a PB-Programmer (who is used in identifying an Item via ID-Number) I think it's a bit annoying, that the syntax always requires a name, even I never use it.
So ... as an alternative to the 'original' plain- and suffixed-version, which require parameters for both (ID and NAME - even is the name is empty=""), I created an 'ID-Only' and a 'Name-Only' Version, for those programmers, who prefer the either or the other way. The Syntax in these Versions require either only the ID or only the Name - which is more clear to me.
And ... looking at your original example code ... I think the ID-Only Version will be the right one for you (because you always try to give an ID). ;)

Futher: INDENTATION !!! ... to improve the readability of a code, I think indentation is a big thing.
Because the BP-IDE does not know the DynDialogs commands and so it does not do any indentation on them, I've created a little tool, which 'teaches' the IDE how to indent the DynDialog commands right.
This is only available for the 'suffixed' Modul-Versions, because to make sure, the indentation for DynamicDialogs does not interfere with other commands (e.g. an indentation on "Container" for a Container()-Element will also indent all other PB-Commands, starting with 'Container'), a suffix is required, to uniquely identify the DynamicDialogs command.
Pls. see and run the 'IDE-Indentation Help-Tool', included in the DynDialogs-Zip file.
NOTE: You HAVE TO CLOSE the IDE first and also HAVE TO RUN this program as Admin-User.

Hope this info could help to blow away a bit of the magic fog around PB Dialogs or my DynamicDialogs. :mrgreen:

Greets, PL.
[Dynamic-Dialogs] - create complex GUIs the easy way
[DeFlicker] - easily deflicker your resizeable Windows
[WinFX] - Window Effects (incl. 'click-through' Window)
PureLust
Enthusiast
Enthusiast
Posts: 477
Joined: Mon Apr 16, 2007 3:57 am
Location: Germany, NRW

Re: MODULE: DynamicDialogs - creating complex GUIs the easy

Post by PureLust »

Andre wrote: Fri Nov 13, 2020 11:26 pm Hint: it would be very cool, if you can also add support for toolbars... - HeX0R showed here, how it could be done 8)
Hi Andre, :D
I'm not sure if this is really necessary or even useful.

1. PB has very powerful functions to create and handle toolbars ... so why invent the wheel again, only in another color? ;)

2. As you know, one of the biggest drawbacks of PBs Dialog-Library is, that you cannot change anything within the Dialog after you have created it.
So this will limit you to a static and not changeable Tool-Bar, unless you recreate and reopen the whole Dialog or you have to use PBs Tool-Bar commands to manipulate a Tool-Bar you have created via a Dialog in the first place.

Sure, it would be possible to integrate this, but really .... what for? :mrgreen:
Or do you see any benefit in creating a Tool-Bar via XML (which is then converted into BP commands) instead on doing it by genuine PB commands in the first place?

Greets, Albert.
[Dynamic-Dialogs] - create complex GUIs the easy way
[DeFlicker] - easily deflicker your resizeable Windows
[WinFX] - Window Effects (incl. 'click-through' Window)
nsstudios
Enthusiast
Enthusiast
Posts: 274
Joined: Wed Aug 28, 2019 1:01 pm
Location: Serbia
Contact:

Re: MODULE: DynamicDialogs - creating complex GUIs the easy

Post by nsstudios »

Thank you for the clarification!
PureLust wrote: Mon Jan 17, 2022 8:11 pm Or ... why not just use an EditorGadget() instead of StringGadget()? Afaik, PBs EditorGadget() is nothing else than a multiline StringGadget().
Editor gadget has always bothered me because of its trapping of the tab key, which makes it very inconvenient to use with keyboard-only, which is very important to me because of accessibility.
I.e., if you have an editor gadget in the list of gadgets, once you press tab to get into it, pressing tab puts the tab character inside it rather than letting you go out of it, so you instead have to shift+tab to access any content that might be positioned after it. Really wish pb would have a toggle for that, but one can dream I guess.
PureLust wrote: Mon Jan 17, 2022 8:11 pm Because DynDialogs uses the PB internal Dialog functions, and they don't support any other Flags than original PB-Parameters
I thought certain dialog library flags had the ability to use runtime constants though?
PureLust wrote: Mon Jan 17, 2022 8:11 pm Looking at your example, I found some problems within your code.
e.g. you always give an ID AND a Name to a Gadget.
Further you try to give an ID to commands like hBox() or vBox(), which require 'parameters', but no ID.
Is there something wrong with using both name and id?
Also, whoops at the giving boxes ID. I haven't looked at my code for a long time, but my updated code no longer uses ID's for boxes, however it still uses both id's and names for gadgets.
Thank you for the clarification once more, and sorry for the extremely delayed reply.
Quin
Enthusiast
Enthusiast
Posts: 281
Joined: Thu Mar 31, 2022 7:03 pm
Location: United States
Contact:

Re: MODULE: DynamicDialogs - creating complex GUIs the easy way

Post by Quin »

Amazing work on this library, thanks loads for it!

In my app, I have a ListView() of items that's constantly being updated. The user can also open other windows in my app (e.g. a configuration dialog). The problem is though, after I close the other windows, the main window doesn't stay alive, and even if I recreate it, my list items are gone. I could probably store the list items in memory and manually repopulate it and set your selection, but that seems like a massive hack, and I would imagine that there's at least some sort of way to keep a window alive like what I want?
Thanks!
PB v5.40/6.10, Windows 10 64-bit.
16-core AMD Ryzen 9 5950X, 128 GB DDR5.
User avatar
mk-soft
Always Here
Always Here
Posts: 5335
Joined: Fri May 12, 2006 6:51 pm
Location: Germany

Re: MODULE: DynamicDialogs - creating complex GUIs the easy way

Post by mk-soft »

You must query the correct window after event #PB_Event_CloseWindow with EventWindow() and close it with CloseWindow(xyz)
My Projects ThreadToGUI / OOP-BaseClass / EventDesigner V3
PB v3.30 / v5.75 - OS Mac Mini OSX 10.xx - VM Window Pro / Linux Ubuntu
Downloads on my Webspace / OneDrive
Quin
Enthusiast
Enthusiast
Posts: 281
Joined: Thu Mar 31, 2022 7:03 pm
Location: United States
Contact:

Re: MODULE: DynamicDialogs - creating complex GUIs the easy way

Post by Quin »

mk-soft wrote: Sun Nov 19, 2023 4:37 pm You must query the correct window after event #PB_Event_CloseWindow with EventWindow() and close it with CloseWindow(xyz)
Got it, thanks!
PB v5.40/6.10, Windows 10 64-bit.
16-core AMD Ryzen 9 5950X, 128 GB DDR5.
User avatar
jacdelad
Addict
Addict
Posts: 1431
Joined: Wed Feb 03, 2021 12:46 pm
Location: Planet Riesa
Contact:

Re: MODULE: DynamicDialogs - creating complex GUIs the easy way

Post by jacdelad »

Where can I download it? The link is dead.
PureBasic 6.04/XProfan X4a/Embarcadero RAD Studio 11/Perl 5.2/Python 3.10
Windows 11/Ryzen 5800X/32GB RAM/Radeon 7770 OC/3TB SSD/11TB HDD
Synology DS1821+/36GB RAM/130TB
Synology DS920+/20GB RAM/54TB
Synology DS916+ii/8GB RAM/12TB
Mindphazer
Enthusiast
Enthusiast
Posts: 340
Joined: Mon Sep 10, 2012 10:41 am
Location: Savoie

Re: MODULE: DynamicDialogs - creating complex GUIs the easy way

Post by Mindphazer »

jacdelad wrote: Mon Nov 20, 2023 3:46 pm Where can I download it? The link is dead.
The link works fine here
http://www.bmi-online.de/public/DynamicDialogs.zip
MacBook Pro 14" M1 Pro - 16 Gb - MacOS 14 - Iphone 15 Pro Max - iPad at home
...and unfortunately... Windows at work...
User avatar
jacdelad
Addict
Addict
Posts: 1431
Joined: Wed Feb 03, 2021 12:46 pm
Location: Planet Riesa
Contact:

Re: MODULE: DynamicDialogs - creating complex GUIs the easy way

Post by jacdelad »

Oh ok, then it must be my DNS-filter. Thanks for telling me
PureBasic 6.04/XProfan X4a/Embarcadero RAD Studio 11/Perl 5.2/Python 3.10
Windows 11/Ryzen 5800X/32GB RAM/Radeon 7770 OC/3TB SSD/11TB HDD
Synology DS1821+/36GB RAM/130TB
Synology DS920+/20GB RAM/54TB
Synology DS916+ii/8GB RAM/12TB
Post Reply