Challenger GUI, part 2
Monkey Archive Forums/Monkey Projects/Challenger GUI, part 2
| ||
| Continued from here. Summary (more information on above thread): Challenger GUI - a simple yet powerful customisable gui system Flash Example: http://megaswf.com/serve/2337573 - (click 'edit' - 'Preferences' to change style and shadows) Mobile Example: http://megaswf.com/serve/2337255 Download latest release (1.1): http://megaswf.com/serve/2337967 You also need the FREE FontMachine module: http://www.jungleide.com/?page_id=515 |
| ||
| Flash Example: http://megaswf.com/serve/2349967 Latest Download: http://megaswf.com/serve/2367833  |
| ||
| Chris, I will need your name for the credits of the visual editor. (if you want to be in there, of course) |
| ||
| Oooo thanks, its Chris Challenger. About Firefox, I just changed an int to a float inside one of the DrawImageRect() commands. Weird. |
| ||
| Hey Chris have you thought about sticking this on GoogleCode or GitHub etc? |
| ||
| I will have a look into it, its the first time I've put up code for other people to use :) are there any benifits to this over using any generic file sharing site? |
| ||
| are there any benifits to this over using any generic file sharing site? Yes, version control system using Mercurial, as instance. And also, you can have a wiki about the project, etc. Additionally, it gets a bit of exposure, not sure it is something a Monkey project will benefir for, but I'm sure it won't hurt. Also, it makes it easier for other people to fork it and make their own versions if they want to. |
| ||
| Ok cool, I will see about this 2nite, thanks |
| ||
| ... Just for information: Challengergui will not work with Monkey V51 and probably not with versions below. |
| ||
| Oh ok, thanks Volkner, Ill just include a note in the install instructions to update monkey. |
| ||
| Coming Soon Listboxes Tooltips - (will be in the form CreateTooltip(Element:CHGUI, Text:String) ) You will be able to change the over time before a tooltip shows globally .OverTime Field (Returns the millisecs the mouse has been over a gui element) .DownTime Field (Returns the millisecs the mouse has been Down on a gui element) RemoveDropdownItem() RemoveListboxItem() |
| ||
| one thing that I added to my own GUI system is tables, like HTML tables. I have a table class which does nothing it simply holds a list of cell columns the cell_column class holds cells which hold gui elements the cell columns resize themselves to the widest gui element so the table acts very much like HTML tables. It means I never have to type in coordinates for gui elements, It took me a few hours to program and saved me more time typing in x and y coordinates and recompiling. Someone is making a visual editor so you might not need tables actually. the examples look good |
| ||
| I think if its just for positioning I'll skip tables, yeah Visionastral has nearly finished one by the sounds of it and ill be making annother one soon too. |
| ||
| I nearly finished a working/usable version, meaning it can be used for development. You could use it for visually building your own visual editor and make it a more advanced and good looking one ;) (than mine I mean) |
| ||
| Lol a visual builder to make a visual builder lol I might just do that. Looking forward to seeing urs. |
| ||
| nice package, congrats. If I could make some suggestions: - I didn't found an API to remove Controls or Items - numeric (or better: format) InputField - buttons with on/off state - Spin (or Plus/minus) Buttons to increase/decrease an numeric |
| ||
| about removing controls, I just make them invisible and then make "object=null" this isn't actually really deleting the object, but since monkey doesn't provide a way to directly delete objects, I don't think we could do it otherwise... (monkey apps should actively believe in the power of automatic garbage collection. Being 99% old school, I see it as an heresy, but we don't have the choice.) |
| ||
| All elements are also stored in arrays, (the only reason to declare them as global is to reference back to them). I wanted a way to get rid of them from the arrays. Making invisible works well for other things, but I want dropdowns and listbox to be mire dynamic :) (Realised I needed this when, On my visual editor you choose the style for your project from a dro down, the dropdown looks in a 'styles' folder and sets the contents as dropdownitems) |
| ||
| ok then, if you are using arrays, the best way is to recicle array elements. In my editor, the Widget[] array stores every single object you make and starts as a length of 1. Every time a new widget is created, the array is rezised up by 1. BUT, when you delete a widget, I just mark this array item as "empty". The next time a new widget is created, it will look for any "empty" marked array item and recicles it. The next thing to do (wich I don't do in the editor), is checking from time to time if there are empty elements in the array and reconstruct the array in order to keep only the used ones. I don't do this in the editor because I will be required to reorganize everything and I¡m pretty lazy right now ;) It's a memory leack, but checking the memory use of the app I didn't noticed it was an issue, and an average editor session should never make problems with that, since the array will only grow when all the empty elements are recicled. This is pretty much how windows manages the pagefile.sys, that's why you only really free up pagefile.sys size when you restart (when pagefile size is managed by the sistem) and that's why windows will never be the same after you allocate LOTS of memory until you restart. (usually pagefile become fragmented due to it's size and slows down the system) |
| ||
| @visionastral: Dynamic resize of arrays is usually a very bad design idea, as it consumes lots of resources and it is usually very slow as it has to copy the whole block of memory occupied by the array to create a new array and replace the original one. Dealing with lists in this area is usually a much better idea, as it is faster and plays nicer in the garbage collection. |
| ||
| Don't know about lists, never used them. Will have to take a look, thanks ziggy! :) Anyway, being slow to resize the array is not even noticed in the editor, since it only does it on creation of a new widget. But will look at lists nevertheless. |
| ||
| Its ok I have done it, this command is not designed to run in the main program loop, only to delete certain DropdownItems / ListboxItems on specific events. (I.e. If Button1.Clicked then RemoveDropdownItem(Item) (This is done by moving the elements after it back a place and resized the array -1) Im reluctant to mess up the array order as it displays DropdownItems in the order they are created. Anyway its working :) Ill be working on this alot tomorrow so will hopefully have an update out by the end of the day. I plan to update the keyboard as well (So the shift works like an Iphone and maybe skin some buttons) Also I want to add a double click option to the element(i.e. If MyLabel.DoubleClicked then ...) Got a few other ideas to do, thats just a taster ;) |
| ||
| @Joasia Removing items I think I will only do for Dropdowns and Listboxes, as there I think making the others invisible will be enough to cover most projects, as most gui don't change that dramatically where u need to delete much stuff when using it. I like the idea of being able to format a textbox, ill prob run with that as a seperate command I.e. RestrictTextfield(Letters=0,Numbers=1,Symbols=0) (That way I keep the simplicity of creating a basic one) What do you mean by on off state? You can make them inactive (greyed out and unusable) or invisible if that's what you mean? Thanks for the input :D |
| ||
| The visual editor is now generating monkey code! (and it works) :D Still a lot to do on the user side: selecting a filename, saving native project for reload in the editor... But it generates independent monkey code that can run alone! :D <- happy joe Anyway, I want to finish the behaviour editor too for wiring basic GUI events like pushing button1 opens window2 etc... By the way, Chris, I really love how the screen moves when the keyboard appears! very iOS like! :) |
| ||
| Lol cheers, I wanted it to 'slide' not just 'move'! I want to modify that at a later date because at the moment it moves to a set position (100,100) I want it to move just out of the way of the keyboard. But yeah thanks lol |
| ||
| chris, I mean a checkbox like behavior. So you can Push in a button with one click, and release it with another. I like your RestrictTextField idea, maybe you are able to lock your custom keyboard to the specific page (or even better, use a calculator-like keyboard for numerics... ;-) nice work! |
| ||
| Update 1.3 [Changes] Added DoubleClick Added Listbox and ListboxItems Added Tooltips Added RemoveDropdownItem() Added RemoveListboxItem() Added .OverTime Added .DownTime Added stay capital on onscreen keyboard if shift is double clicked Added ability to hold delete on onscreen keyboard Added Label over / down / clicking Removed Label Center X and Y option |
| ||
| Visual Builder Ok so here is the start of my visual builder, the only thing that works is the Creating and dragging atm. The idea is you click on an element to select it and then whatever you click to create is created inside the selected element... For example Click on 'Create' - 'Window' (This creates window1) Click on Window1 (to select it) Click on 'Create' - 'Tab' (Creates a tab1 in the selected Window1) Click on Tab1 (to select it) Click on 'Create' - 'Button' (This creates a Button inside Tab1) Click on an empty space to revert to have no selected Element Same procedure to create Menus, SubMenus, SubSubMenus etc etc http://megaswf.com/serve/2351425 (I will make the Create menu items inactive if you cant create an element type within the currently selected Item next, and also some sot of highlighted box to show the selected element) |
| ||
| Minor request: same as menu items; dropdown lists should toggle open/closed when clicked. It would be nice not to have to click away from the list to close it back up. |
| ||
| I second the request of c.k. Not a big deal thought, but would be nice. Chris, should I change the name of my visual builder? Right now it's named "Visual Challenger GUI Builder" in honor of your GUI module. But since you have adopted a similar (generic) name, I think I should change the name in order to distinguish each other. What do you think? (I'm very close to final release now ;) ) |
| ||
| This is so impressive. Thanks for all of the hard work. The Monkey community is amazing! |
| ||
| Mmmmm.... I'm having a bug with the methods of an ImageButton. Basically, if I try to access the .Clicked or .Down or .W or .H properties it throws a Memory access violation. EDIT: Ok, found the bug: in the CreateImageButton function (line 456) you forgot to write the last line: Return N |
| ||
| @C.k Dropdown code modified to do this, will update soon after ive ironed out a few more niggles. @VisionAstral Nah its ok, you can keep you name (you were there first lol) Ill just call mine 'visual builder' as it will only be promoted as part of the module so the generic name wont matter. Lol I noticed that bug this morning, silly I missed that, and for so long! Im really looking forward to seeing yours, hurry up lol. @WhyOWhy Thanks :) lol |
| ||
| I'M HURRYING! xD |
| ||
| Ok, time for a first beta release! :-) (I just fixed an issue with the win beta, redownload it!) Visual Challenger GUI Builder 0.9 beta: Windows: http://dl.dropbox.com/u/73405767/WIN_VisualChallenger09beta.zip MACOS X: http://dl.dropbox.com/u/73405767/MAC_VisualChallenger09beta.zip  NOTE: the default path for saving/loading/exporting is the root directory (C:/ in windows and MACINTOSH HDD/ in mac) This version has the behaviour features disabled because I'm still working on it, but it is still functional and (hopefully) stable. With it you can design a GUI, export a full monkey application that will run just out of the box (with according app.data folder) and save and load native Visual Challenger Builder projects: this way you can continue designing your project afterwards. Keep in mind the export option will only export the windows that are visible! Please BE SURE to READ THE HELP SECTION as the controls and workflow are explained in detail. I will make the final version compatible with the native projects saved with this 0.9 beta version, so you can start your project here and move it to the final version once released. FEATURES: - What you see is what you get, as it is made with the Challenger GUI ;-) - Two versions: normal and mobile (will generate acording code) - Unlimited windows and widgets. (make your full application at once) - Load/Save native projects - Export to monkey source code - Move and resize your widgets with the mouse - Multiple selections for moving, resizing and delete - Mass properties edition (select several widgets and change their properties together) - Copy paste widget properties ONLY (will NOT copy paste a widget, but only it's properties to several widgets of the same type. If you want to copy paste a widget, you will have to create a new one first and then paste the properties of the source widget.) - Lock widget to parent sides. (example: locking a widget to the right side will make it follow if you resize the parent window) - Auto center a widget inside it's parent or in the screen device - Move/resize widgets with keyboard for acuracy - Keyboard Shortcuts for everything - Fast selections (press SPACE and you select everything you pass over) LIMITATIONS: You can't make a window with a tab inside another tab. I don't know why but it causes memory overflows in the editor! (you can try, but it will not allow you to) There is no file explorer, you will have to type manually the path and name of the files to load/save/export. TO DO: * you will see a lot of things are disabled. That's the things related to the behaviour of the widget (open/close/active/disable any other item for example) * Image buttons are limited to the default BUTTON.PNG image. I will have to make selector. * the editor has a 8x8 grid activated that will be customizable, but by now it is fixed. (the preferences menu is not yet done) * Skin and fonts will be selected in the preferences, along with the default paths for load/save and export. * Export code to launch the CHGUI visual keyboard when needed. * Include the CHGUI module with the generated monkey source. This way you don't have to have CHGUI installed in the monkey modules folder and makes the code fully self-suficient. Enjoy :-) |
| ||
| no Mac target? =( if you don't mind to give away your source code, I could compile for you. |
| ||
| Great work dude, I like the creation method, where you click where you want to create things. I was running in circles trying to decide the best way to set the parents :) Mass properties edition (select several widgets and change their properties together) I am not looking forward to coding this on mine lol I will upload mine later for you to see, Its great how different they are Also an update to the module |
| ||
| @joasia36: I never compiled native mac code, only used it for ios :P I will check this out later. (as I'm actually programming on a macbook pro running windows! xD ) @chris: The fact is, I have to do a very large gui application so I built up something who can actually manage it from the ground up instead of doing a single window editor(wich would be the first choice) BTW, I'm not releasing the code right now, but I will do on final release. |
| ||
| mmmm... trying to compile in macos but it raises an error with the fontmachine module. I suppose no one tried to compile the fontmachine module in macos before. Will have to talk with Ziggy about it. The error is: Compile Error Duplicate method attribute. in fontinterface.monkey line: Method DrawText(text:String, x#,y#) Abstract |
| ||
| Update 1.4 http://megaswf.com/serve/2367833 Many things fixed Textfield format added CHGUI_Width and CHGUI_Height added to compliment the dragscroll Please also have a look at my Visual Builder: http://megaswf.com/serve/2367854 The creation works and setting the properties (Apart from Changeparent and delete), and the view options work now. This is a work in progress. The idea is to use the create menu to place objects inside the selected item - If no item is selected it will place them on the Background Bear in mind this is made to be a fullscreen program not a small web insert :) |
| ||
| @visionastral plain challangergui with fontmachine code compiles fine under lion 10.7.3 with Xcode 4.3.2. just be sure to use monkey 56b instead of 56. |
| ||
| Like the builder.......and the fact that you are continually updating and improving the gui lib. Hope the builder will be in a usable (that is able to generate code) soon. Thanks. Matthew |
| ||
| @Matthew Thanks bud, the export code is nearly done :) it exports a working monkey file, just need to do a nice (Open/Save/Export) window. Still a bit to do on the other stuff thou. Main gui lib should be nearly finished by now, just to fix any ugs people find or any more requests really. |
| ||
| I broke the editor, I was able to size a button too small which makes it unclickable. Im sure you know about this though. Editor looks like its coming along nicely, looking forward to playing around with this for future projects! |
| ||
| If you are using my editor, just press TAB and it will cycle through all the widgets, reselect your button and resize it with cursor keys or in the properties editor. |
| ||
| trying to compile in macos but it raises an error with the fontmachine module. I suppose no one tried to compile the fontmachine module in macos before. Will have to talk with Ziggy about it I'm prety sure this was fixed a lot of time ago, and latest version does not have this issue. Just get latest version of the FontMachine module and it should work. You can get latest version here: http://www.jungleide.com/?page_id=515 |
| ||
| to Ziggy: I'll check this out tomorrow, but I'm pretty sure I downloaded the latest version because I had to for the CHGUI module to work. (see my firsts posts in the original thread) |
| ||
| Ok, my bad. It wasn't the module version nor monkey version but the fact I was trying to compile into the NTFS partition instead of the mac hdd, wich xcode and monkey didn't liked AT ALL. As far as I know, monkey was having a hard time looking sources. I just made a copy of the monkey folder and the sources folder in the mac hdd and now it compile fine. Now I'm compiling for MAC, but have a little trouble with path names, so I want to test it well before releasing it. By the way, the 0.9 beta for windows is offline because I found a bug when loading native projects raising an error when it shouldn't be any. MAC and WIN versions will be up today (hopefully). - EDIT - both mac and win versions online now :-) |
| ||
| If you are using my editor, just press TAB and it will cycle through all the widgets, reselect your button and resize it with cursor keys or in the properties editor. By the way, using the TAB KEY you will cycle through all the widgets of the selected window or visible tab. If none of the widgets inside a given tab can be clicked (because they are inactive, too small to be clicked or they are labels) you will have to create a new clickable widget inside this tab, select it, and then use TAB KEY to select the unclickable widgets. |
| ||
| Chris, I really love the looks of your editor! :-) Mine is really "developper-oriented" (aka:"doesn't care if it's ugly as long as it works") ;-) If I had known you would be making it so quickly, I wouldn't have made mine in the first place! I don't know when my editor will reach final release because I have other priorities right now. (I just made it because I REALLY needed it RIGHT NOW, do you remember? ;-) ) So I suppose I will focus back on my original project instead. Anyway, thank you very much for your GUI module, I will be using it A LOT. :-) |
| ||
| No worries mate, glad to be able to contribute something back to the forums. Thank you for your support, ideas and everything else :) |
| ||
 This is the export window, which all works, you doubleclick on the folders in the listbox and it changes the path and the listbox contents :) |
| ||
| Hey Chris, just to let you know ChallengerGUI now runs on MonkeyMax :) I did find one issue with the E_Skinning example though, it crashes with "Array index out of range" error in GLFW and fails to compile in HTML5 TRANS FAILED: Unable to load image file E_Skinning.data/mistral_P_1.png... |
| ||
| Nice one, great module monkeymax, keep meaning to leave some love on your topic. Will have a look at that, if everything else runs hopefully its just a corrupted image file or smit. Cheers bud, great news :) |
| ||
| On that same token, I just got it running on the python target :D |
| ||
| Great news :) I can confirm that it was just a corrupted image (zipping it must have messed it up somehow) I remade the font image and works fine now. Plan is to have a module update and a full demo release of the editor out by Sat night :) |
| ||
| Topic continued Here |
   |