IceDesign GUI designer

storck · Post by **storck** » Sat Mar 02, 2024 12:02 pm

@ChrisR
Thank you for adding the splitter. I tested with a main window, a tab with two panels and a splitter. From my testing, I must enable "proportional size for all gadgets" to have the 2 child gadgets locked and resized? If not, when I resize the main window, the splitter and the child gadgets are not resized. Is this correct?

// Storck

ChrisR · Post by **ChrisR** » Sat Mar 02, 2024 1:58 pm

Hi Storck,
Yes, "proportional size for all gadgets" option is the solution for automatic resizing.
Note that the Splitter is resized by the code but not the 2 child gadgets, which are automatically resized, internally by the splitter.
And you'll notice that the positions and dimensions of the 2 child gadgets are disabled, they are locked.

If needed, instead of "proportional size for all gadgets", for the Splitter, it is also possible to play with individual locked and/or proportional properties.
But the simplest solution is indeed "proportional size for all gadgets", all should be done

storck · Post by **storck** » Sat Mar 02, 2024 2:18 pm

@ChrisR

Thank you for the quick reply. I see now that I can indeed adjust individual locked and/or proportional properties. The thing was that sometimes when I click the sizer the locked/proportional properties are not displayed. If I click outside the splitter (was hard to do since the splitter child gadgets filled the entire window), and then click it again - the properties show up. Anyways, thank you for the splitter. A great addition to a great tool.

// Storck

ChrisR · Post by **ChrisR** » Sat Mar 02, 2024 3:37 pm

The splitter is indeed not so easy to select, the 2 children take up almost all the space, it remains the splitter size itself, of 7 px, between the 2 children gadgets.
It should be 4 px without the #PB_Splitter_Separator flag but I keep the 7 px size in IceDesign to see and select it more easily.
Well, the easiest way is to select one of the two children and then use the Esc key to go down to the previous level, the Splitter.
Or also via the Tree in the List Controls tab.
Thanks

ChrisR · Post by **ChrisR** » Thu Mar 07, 2024 4:14 pm

IceDesign has been updated in version 2.0.3

For Multi-Window support, change "Window Name To Var/#Const" setting option, by removing #Windows and adding #Gadget, #Imag or #Font, I mean:
#Windows_Main -> #Gadget_Main_Button, #Gadget_Main_CheckBox -> #Imag_Main_ImageName -> #Font_Main_Arial_12_BI
#WinMain -> #Gadget_WinMain_Button, #Gadget_WinMain_CheckBox -> #Imag_WinMain_ImageName -> #Font_WinMain_Arial_12_BI
With images using the image file names and fonts using their names, sizes and styles now.

Define CustomFilterCallback() colors as long in JellyButtons.pbi and ObjectTheme.pbi, required by PB 6.10 x64.

Optimized SplitterGadget resizing.

ChrisR · Post by **ChrisR** » Mon Mar 11, 2024 4:56 pm

IceDesign has been updated in version 2.0.4

Panel tab heights and ComboBox line heights are DPIaware now in the Designer.

For HiDPI screens with scaling of 150% or up, toolbar button images are enlarged with a 2nd set of images.

ChrisR · Post by **ChrisR** » Mon Mar 11, 2024 6:35 pm

Fixed a small error in the control name check due to a typo, sorry. It is online
Thanks Pete for seeing it so quickly

storck · Post by **storck** » Wed Mar 13, 2024 5:14 pm

@ChrisR

Quick question. If I use "proportional size for all gadgets" and place a component in a window the preview works ok. If i don't enable proportional size and lock both top and bottom, I can't preview. I get

Error: Line 84 - With 'EnableExplicit', variables have to be declared <MyWindowName>_HeightIni.

Is this the way it's supposed to work?

/ Storck

ChrisR · Post by **ChrisR** » Wed Mar 13, 2024 5:48 pm

Oops, there's a bug, it should never crash, the generated source code should always be operational out of the box.
However, I've just tried following your instructions with a window and a button, but I can't reproduce it!
When you have the problem, can you save the .icef form and share the contents with me here between code tags.

storck · Post by **storck** » Wed Mar 13, 2024 6:46 pm

@ChrisR

Thank you. I ditched my old file and started a new one. No problem whatsoever. Maybe something went wrong after saving it a couple of times changing the option for proportional for all gadgets. Don't know. The old project throws an error. The new one doesn't. Thank you for being so supportive.

/ Storck

ChrisR · Post by **ChrisR** » Wed Mar 13, 2024 10:55 pm

IceDesign has been updated in version 2.0.5

Add a third set of toolbar images for DPI scaling factors of 200% or more.

IceDesign window positions, including in multi-monitor mode, are now saved in IceDesign.ini, in addition to the size, so it can reuse the same position and size at the next restart.

Cyllceaux · Post by **Cyllceaux** » Thu Mar 14, 2024 8:11 am

I'm not sure if the bug is allready reported, but the "locked" Feature does not work correctly:

Code: Select all

[
   {
      "Level"           : 0,
      "Gadget"          : 2,
      "Model"           : "OpenWindow",
      "Type"            : 0,
      "Name"            : "#wndMain",
      "Container"       : 1,
      "ParentGadget"    : 0,
      "TabIndex"        : -65535,
      "X"               : 0,
      "Y"               : 0,
      "Width"           : 1240,
      "Height"          : 550,
      "Group"           : 0,
      "Caption"         : "#Titl:Tuttle",
      "Option1"         : "#Tool:000",
      "Option2"         : "#Boun:0|0|0|0",
      "Option3"         : "#Setg:1|2|1|1|1|1|1|1|1|1|1|1|255|0|0|||1|0|2|1|1|32|Auto|",
      "FontText"        : "",
      "FrontColor"      : "#Nooo",
      "BackColor"       : "",
      "Lock"            : 0,
      "Disable"         : 0,
      "Hide"            : 0,
      "BindGadget"      : "#Nooo",
      "ToolTip"         : "#Nooo",
      "LockPosition"    : 9,
      "ProportionalSize": 0,
      "Constants"       : "Window_SystemMenu(x)|Window_MinimizeGadget(x)|Window_MaximizeGadget(x)|Window_SizeGadget(x)|Window_Invisible|Window_TitleBar|Window_Tool|Window_BorderLess|Window_ScreenCentered(x)|Window_WindowCentered|Window_Maximize|Window_Minimize|Window_NoGadgets|Window_NoActivate",
      "Key"             : "00-655350005800013"
   },
   {
      "Level"           : 1,
      "Gadget"          : 38240976,
      "Model"           : "JellyButton",
      "Type"            : 1,
      "Name"            : "#Btn_Dei_Mudda",
      "Container"       : 0,
      "ParentGadget"    : 2,
      "TabIndex"        : -65535,
      "X"               : 10,
      "Y"               : 10,
      "Width"           : 470,
      "Height"          : 270,
      "Group"           : 0,
      "Caption"         : "#Text:Dei Mudda",
      "Option1"         : "",
      "Option2"         : "",
      "Option3"         : "",
      "FontText"        : "",
      "FrontColor"      : "",
      "BackColor"       : "",
      "Lock"            : 0,
      "Disable"         : 0,
      "Hide"            : 0,
      "BindGadget"      : "1",
      "ToolTip"         : "",
      "LockPosition"    : 9,
      "ProportionalSize": 0,
      "Constants"       : "Button_Right|Button_Left|Button_Default|Button_MultiLine|Button_Toggle|#BS_Bottom|#BS_Top",
      "Key"             : "01-655350001000010"
   },
   {
      "Level"           : 1,
      "Gadget"          : 384868336,
      "Model"           : "ButtonGadget",
      "Type"            : 1,
      "Name"            : "#Btn_1",
      "Container"       : 0,
      "ParentGadget"    : 2,
      "TabIndex"        : -65535,
      "X"               : 1130,
      "Y"               : 10,
      "Width"           : 100,
      "Height"          : 36,
      "Group"           : 0,
      "Caption"         : "#Text:Button_1",
      "Option1"         : "",
      "Option2"         : "",
      "Option3"         : "",
      "FontText"        : "",
      "FrontColor"      : "#Nooo",
      "BackColor"       : "#Nooo",
      "Lock"            : 0,
      "Disable"         : 0,
      "Hide"            : 0,
      "BindGadget"      : "0",
      "ToolTip"         : "",
      "LockPosition"    : 12,
      "ProportionalSize": 0,
      "Constants"       : "Button_Right|Button_Left|Button_Default|Button_MultiLine|Button_Toggle|#BS_Bottom|#BS_Flat|#BS_Top",
      "Key"             : "01-655350001001130"
   },
   {
      "Level"           : 1,
      "Gadget"          : 384868432,
      "Model"           : "CanvasContainerGadget",
      "Type"            : 33,
      "Name"            : "#CanvCont_1",
      "Container"       : 1,
      "ParentGadget"    : 2,
      "TabIndex"        : -65535,
      "X"               : 520,
      "Y"               : 150,
      "Width"           : 700,
      "Height"          : 390,
      "Group"           : 0,
      "Caption"         : "",
      "Option1"         : "",
      "Option2"         : "",
      "Option3"         : "",
      "FontText"        : "#Nooo",
      "FrontColor"      : "#Nooo",
      "BackColor"       : "#Nooo",
      "Lock"            : 0,
      "Disable"         : 0,
      "Hide"            : 0,
      "BindGadget"      : "0",
      "ToolTip"         : "",
      "LockPosition"    : 45,
      "ProportionalSize": 0,
      "Constants"       : "Canvas_Border(x)|Canvas_ClipMouse|Canvas_Keyboard|Canvas_DrawFocus|Canvas_Container(x)",
      "Key"             : "01-655350015000520"
   },
   {
      "Level"           : 1,
      "Gadget"          : 38242608,
      "Model"           : "CanvasGadget",
      "Type"            : 33,
      "Name"            : "#cnvTest",
      "Container"       : 0,
      "ParentGadget"    : 2,
      "TabIndex"        : -65535,
      "X"               : 160,
      "Y"               : 330,
      "Width"           : 140,
      "Height"          : 40,
      "Group"           : 0,
      "Caption"         : "",
      "Option1"         : "",
      "Option2"         : "",
      "Option3"         : "",
      "FontText"        : "#Nooo",
      "FrontColor"      : "#Nooo",
      "BackColor"       : "#Nooo",
      "Lock"            : 0,
      "Disable"         : 0,
      "Hide"            : 0,
      "BindGadget"      : "1",
      "ToolTip"         : "",
      "LockPosition"    : 9,
      "ProportionalSize": 0,
      "Constants"       : "Canvas_Border(x)|Canvas_ClipMouse|Canvas_Keyboard|Canvas_DrawFocus|Canvas_Container",
      "Key"             : "01-655350033000160"
   },
   {
      "Level"           : 2,
      "Gadget"          : 384870928,
      "Model"           : "ButtonGadget",
      "Type"            : 1,
      "Name"            : "#Btn_2",
      "Container"       : 0,
      "ParentGadget"    : 384868432,
      "TabIndex"        : -65535,
      "X"               : 540,
      "Y"               : 240,
      "Width"           : 140,
      "Height"          : 140,
      "Group"           : 0,
      "Caption"         : "#Text:Button_2",
      "Option1"         : "",
      "Option2"         : "",
      "Option3"         : "",
      "FontText"        : "",
      "FrontColor"      : "#Nooo",
      "BackColor"       : "#Nooo",
      "Lock"            : 0,
      "Disable"         : 0,
      "Hide"            : 0,
      "BindGadget"      : "0",
      "ToolTip"         : "",
      "LockPosition"    : 36,
      "ProportionalSize": 0,
      "Constants"       : "Button_Right|Button_Left|Button_Default|Button_MultiLine|Button_Toggle|#BS_Bottom|#BS_Flat|#BS_Top",
      "Key"             : "02-655350024000540"
   }
]

The Buttons Button_1 and Button_2 should move, but not resize. They are only locked on the right side.
This is the generated size code:

Code: Select all

Procedure Resize_wndMain()
	Protected wndMain_WidthIni = 1240, wndMain_HeightIni = 550
	Protected CanvCont_1_WidthIni = 700, CanvCont_1_HeightIni = 390
	Protected ScaleX.f, ScaleY.f

	ScaleX = WindowWidth(wndMain) / wndMain_WidthIni : ScaleY = WindowHeight(wndMain) / wndMain_HeightIni
	ResizeGadget(Btn_Dei_Mudda, ScaleX * 10, ScaleY * 10, ScaleX * 470, ScaleY * 270)
	ResizeGadget(Btn_1, ScaleX * 1130, ScaleY * 10, ScaleX * 100, ScaleY * 36)
	ResizeGadget(CanvCont_1, ScaleX * 520, ScaleY * 150, ScaleX * 700, ScaleY * 390)
	ScaleX = GadgetWidth(CanvCont_1) / CanvCont_1_WidthIni : ScaleY = GadgetHeight(CanvCont_1) / CanvCont_1_HeightIni
	ResizeGadget(Btn_2, ScaleX * 540, ScaleY * 240, ScaleX * 140, ScaleY * 140)
	ScaleX = WindowWidth(wndMain) / wndMain_WidthIni : ScaleY = WindowHeight(wndMain) / wndMain_HeightIni
	ResizeGadget(cnvTest, ScaleX * 160, ScaleY * 330, ScaleX * 140, ScaleY * 40)
EndProcedure

ChrisR · Post by **ChrisR** » Thu Mar 14, 2024 11:47 am

Hi Cyllceaux,
Thanks for sharing your .icef form, the right way to understand and reproduce

That's because you have the "Proportional Size for All Gadgets" option enabled in the settings.
"Proportional Size for All Gadgets" is a general option that takes priority over the Lock & Proportional properties of each Gadget.
When enabled, All Gadgets will use this proportional properties, regardless of their lock & proportional options.
And with it, when you resize a window, all containers and gadgets are automatically resized according to the window size.
A bit like how it's done for the Dialogs library. It's really useful for ~90% of cases.

And if you disable the option, Lock and Proportional properties must be handled individually for each Gadget.
In your case, if that's what you want, enable Proportional for the container and scrollarea, and keep lock top/left for both buttons.

ChrisR · Post by **ChrisR** » Thu Mar 14, 2024 12:18 pm

I just realized that your surprise is probably linked to my changing for "Proportional Size for All Gadgets" and "DPIAware" default values on the 1st use.
Both options are now enabled by default on 1st use (without IceDesign.ini).
When closing IceDesign, changed or not, the settings are saved in IceDesign.ini to be applied for the next run.
It is also saved in the .icef form file, so that the same config can be used the next time the form is opened.

storck · Post by **storck** » Fri Mar 15, 2024 1:46 pm

@ChrisR

Hi again!
It seems I was a bit hasty when trying to reproduce the earlier error message in a new project. I still get
Error: Line 84 - With 'EnableExplicit', variables have to be declared <MyWindowName>_HeightIni.

It happens when I add a menubar, a toolbar or a statusbar to a window with a component where top, bottom, left and right is checked. Here are the contents of the .icef

/ Storck

Code: Select all

[
   {
      "Level"           : 0,
      "Gadget"          : 2,
      "Model"           : "OpenWindow",
      "Type"            : 0,
      "Name"            : "#Window_0",
      "Container"       : 1,
      "ParentGadget"    : 0,
      "TabIndex"        : -65535,
      "X"               : 0,
      "Y"               : 0,
      "Width"           : 1010,
      "Height"          : 750,
      "Group"           : 0,
      "Caption"         : "#Titl:Title",
      "Option1"         : "#Tool:111",
      "Option2"         : "#Boun:0|0|0|0",
      "Option3"         : "#Setg:1|2|1|1|1|1|1|0|1|0|0|1|255|1|1|||1|0|2|0|1|32||",
      "FontText"        : "",
      "FrontColor"      : "#Nooo",
      "BackColor"       : "",
      "Lock"            : 0,
      "Disable"         : 0,
      "Hide"            : 0,
      "BindGadget"      : "#Nooo",
      "ToolTip"         : "#Nooo",
      "LockPosition"    : 9,
      "ProportionalSize": 0,
      "Constants"       : "Window_SystemMenu(x)|Window_MinimizeGadget(x)|Window_MaximizeGadget(x)|Window_SizeGadget(x)|Window_Invisible|Window_TitleBar|Window_Tool|Window_BorderLess|Window_ScreenCentered(x)|Window_WindowCentered|Window_Maximize|Window_Minimize|Window_NoGadgets|Window_NoActivate",
      "Key"             : "00-655350003100008"
   },
   {
      "Level"           : 1,
      "Gadget"          : 267028896,
      "Model"           : "PanelGadget",
      "Type"            : 28,
      "Name"            : "#Panel_1",
      "Container"       : 1,
      "ParentGadget"    : 2,
      "TabIndex"        : -65535,
      "X"               : 0,
      "Y"               : 0,
      "Width"           : 1010,
      "Height"          : 679,
      "Group"           : 0,
      "Caption"         : "",
      "Option1"         : "",
      "Option2"         : "",
      "Option3"         : "",
      "FontText"        : "",
      "FrontColor"      : "#Nooo",
      "BackColor"       : "#Nooo",
      "Lock"            : 0,
      "Disable"         : 0,
      "Hide"            : 0,
      "BindGadget"      : "0",
      "ToolTip"         : "",
      "LockPosition"    : 45,
      "ProportionalSize": 0,
      "Constants"       : "",
      "Key"             : "01-655350000000000"
   },
   {
      "Level"           : 2,
      "Gadget"          : 50000,
      "Model"           : "PanelGadget",
      "Type"            : 28,
      "Name"            : "#Tab_0",
      "Container"       : 1,
      "ParentGadget"    : 267028896,
      "TabIndex"        : 0,
      "X"               : 0,
      "Y"               : 0,
      "Width"           : 0,
      "Height"          : 0,
      "Group"           : 0,
      "Caption"         : "#TabN:Tab_0",
      "Option1"         : "",
      "Option2"         : "",
      "Option3"         : "",
      "FontText"        : "#Nooo",
      "FrontColor"      : "#Nooo",
      "BackColor"       : "#Nooo",
      "Lock"            : 0,
      "Disable"         : 0,
      "Hide"            : 0,
      "BindGadget"      : "#Nooo",
      "ToolTip"         : "#Nooo",
      "LockPosition"    : 9,
      "ProportionalSize": 0,
      "Constants"       : "",
      "Key"             : "020000000000000000"
   },
   {
      "Level"           : 2,
      "Gadget"          : 50001,
      "Model"           : "PanelGadget",
      "Type"            : 28,
      "Name"            : "#Tab_1",
      "Container"       : 1,
      "ParentGadget"    : 267028896,
      "TabIndex"        : 1,
      "X"               : 0,
      "Y"               : 0,
      "Width"           : 0,
      "Height"          : 0,
      "Group"           : 0,
      "Caption"         : "#TabN:Tab_1",
      "Option1"         : "",
      "Option2"         : "",
      "Option3"         : "",
      "FontText"        : "#Nooo",
      "FrontColor"      : "#Nooo",
      "BackColor"       : "#Nooo",
      "Lock"            : 0,
      "Disable"         : 0,
      "Hide"            : 0,
      "BindGadget"      : "#Nooo",
      "ToolTip"         : "#Nooo",
      "LockPosition"    : 9,
      "ProportionalSize": 0,
      "Constants"       : "",
      "Key"             : "020000010000000000"
   }
]

PureBasic Forums - English

IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer

Re: IceDesign GUI designer