This is the first stage of the IMGui.
I've replaced the original graphics with those that look like the Guichan system :)
Known problems :
Core
* Eclipsing routine needs to be generalised
* Optimisations (especially faster searching of item ID's) - Currently it's not possible as ID's may not be provided in sequential order
* User functions need to be added
Window
* Can only activate a window by clicking on the title bar. This needs to be changed to any rectangular area
* Remove 2 colour functions as they are not used
* No minimise, maximise or close buttons Minimise, restore and close have been added. Code needs to be optimised
Buttons
Static Text
Check boxes
Radio Buttons
Sliders
* Graphic anomalies need to be fixed
Graphics
* Border needs to be placed around graphic
* Add code for mouse press
Progress Bar
* User API needs to be added
Border
* Text needs to be eclipsed to fit into require size (if needed)
* Borders text needs to be updated to use the ellipse function in THelpers
The following need to be added (they are the tricky ones) :
Listboxes (uses sliders) (started)
Drop-down boxes (uses Listboxes) (started)
Tabs
File menu (started)
Single line edit boxes
Multi-line edit boxes
Progress Bar
Imagelist
[attachment deleted by admin]
Looks very nice will download later when I'm back on the PC. Might even make some nice gfx unless they're generated =D
Great continuing work. 8)
Any chance of a an imagelist control, such as for list thumbnails and icons?
Might be an idea - I'll add it to the difficult to do list :)
Cool. For now, another suggestion, I think screenshots demos of different themes and styles would be inspirational, such as fonts as background styles, or iPhone interface clone. ;)
Looks very nice, will have a proper look tomorrow. :good:
In some ways this is an important update as it shows that an extended type can use the items from another extended type (list boxes uses scrollbars), combo/drop down boxes uses list boxes... These two routines draw the other used type in their own Draw function, and process them in Process - this keeps them out the main processing system for the window (which isn't accessible anyway), which would have caused problems if a listbox or combo box is destroyed.
I've also added minimise, restore and close icons (actually 3 buttons) and a system information area, the height of which is that used by the current font.
I've also got the start of listboxes, combo/drop down boxes and the file menu (the latter needs to be in another type to allow the background to be set for the complete window length).
It is at this point I find that all information regarding how to do scrolling and what is almost non-existant - there is very little information IM stuff anyway, but thats another story :)
Fortunately, I have found some code that may with scrolling...
[attachment deleted by admin]
Quote from: matchy on 2012-Jan-01
Cool. For now, another suggestion, I think screenshots demos of different themes and styles would be inspirational, such as fonts as background styles, or iPhone interface clone. ;)
Whilst it would be possible to skin everything, its not something I'll be implementing until its finished...
I achieved scrolling using VIEWPORTs.
I don't have an immediate mode GUI however, if that matters.
I'm not exactly sure what type of scrolling you are referring to.
My scrolling is like on the iPhone, where you 'flick' the screen and it scrolls down the 'page'.
It closely mimics iPhone's 'kinetic scrolling' where it slows down over time.
I draw the entire 'page' off screen, and position the viewport to show the required portion.
I'm sure this could be applied to list boxes too, as that pretty much is the same.
but if it is a mouse related move, wouldn´t it be better to be a ´straight´ move?
although I really enjoy photoshop´s smooth easy in-out scroll nowadays...
Slydog, using viewports sounds like it will work well for word lists and it's something I need to trial on other devices also. I have used tiles (screen.width x screen.width) because it breaks down the whole screen bmp, if that is a concern (to be tested).
Although my main problem in the past is trying to create a photo/carrousel list, where 100 images just cannot be drawn quickly initially. So I simulated the scroll and then prepare off-screen draw the second next image (one after the previous), which needs to come from somewhere, although there can be a slight delay (for loading and drawing) which stutters the scroll flow.
In other words for example and in regards to saving memory, what is the best method to scroll through 100 images quickly, without having to pre-draw 100 images on to a buffer?
The code may get more complicated, but if you use POLYVECTORs, and don't use VIEWPORTs, you could draw directly to the screen. If only a half of the top image is 'visible' then only draw the visible portion using polyvectors.
That way only the visible images are drawn, and only the visible portions of those images.
Keep your image list sprite ids in an array, and use code very similar to this:
Endless Horizontal Scrolling Code
http://www.glbasic.com/forum/index.php?topic=7474.msg62417#msg62417 (http://www.glbasic.com/forum/index.php?topic=7474.msg62417#msg62417)
This is for horizontal background scenery scrolling, but it only plots the visible portion of the background each frame.
This could be adapted to scroll vertically, and with a larger list, but it is hard coded now to only expect two images to be visible at one time.
VIEWPORT's are needed to restrict (usually) text to a defined area.
This update mainly updates the window display and processing side whilst I go through the working items to tidy them up a bit.
There are several important changes made to the window display. The drawing section for all the items is now in the drawing section of the window and the item processing part is done in the window processing part.
This was needed for several reasons : If a window is minimised there is not point in trying to draw and process anything. However, if a window is disabled, then the display is need but processing isn't.
Each window takes up 11 id's so that different parts of the window can be resized. The minimise/restore and close icons are always allocated even if they are not used as it would save time having to create or remove them.
[attachment deleted by admin]
Not sure if they were meant to be there but the window icons are missing in the demo. But otherwise it looks very good, this is evolving into something very interesting.
Haven't designed them yes so they are just squares
This is a quick test program showing horizontal & vertical bar values being displayed with static text boxes. Clicking on the button updates the progress bar.
And this example program looks like :
// --------------------------------- //
// Project: TestIMGui
// Start: Thursday, December 22, 2011
// IDE Version: 10.209
LOCAL imGui AS TIMGui_Base
LOCAL win1%,win2%,win3%,win4%,win5%,win6%,win7%,win8%,win9%,winA%,winB%,winC%
LOCAL itemID1%,itemID2%,itemID3%,itemID4%,itemID5%,itemID6%,itemID7%,itemID8%,itemID9%,itemIDA%,itemIDB%,itemIDC%,itemIDD%,itemIDE%
LOCAL horzPos%,vertPos%,buttText%,overText%,prog%
LOADSPRITE "Media/Untitled.png",0
imGui.Initialise()
win1%=imGui.CreateWindow("test",0,0,300,300,0,"Test Window 1",RGB(200,200,200),RGB(128,128,128),RGB(255,0,0),FLAGS_WINDOW_USECLOSEICON%+FLAGS_WINDOW_USEMINIMUSEICON%+FLAGS_WINDOW_USERESTOREICON%+FLAGS_WINDOW_SYSTEMAREA%)
itemID6%=imGui.CreateSlider(win1%,FALSE,0,0,80,RGB(128,128,128),100,0.0,0)
itemID7%=imGui.CreateSlider(win1%,TRUE,0,17,80,RGB(128,128,128),100,0.0,0)
itemID1%=imGui.CreateButton(win1%,32,32,32,32,0,"Example",RGB(200,200,200),RGB(128,128,128),FLAGS_TEXT_LEFTALIGN%)
imGui.CreateStaticText(win1%,40,100,0,"Slider Positions :",0,0)
horzPos%=imGui.CreateStaticText(win1%,0,116,0,"-/-",0,FLAGS_TEXT_LEFTALIGN%)
vertPos%=imGui.CreateStaticText(win1%,100,116,0,"-/-",0,FLAGS_TEXT_LEFTALIGN%)
buttText%=imGui.CreateStaticText(win1%,0,132,0,"-",100,FLAGS_TEXT_LEFTALIGN%)
overText%=imGui.CreateStaticText(win1%,0,160,0,"-",100,FLAGS_TEXT_LEFTALIGN%)
prog%=imGui.CreateProgress(win1%,0,200,0,0,RGB(255,0,0),0,FLAGS_PROGRESS_DISPLAYPERCENTAGE%)
imGui.SetSystemText(win1%,"This is a test")
SYSTEMPOINTER TRUE
WHILE TRUE
imGui.Process()
SHOWSCREEN
// Update horizontal values
imGui.SetStaticText(win1%,horzPos%,FORMAT$(2,2,imGui.GetSliderRailValue(win1%,itemID6%))+"/"+FORMAT$(2,2,imGui.GetSliderValue(win1%,itemID6%)))
imGui.SetStaticText(win1%,vertPos%,FORMAT$(2,2,imGui.GetSliderRailValue(win1%,itemID7%))+"/"+FORMAT$(2,2,imGui.GetSliderValue(win1%,itemID7%)))
IF imGui.IsButtonPressed(win1%,itemID1%)
imGui.SetStaticText(win1%,buttText%,"Button ID "+itemID1%+" is pressed")
imGui.Progress_StepIt(win1%,prog%)
ELSE
imGui.SetStaticText(win1%,buttText%,"Button ID "+itemID1%+" is not pressed")
ENDIF
imGui.SetStaticText(win1%,overText%,"But Focus : "+imGui.IsItemFocus(win1%,itemID1%)+" H Slider : "+imGui.IsItemFocus(win1%,itemID6%))
WEND
As you can see it should be easy enough to use :)
[attachment deleted by admin]
not bad!!
I like it!