G4P v3.5 - new version available

quark

I have just released G4P v3.5 which can be downloaded here or you can wait for the PDE to detect the new version and install it then.

[Compatible with GUI Builder v2.5]

So what's new?

New control for entering password (GPassword)

GGroup objects allow controls to be grouped together for common tasks e.g. enabling, visibility, transparency and fading. Group actions can executed immediately or after a user defined delay.

GTextArea - addStyle(...) methods added to set the text style of part or all of a display line.

GTextArea - insertText(...) methods added to insert text at a specified display line number/character position or at the current caret position.

GTextArea - getCaretPos(...) methods added to retrieve the current caret position.

Support for displaying UTF8 characters added to GTextField and GTextArea controls

GDropList - it is now possible to remove, insert and add items to the control at runtime.

GLabel, GButtom, GOption and GCheckbox - new method setHeightToFit() to change the controls height so it just surrounds the text and icon.

Improved text rendering for all controls.

Some other things to be aware of -

GTextField & GTextArea - the setDefaultText method has been deprecated in favour of the setPromptText to make its purpose clearer.

GImageToggleButton - the stateValue methods have been deprecated in favour of setState(...) and getState() methods.

auris

Unrelated, but how can I create a color scheme? I found this post https://code.google.com/p/g4p-gui-builder/issues/detail?id=10#makechanges but the link is broken

quark

It is possible to create your own colour scheme (but it is fiddly to get right)

1) In your sketch folder create a new folder called data (if it does not already exist).

2) In your Processing folder you will find a folder called libraries. In this folder locate the file default_gui_palette.png file in the folder G4P > src > data then copy it to the data folder from step 1

3) Rename the copy to user_gui_palette.png

4) Open the image from step 3 (see below) each horizontal row represents a colour scheme. The first 8 (rows 0-7 inclusive) are the schemes provided by G4P.

5) Once you have edited a row save it with the same filename (do not change the image type from png)

6) Assuming that you used the last row (15) then you have two options

// To set the global colour scheme use 
G4P.setGlobalColorScheme(15);
// before creating any controls.

// To set the scheme for a particular control use
control.setLocalColorScheme(15);

If you create a nice scheme then let me know and if I like it I will include it as part of the default colour scheme in future versions of the library. Credit will be given to the creator in the source code documentation. :D

It would nice to have a gray-scale scheme ;)

auris

Gray-scale was exactly what I was looking for. But I hoped for a more code based approach. I may be missing something, but I can't see any methods to set colors of individual elements, such as textArea.setBackgroundColor = colour (0, 255,0). E.g. how could I set the text color?

quark

but I can't see any methods to set colors of individual elements, such as textArea.setBackgroundColor = colour (0, 255,0)

That's because there aren't any.

how could I set the text color?

You can't.

When I created G4P I used the image based approach for managing colors for several reasons.

1) It took the pressure off the user to provide a consistent look and feel to the GUI

2) It made the management of multiple colour schemes easy.

3) The user can quickly and easily select the colour scheme for a control.

4) It simplifies the color usage API considerably.

5) An API that enables the user to modify every element of every type of control would need many, many methods and the user would have to make many method calls to change the colour scheme for just one control.

I know there is more scope for improving G4P in this area but I will not be moving towards a system where the colour of individual elements of a control can be changed programatically. :)

GoToLoop

An API that enables the user to modify every element of every type of control would need many, many methods...

Well, declare those fields public or at least protected! :ar!

auris

The way I am used to in Obj-c, in particular iOS, is that a most UI elements are subclasses of UIView class, which implements (set)BackgroundColor method, so no need to write a new implementation for each subclass. You may have your own reasons for not doing that, but I find the "schemes" approach rather inflexible. Don't take me wrong, you've done an awesome job on the library.

quark

Well, declare those fields public or at least protected!

G4P doesn't use attributes to hold colours for individual elements of a control, rather it uses an array to hold a palette of colours which is used when the control is drawn. So your statement does not apply here. [-X

Having said that

In G4P none of the classes used for controls are declared final and nearly all non-public methods and attributes are declared protected so any competent OO programmer can create their own classes that inherit from the library classes. This has been done several times before, either to 'override' buggy methods or provide new controls, some of which get incorporated into the library.

I don't like using public access unless there is a very good reason. Public access means you can't validate what the user does and can lead to inconsistent behaviour / logical errors in the software.

quark

@auris G4P is based on an inheritance hierarchy so what you say is possible and will reduce the number of methods needed. The approach I took seemed right for Processing users, many of who would be at sea with objective-C ;)) . I am not infallible so I don't take any offense from constructive criticism - keep it coming. :D

j_m_l

could you describe where each color is used?

Empirically looking at a button - I would say (counting from 0) that color #2 is the text color, color #3 is the outline, color #4 is the background of the button, color #5 ??, color #6 is the background when you mouse over, and color #14 seems to be the background when you mouse click.. what are all the others? would you have a description somewhere?

quark

The button only uses the colours 2, 3, 4, 6 and 14

Different controls use different colours, unfortunately there is no list the only solution is to look at the source code. Each class has a method called updateBuffer() which is used to draw the control.

The colour schemes sort of evolved so there are a lot of magic numbers (0-15) used and I know that this is an area that needs tidying up and I will probably do that before the next release.

j_m_l

thanks - good enough for my exploration.

Mino32

Hi guys I hope you enjoy this "grey" scale :)

I like it, and I want to share it with you :D

quark

Thanks for that I will try it out.