Custom GUI

[Geniis]

this is a pretty sweet GUI. I really like it and it works pretty good. But i theres a small bug i noticed with one of your buttons.
Here is the code:

Turing:

import LGUI in "E:\\Turing\\LGUI\\LGUI.tu" var g : ^LGUI new LGUI, g var EXIT := false proc END ()     EXIT := true end END View.Set("offscreenonly") LGUI (g).ButtonProp (1, "Style:XPs, Text:+") LGUI (g).ButtonProp (2, "Style:XPs, Text:-") LGUI (g).ButtonProp (3, "Style:XPs, Text:+") LGUI (g).ButtonProp (4, "Style:XPs, Text:-") LGUI (g).ButtonProp (5, "Style:XPs, Text:+") LGUI (g).ButtonProp (6, "Style:XPs, Text:-") LGUI (g).ButtonProp (7, "Style:XPs, Text:+") LGUI (g).ButtonProp (8, "Style:XPs, Text:-") LGUI (g).ButtonProp (9, "Style:XPs, Text:+") LGUI (g).ButtonProp (10, "Style:XPs, Text:-") LGUI (g).ButtonProp (11, "Style:XPs, Text:Finished") loop     LGUI (g).DrawButton (1, "BL", 150, 300, 20, 20, proc)     LGUI (g).DrawButton (2, "BL", 200, 300, 20, 20, proc)     LGUI (g).DrawButton (3, "BL", 150, 260, 20, 20, proc)     LGUI (g).DrawButton (4, "BL", 200, 260, 20, 20, proc)     LGUI (g).DrawButton (5, "BL", 150, 220, 20, 20, proc)     LGUI (g).DrawButton (6, "BL", 200, 220, 20, 20, proc)     LGUI (g).DrawButton (7, "BL", 150, 180, 20, 20, proc)     LGUI (g).DrawButton (8, "BL", 200, 180, 20, 20, proc)     LGUI (g).DrawButton (9, "BL", 150, 140, 20, 20, proc)     LGUI (g).DrawButton (10, "BL", 200, 140, 20, 20, proc)     LGUI (g).DrawButton (11, "BL", 50, 100, 80, 20, END)     exit when EXIT     View.Update end loop

Where it says proc i had some procedures...
anyways the thing was when i pressed the button a couple times the text in the button would move about three spaces to the right and about one space down.
just thought i should mention it.

Oh and as a suggestion, dont know if youve thought of it yet but you should make a way so that if you create a button or an input box and you put it in one of those moveable widows, it moves with the window when the user moves it. I think it would be cool.

[SNIPERDUDE]

Geniis @ November 21st 2008 wrote:

this is a pretty sweet GUI. I really like it and it works pretty good. But i theres a small bug i noticed with one of your buttons.
Here is the code:

Turing:

import LGUI in "E:\\Turing\\LGUI\\LGUI.tu" var g : ^LGUI new LGUI, g var EXIT := false proc END ()     EXIT := true end END View.Set("offscreenonly") LGUI (g).ButtonProp (1, "Style:XPs, Text:+") LGUI (g).ButtonProp (2, "Style:XPs, Text:-") LGUI (g).ButtonProp (3, "Style:XPs, Text:+") LGUI (g).ButtonProp (4, "Style:XPs, Text:-") LGUI (g).ButtonProp (5, "Style:XPs, Text:+") LGUI (g).ButtonProp (6, "Style:XPs, Text:-") LGUI (g).ButtonProp (7, "Style:XPs, Text:+") LGUI (g).ButtonProp (8, "Style:XPs, Text:-") LGUI (g).ButtonProp (9, "Style:XPs, Text:+") LGUI (g).ButtonProp (10, "Style:XPs, Text:-") LGUI (g).ButtonProp (11, "Style:XPs, Text:Finished") loop     LGUI (g).DrawButton (1, "BL", 150, 300, 20, 20, proc)     LGUI (g).DrawButton (2, "BL", 200, 300, 20, 20, proc)     LGUI (g).DrawButton (3, "BL", 150, 260, 20, 20, proc)     LGUI (g).DrawButton (4, "BL", 200, 260, 20, 20, proc)     LGUI (g).DrawButton (5, "BL", 150, 220, 20, 20, proc)     LGUI (g).DrawButton (6, "BL", 200, 220, 20, 20, proc)     LGUI (g).DrawButton (7, "BL", 150, 180, 20, 20, proc)     LGUI (g).DrawButton (8, "BL", 200, 180, 20, 20, proc)     LGUI (g).DrawButton (9, "BL", 150, 140, 20, 20, proc)     LGUI (g).DrawButton (10, "BL", 200, 140, 20, 20, proc)     LGUI (g).DrawButton (11, "BL", 50, 100, 80, 20, END)     exit when EXIT     View.Update end loop

Where it says proc i had some procedures...
anyways the thing was when i pressed the button a couple times the text in the button would move about three spaces to the right and about one space down.
just thought i should mention it.

Oh and as a suggestion, dont know if youve thought of it yet but you should make a way so that if you create a button or an input box and you put it in one of those moveable widows, it moves with the window when the user moves it. I think it would be cool.

I just edited you code slightly so it can run (just to check). After doing so, I still haven't gotten that error.

Turing:

var EXIT := false proc END ()     EXIT := true end END proc END2 () end END2 View.Set("offscreenonly") LGUI (g).ButtonProp (1, "Style:XPs, Text:+") LGUI (g).ButtonProp (2, "Style:XPs, Text:-") LGUI (g).ButtonProp (3, "Style:XPs, Text:+") LGUI (g).ButtonProp (4, "Style:XPs, Text:-") LGUI (g).ButtonProp (5, "Style:XPs, Text:+") LGUI (g).ButtonProp (6, "Style:XPs, Text:-") LGUI (g).ButtonProp (7, "Style:XPs, Text:+") LGUI (g).ButtonProp (8, "Style:XPs, Text:-") LGUI (g).ButtonProp (9, "Style:XPs, Text:+") LGUI (g).ButtonProp (10, "Style:XPs, Text:-") LGUI (g).ButtonProp (11, "Style:XPs, Text:Finished") loop     LGUI (g).DrawButton (1, "BL", 150, 300, 20, 20, END2)     LGUI (g).DrawButton (2, "BL", 200, 300, 20, 20, END2)     LGUI (g).DrawButton (3, "BL", 150, 260, 20, 20, END2)     LGUI (g).DrawButton (4, "BL", 200, 260, 20, 20, END2)     LGUI (g).DrawButton (5, "BL", 150, 220, 20, 20, END2)     LGUI (g).DrawButton (6, "BL", 200, 220, 20, 20, END2)     LGUI (g).DrawButton (7, "BL", 150, 180, 20, 20, END2)     LGUI (g).DrawButton (8, "BL", 200, 180, 20, 20, END2)     LGUI (g).DrawButton (9, "BL", 150, 140, 20, 20, END2)     LGUI (g).DrawButton (10, "BL", 200, 140, 20, 20, END2)     LGUI (g).DrawButton (11, "BL", 50, 100, 80, 20, END)     exit when EXIT     View.Update end loop

As for making it so buttons can move with the dragging of Frames (I have come across this before), I could ealsily achieve this by creating an internal X and Y co-ordinate system like I did for the frames (when you call the draw frame proc in your code, it has it's own internal co-ordinates as well to make the dragging possible). I would also have to create a communications procedure for sending and receiving that variable (so you can call a proc in your code to put the internal co-ordinates what you wish (including a 'flush', a reset), as well as a proc to tell you what the internal co-ordinates are at). Something to work on for sure, because you want your frames to be in sync with your other objects in that frame for sure.

[Geniis]

Hun... maybee i did somthing wrong then . Ill check that out.
maybee i accidentally changed sumthing in the buttonClass.t file or sumthing
(i went lookin around in the module cause i was interested in seeing how you
did it lol)

[SNIPERDUDE]

Lol, I imagine one would be interested. To make the button 'AI' if you will, I tried comparing it to a real button; so you can hold down the button without it running the proc, but as soon as you let go (whilst the mouse is still over the button) it will execute. For the running the procedure bit (how to call a specific procedure when executed) I looked at Turing's own GUI on how they did that.

Now to go work on that button and text box internal co-ordinates system. Then fix up Window Icons. If you guys get any ideas, let me know on this thread.


* EDIT *

Okay, so I updated it so you can track, set, and flush (reset) the internal co-ordinates for all objects - you can now move objects with the frame whilst dragging. I have also added and updated the frame icons feature, so you can now add your own icons to the frames (also has an auto-scaling feature). The only one that doesn't support icons is the 'EOD' style, it would just look too strange with it. Either way I'm going to release it later, when I have a more significant amount of updates. Before I do, if you have an idea you want included let me know as soon as possible.


* EDIT *

Progress report. Added two useful objects: checkboxes and radio buttons. Added proper fading drop shadows for frames. Added Messageboxes (as in VB). Working on adding a 'tooltip' for buttons (when you pause the mouse over the button a small box will show up displaying text) for each theme and with dropshadows for effects. Also working on so that inactive windows fade. Any other ideas welcome.


FUTURE UPDATES (for versions 2.*)

Many more styles
pop-up animations (when a frame is opened if there is any type of animation, ex: center-out)
active animations (always running animations for frames, ex: 'nudge', 'twitch' effect, etc)


Example EXE below - release will be later.

To exit the example programme just close the window frame (the one programmed in). Drop shadow example on the messagebox. Note messagebox automatically fades everything else out. Just click OK or Cancel to close the messagebox. The style shown is "MMJB", frame on Low transparency at 90%. Icon example shown. Radio Button example shown, they do not have any purpose. Windows are moveable (just click and drag like for any normal window frame), but the messagebox one isn't. Note the background is ROYGBIV counter-clockwise . Windows are not resizeable yet. Let me know if this gave you any sweet ideas.

[SNIPERDUDE]

Does editing the last post do anything for marking it as 'unread'? Sorry about the double-post.


* UPDATE *

I thought of something whist playing around the the feature where you can match and edit internal co-ordinates; I added a new feature in the properties menu for each object (button, text box, etc) called "Match:#". What this new property does is you enter a number with it for the index of any frame you've made, and your object will auto follow the frame for you - this includes not only following the co-ordinates, but also things like visible (if you close a window it will hide the stuff matched with it as well), and even focus (when a frame loses focus, it fades into the background a bit, as will anything matched with the frame). I hope to come up with even more ways to provide not only power and flexibility, but also user friendliness as well.

Once again all ideas, comments, and criticism welcome.

I will try to clean it up enough to post version 1.6 as soon as I can - this will prove to be a much anticipated release.
Due note that the time slowing down said date is also due to the fact that so many new articles have to be included in the help manual, so bear with me during this process. If anybody wished to help me create a more elaborate and descriptive Help manual (as a revision of the one to be released), please PM me and let me know.

Thank you!

[Geniis]

Very nice. I like the message box thing...pretty sweet. And its awesome to hear about this match thing, at school right now im using your GUI in my projects instead of the regular turing one and that could be helpfull lol.
Cant wait to get the update lol.

[SNIPERDUDE]

Haha, awesome to have a fan. I am just cleaning it up so it can be submitted before the day ends. I'm sure you will appreciate the new updates, and even as I've found the match feature is incredibly useful.

* EDIT *

Sorry about not getting it up tonight, all I have left is about 20 minuets of work to do on the manual left, but with work in the morn I'm retiring for the night. Should be up tomorrow evening - I'd say before 4pm. Cheers!

[SNIPERDUDE]

So here it is in all its glory (and confusion)...

I really messed up on the help file in that I really should come up with a new way of making a help file considering it's becoming overwhelming. I don't think everything was included either. Either way take a look at the new objects (Support/RadioButtonClass.t) (Support/CheckboxClass.t) (Support/MessageboxClass.t) (Support/ObjectProperties.t) and take a look through the help file anyways - don't use the links beacuse I didn't update them . So anyways if anybody want to submit a better help file, please do - I'm going to work on a new method for my help files, I have an idea.

Launch the example file and fiddle around with that for a while if you want - just to get an idea.
For the example file, just close the messagebox to continue, and when you see that frame play around with it to just see how it works (pressing space will make it appear again and center it in the screen, pressing anything else will end the programme, you can click and drag it around, you can click off of it and make it fade out, you can close it by pressing the X in the corner, the radio buttons do nothing at this point, just for show).

If you have questions just ask.

[SNIPERDUDE]

* IMPORTANT NOTICE *

I noticed that when going through the example file that the frame wasn't transparent although it should be. This was caused by a small error in the Frame Class file, where transparency was temporarily turned off for losing focus (since it has it's own transparency set for losing focus, it needed to be turned off so it doesn't spam resources or make it fade away too much). I have fixed this error, and you need to replace the FrameClass.t file in the support folder with this one, thank you.

[andrew.]

I am getting an error whenever I run the example program. It says that the picture couldn't be created and shows the FrameClass.t source code.

It points to line 273: var icq : int := Pic.Scale (icp, 16, 16)

[SNIPERDUDE]

What version of Turing?
I'll look at that piece of code.

[SNIPERDUDE]

Okay, got it. It is the line that draws the icon of your choice. Because it says in the example file the icon is "test.bmp", I forgot to include that in the package. Here you go - put it in the same directory as the example file.

[Homer_simpson]

wow man, very neat code, kudos, seems like u've put quite a bit of work into this, GJ

[SNIPERDUDE]

Thanks man.

I wanted a project that not only would test my skills, but also could be easily expanded to fit more. As a game would eventually suffer from overkill on graphics, I thought this would be most useful. I'm glad even a L33T Programmer found it good!

[andrew.]

Wow. Very nice. One question though, how exactly did you make the translucent windows? I know you can use RGB and change the value of each pixel but I am sure you didn't do that because it's waayyy faster.