IceDesign GUI designer

[ChrisR]

IceDesign has been updated in version 1.9.4

Continued from previous version 1.9.3...
Fix Bugs when using a window background image.
Exe files are now compiled with PureBasic 6.03 C Backend. This was not the case for IceDesign v1.9.3 following the installation of the latest PureBasic 6.03 version.

I'm reposting the image to give you an idea of what you can do with Auto Color Gadgets and IceButtons Theme enabled, to modernize your UIs a bit.

[Kuron]

Thank you, Chris!

[williamvanhoecke]

Hi,
Very cool designer.
I have this very complex 'dpi-aware' 'graphical' and 'multi-langual' forms designed in PureBasic
I won't go in detail, but I wrote all resize AND dpi-independent-graphics AND multi-language-selection code myself.
All works fine, but as a result I end-up with complex code, difficult to maintain and voulnarable to changes.

Since IceDesigner does a lot of work for me, I wil try to switch enirely to it.
I bought a licence and I have now started a modest try to convert my code.

However there is little (to none) help available.
I am not sure how the 'DPI-aware' works, and not at all how to use the 'Multi-language Support' is to be implemented ?
Can you elaborate on that ?

[ChrisR]

Hello william,
Thanks for your purchase, have a good use

To convert your interfaces to IceDesign format (*.icef), if you need, you can use PBForm2IceDesign.pbi
It can do the work for you to convert an interface, see "How to use" in the header, it's really simple:
Add: XIncludeFile "PBForm2IceDesign.pbi" at the beginning of your Source Code and then after loading the Window(s) add: PBForm2IceDesign(), That's All.

For DPIaware resizing, nothing special is done, the "Enable DPI aware" option only enables PureBasic's DPIaware compilation option.
I'm not sure it's necessary to use a module anymore, the DPIaware compilation option does it natively for you for almost all Gadgets now (not for Image, Canvas Gadget).
It should be sufficient in most cases without having to manage it, but of course, it's up to you to still use a module or not.

As for the documentation, yes, I know it's missing, but I think that the handling or most of the options should be fairly intuitive and self-explanatory.
Writing isn't really my thing, and with my poor English, it's difficult. And from experience, in 90% of cases the doc isn't read anyway!
If needed, the code generated in the read-only editor at the bottom, should allow you to immediately see and understand the use of the various options.

But you're right, there are a few options that need a little more documention, such as multi-language support.
I'll try to write a bit to explain the "multi-language" option, see below

[ChrisR]

Multi-language:
The option "Multi-Language Support" will do most of the work for you, extracting and preparing the xxx_Lang.pb code.
The code is based on Freak's solution : An easy to use solution for multilanguage programs and this is how it's done in PureBasic, IDE.
Or rather, the code is based on GPI's version with a map, itself based on the same concept

The work is ready to go, but it's up to you to adapt xxx_Lang.pb, according to the way you want to use multi-language in your application:

By default, it will use the DataSection, label DefaultLang: for the default language (usually English) with all the interface text prepared for you.
Then, when running, it will create a language file (e.g. Français.lang) in your application's "Lang" subfolder in accordance with GetLocaleInfo_(#LOCALE_USER_DEFAULT,..) Api, here.
Now it's your turn to translate Français.lang and others language files.

If new gadgets with a texts are added in IceDesign, the DataSection will be updated in relation.
And when running again, the new texts, keys will automatically be added to the "locale user" language files, without overwriting the previously translated text.
It is made that way to work immediately, out of the box, but,

But it's probably not the way you want to use multi-Language. There is no standard method, there are so many possible ways to hanle it
You need to adapt by changing the included source xxx_Lang.pb to suit your needs. To help, some examples are included, commented at the bottom of xxx_Lang.pb.


Ex: with a Window and only 1 button, caption "My Button", and the Multi-Language option enabled in the settings.
The code generated (ex MyApp.pb) for the button will be:

Code: Select all

ButtonGadget(#Button, 30, 30, 200, 60, GetInterfaceLang("Button"))

GetInterfaceLang("Button") allows you to get the translation for the "Button" key according to the language previously loaded

And In MyApp_Lang.pb, you'll have:

Code: Select all

DataSection
  ; Here the default language is specified (usually in English). It is a list of Section and of Key name with its Value,
  ;
  ; With some special Keywords for the Section:
  ;   "_SECTION_" will indicate a new Section in the datasection, the second value is the Section name
  ;   "_END_" will indicate the end of the language list (as there is no fixed number)
  ;
  ; Note: The Section and Key name are case insensitive to make live easier :)
  
  DefaultLang:
  ; =========================================================================
  Data.s "_SECTION_",                             "Interface"
  ; =========================================================================
  Data.s "Button",                                "My Button"

And In Français.lang:

Code: Select all

[INTERFACE]
BUTTON = Mon Bouton

There are different prepared sections at the bottom : Interface, Tooltip, Menu, ToolBar, StatusBar, Message.
To be used according to usage, interface text, menu options, MessageRequester text...
To add a new text to translate, enter the key and the text in the default language.


Example For a warning message, ajouter dans la section messsage

Code: Select all

Data.s "_SECTION_",                             "Message"
  ; =========================================================================
  Data.s "Warn0001",                            "Warning!"
  Data.s "Warn0002",                            "Warning, bla bla bla"

In "French.lang", it'll be:

Code: Select all

; Language File
[Info]
Program = Demo_MultiLangue.exe
Version = 1.00

[INTERFACE]
BUTTON = Mon Bouton

[MESSAGE]
WARN0001 = Avertissement!
WARN0002 = Avertissement, bla bla bla

Then in the source, you just need to use the macro GetMessageLang("Warn0001"), GetMessageLang("Warn0002")to get the translated message.
Ex: MessageRequester(GetMessageLang("Warn0001"), GetMessageLang("Warn0002"), #PB_MessageRequester_Ok|#PB_MessageRequester_Warning)


Now, how to use it in your app if, for example, you want to use a comboBoxGadget(#ComBoLang,...) to select the language between English, French and German:
The English, the default Language will be written in the DataSection (label DefaultLang:)
To create the 2 language files, French and German, use

Code: Select all

LangLoadDefault()         ; Load the default language (usually English)
LangSave("French.lang")   ; Save the loaded language in Lang\French.lang 
LangSave("German.lang")   ; Save the loaded language in Lang\German.lang

Once language file created, comment on this part.
Then to load the right language in your app, you can use something like:

Code: Select all

Select GetGadgetText(#ComBoLang)
  Case "English"
    LangLoadDefault()         ; Load the default language (usually English)
  Case "French"
    LangSave("French.lang")   ; (Optional) Update French.lang with possible new keys from the default language
    LangLoad("French.lang")   ; Load the French language from Lang\French.lang
  Case "German"
    LangSave("German.lang")   ; (Optional) Update German.lang with possible new keys from the default language
    LangLoad("German.lang")   ; Load the German language from Lang\German.lang
  Default
    LangLoadDefault()         ; Load the default language (usually English)
EndSelect

All translated texts will be loaded into the Map
All you have to do now, is use the macros with the right key to obtain the translated text GetInterfaceLang("MyButtonName"), GetMessageLang("Info0001"),...


An other way, without the language files is to create the different languages directly in the DataSection by copying the label DefaultLang: to French: and German:
Then you have to adapt MyApp_Lang.pb code to use the different labels by changing the procedure LangLoadDefault() ex:

Code: Select all

Procedure LangLoadDefault(Lang$)
  Protected Section.s = "COMMON", Keyname.s, Value.s
  ClearMap(Lang())
  Select Lang$
    Case "English"
      Restore DefaultLang:   ; Restore the default language (usually English)
    Case "French"
      Restore French:        ; Restore the French language
    Case "German"
      Restore German:        ; Restore the German language
    Default
      Restore DefaultLang:   ; Restore the default language (usually English)
  EndSelect
......

To load the choosen language at the beginning of the program, call: LangLoadDefault(GetGadgetText(#ComBoLang))
And then, use the macros GetIxxxLang("Key") to get the translated texts.

I hope it's a bit clearer, come back if needed

[williamvanhoecke]

Chris,
Thank you, all is clear,
Exept I was struggeling on how to use it on a multi-form project.
I have to set the 'Add Multi language support' on every form to update the datasections and language files
But since every form has another name the xxxxx_lang.pb is included every time making variables and macros and subroutines being repeated ?
I can remove the Xinclude xxxxx_lang.pb on all the windos exept the first (main), but on every change this line is back

Maybe Xinclude xxxxx_lang.pb should only be included if Compiler IsMainFile flag is set ?

Thanks

[ChrisR]

I see you've got it right
I agree that it's not really ideal for multi-form applications.
But as IceDesign doesn't manage multi-windows as it could be done through a project, I don't know what I could do?
Maybe it could be done as a separate tool to collect all the Data from multiple xxxxx_lang and assemble them into a single MultiLangue.pb file. To avoid having to do it by hand.

Indeed, it would be good to add CompilerIf #PB_Compiler_IsMainFile : Xinclude xxxxx_lang.pb : CompilerEndIf, it should help a little.

[dibor]

Hello ChrisR.
Do U plane to make version for Mac?

Thank U

[Mindphazer]

ChrisR will answer much better than me, but IceDesign uses a lot of Windows API, and as far as I know ChrisR doesn't own a Mac....

[ChrisR]

Yes, exactly There is no way.

However, an interface created on Windows should be able to work on Mac or Linux.
As long as you don't use constants starting with _# (ex for Spin: _#ES_Number) and settings options with an *, for Windows only.

[dibor]

Understood.

[ChrisR]

IceDesign has been updated in version 1.9.5

• Added explanations with examples to Multi-Language, in Main and DataSection, to better understand how it (xxxx_Lang.pb) works and adapt it to suit your needs.

• Added some keyboard shortcuts:
  Ctrl+L = Align Left, Ctrl+T = Align Top, Ctrl+R = Align_Right, Ctrl+B = Align_Bottom
  Ctrl+W = Make Same Width, Ctrl+H = Make Same Height, Ctrl+S = Make Same Size

• Add ObjectTheme module (Windows only) as a "better" replacement for ObjectColor and IceButtons.
  ObjectTheme will add and apply a theme color for All Windows and Gadgets,
  and for All possible color attributes (BackColor, FrontColor, TitleBackColor,...) for each of them.
  All gadgets will still work in the same way as PureBasic Gadget, including SetGadgetColor().
  It should be much more powerful, with the ability to define all possible theme colors or let ObjectTheme set them automatically for you.

Short little demo:

[williamvanhoecke]

Hi ChrisR
Would it be possible in next release, to put the

Structure GadgetImages
Image.i
PressedImage.i
Width.i
Height.i
EndStructure

and

Procedure ResizeGadgetImage(Gadget, OriginalImage, OriginalPressedImage = #PB_Ignore)
...
EndProcedure


between the CompilerIf (#PB_Compiler_IsMainFile) ..... CompilerEndIf

That would make a multiwindow design much easier.

[ChrisR]

Yes, I agree, I updated on Gumroad and Github.
To add the "CompilerIf #PB_Compiler_IsMainFile : CompilerEndIf", Enable "Add Compiler IsMainFile" option in settings.
Not a big change, I kept the same version number 1.9.5.

[ChrisR]

IceDesign has been updated in version 1.9.6

• Add Compiler IsMainFile option for Structure GadgetImages and Procedure ResizeGadgetImage for multi-window projects

• For multi-language support you can use now escape characters in key values
  Possible escape chars: \n (#LF$), \r (#CRLF$), \t (#TAB$), \' (#DQUOTE$) And \\ (\ = BackSlash)

• A new small tool ConcatMultiLang to Concatenate Multiple "DefaultLang" Language Files (*lang.pb)
  Drag'n drop or Add your Language Files (lang.pb) then concatenate these files and save as a new complete language file.
  It should be useful for multi-window projects.