ProGUI V3 Alpha 3 Ready for testing!

[Zach]

This is really impressive work. Way beyond me

[PrincieD]

This is really impressive work. Way beyond me

Thanks mate!

[PrincieD]

Got the various fill brush settings working now

https://www.progui.co.uk/downloads/BorderImgEditor.zip

P.S. Could you guys let me know what the rendering speed is like on window resizing please? It's starting to lag a bit on my decade old Alienware laptop's integrated GPU (the dedicated Nvidia 880m GPU died last year )

[❤x1]

It's superfast on my comp, but I'm rocking a RTX 3080 so it might not be representative.

[PrincieD]

It's superfast on my comp, but I'm rocking a RTX 3080 so it might not be representative.

Fantastic! thanks for that ❤x1 I appreciate it

Chris.

[electrochrisso]

It's superfast on my comp, but I'm rocking a RTX 3080 so it might not be representative.

It also runs superfast and silky smooth with no flickering on my basic old Thinkpad i5-8350U CPU / Intel® UHD Graphics 620.

[PrincieD]

It's superfast on my comp, but I'm rocking a RTX 3080 so it might not be representative.

It also runs superfast and silky smooth with no flickering on my basic old Thinkpad i5-8350U CPU / Intel® UHD Graphics 620.

That's great! Thanks electrochrisso!

Mine is an Intel(R) HD Graphics 4600 which was released in 2013 lol

[PrincieD]

New update! Border Img and mask slice editors now support zooming! This is done by scrolling the mouse wheel up and down over the editors - a double left click will also zoom back to 1x
The zoom is animated using a nice Transition_EaseInSine() function with all the layouts adjusting automatically.

The slice editor dashed edge lines are now animated when you hover / drag too!

Also new right click popup context menus for the editors and preview window where you can select the chequred background colour from either light or dark as well as context menu for the Scintilla control where you can copy the code.

Tooltips are also working for most controls too where applicable and some minor layout tweeks and adjustments.

https://www.youtube.com/watch?v=kz6yhsJMPUk
https://www.progui.co.uk/downloads/BorderImgEditor.zip

[PrincieD]

Latest version! I've made a few layout tweaks, including removing the 5 pixel window layout padding (I think it looks a bit sleeker and more screen real estate), increasing the size of the trackbar grippers (also removing the ticks) and centre aligining various widgets.

I've also fixed the slight window resizing lag I was encountering on my 11 year old GPU, this was due to some unnecessary #WM_PAINT messages being posted to the diverted legacy Win32 common controls which was causing a GDI / Direct2D (software to GPU upload) interop - which is slow. Window resizing should be even quicker now!

Fixed a couple of bugs too in the ProGUI V3 API, one was causing a rare crash.

Also added 2 new commands to the GFX API: DrawLine(x1.d, y1.d, x2.d, y2.d, Color.l, Opacity.f) and DrawLineFill(x1.d, y1.d, x2.d, y2.d, Brush) working both on Direct2D drivers and Cairo (default stroke inside with center and outside options - automatic DPI scaling as usual). So the GFX API is pretty much feature complete for the moment as an MVP - will be adding more advanced vector drawing commands but I think this is a good starting point (and you have all the primitives for most Widget rendering needs including Layers).

Alpha 2 of ProGUI V3 is a few days away now with complete source for the BorderImg Editor tool (just over 3,000 lines and not a manual "resize" callback in sight!) as a "Gold standard" example

https://www.progui.co.uk/downloads/BorderImgEditor.zip



Here's the code for the SliceEditor Zoom animation:

Code: Select all

Procedure eventHandler_SliceEditAnimateZoom(*widget.Widget, EventType, *eventData.PG_EventAnimate, *sliceEdit.SliceEdit)
    
    If *eventData\id = #Animation_Zoom
        
        *sliceEdit\zoom = Transition_EaseInSine(*eventData\currentTime, *sliceEdit\zoom, *sliceEdit\zoomTarget - *sliceEdit\zoom, *eventData\duration)
        
        If DoublesEqual(*sliceEdit\zoom, *sliceEdit\zoomTarget)
            *sliceEdit\zoom = *sliceEdit\zoomTarget
            StopAnimation(*widget, #Animation_Zoom)
        EndIf
        
        updateZoom(*sliceEdit)
        
    EndIf
    
EndProcedure

Procedure updateZoom(*sliceEdit.SliceEdit)
    
    If *sliceEdit\img
        width = ImgGetWidth(*sliceEdit\img)
        height = ImgGetHeight(*sliceEdit\img)
    Else
        width = ImgGetWidth(*sliceEdit\sliceEdit2\img)
        height = ImgGetHeight(*sliceEdit\sliceEdit2\img)
    EndIf
    
    If *sliceEdit\zoom <= 1
        *sliceEdit\zoom = 1
        ImgSetInterpolationMode(*sliceEdit\img, #PG_InterpolationMode_Linear)
    Else
        ImgSetInterpolationMode(*sliceEdit\img, #PG_InterpolationMode_Nearest)
    EndIf
    
    item = LayoutGetItemFromWidget(*sliceEdit\sliceEditor\sliceEditWidget)
    LayoutSetItemProperty(item, #PG_Layout_Item_IdealWidth, width * *sliceEdit\zoom)
    LayoutSetItemProperty(item, #PG_Layout_Item_IdealHeight, height * *sliceEdit\zoom)
    
    If *sliceEdit\sliceEdit2
        *sliceEdit\sliceEdit2\zoom = *sliceEdit\zoom
        *sliceEdit\sliceEdit2\zoomTarget = *sliceEdit\zoomTarget
        If *sliceEdit\zoom = 1
            ImgSetInterpolationMode(*sliceEdit\sliceEdit2\img, #PG_InterpolationMode_Linear)
        Else
            ImgSetInterpolationMode(*sliceEdit\sliceEdit2\img, #PG_InterpolationMode_Nearest)
        EndIf
        item = LayoutGetItemFromWidget(*sliceEdit\sliceEdit2\sliceEditor\sliceEditWidget)
        LayoutSetItemProperty(item, #PG_Layout_Item_IdealWidth, width * *sliceEdit\zoom)
        LayoutSetItemProperty(item, #PG_Layout_Item_IdealHeight, height * *sliceEdit\zoom)
    EndIf
    
EndProcedure

Oh I've also added a 'isContinue' bool to the StartAnimation() command so now: StartAnimation(Object, ID = #PG_Any, Duration = 0, FPS = #Null, isContinue.b = #False) which means if 'isContinue' is set to true and an animation that has already been started (and is currently animating) then the Duration is added to the exisiting animation - so some nice smooth transistion effects with the various animation 'Transition_xxx' commands is possible.

[PrincieD]

Hi guys, another quick update: The Alpha 2 API is currently at 290 commands from Alpha 1 at 138 and ProGUI V1.xx at just over 100. I've also created the following CreateWidget(x, y, width, height) default rendering mode when an AddEventHandler(widget, #PG_Event_Draw, @drawEventHandler()) hasn't been specified - allows for quick layout prototyping and a good visual indication (so the Widget is "Under Construction")

[Zach]

are you writing documentation as you go?

[skinkairewalker]

Will ProGui v2 have all the features of ProGui v1?
or at least can both work together on the same project?

[PrincieD]

are you writing documentation as you go?

No I'll start writing the docs closer to the beta release, I'm looking into some kind of AutoDocs though so that the source will actually contain the docs in comments next to the exported procedures - then the source is scanned and the Chm, HTML and PDF are generated from that. Or maybe dump the source into ChatGPT / Claude and get AI to write the grunt of it

Will ProGui v2 have all the features of ProGui v1?
or at least can both work together on the same project?

Probably not on the first beta but menus will be the first "pro" widget and then I'll be fleshing out the rest (this should be pretty quick with the core of V3 working nicely) for example a Toolbar will be pretty much a widget with a Flex layout. It should be possible to use the old ProGUI along side V3, I'll have to test!

[PrincieD]

ProGUI V3 Alpha 2 is ready for testing, see top of thread!

[PrincieD]

So for the next stage (Alpha 3, possibly Beta 1) is getting CreateBorder() working, this is so you can create borders programmatically (like CSS) which will us the BorderImg code under the hood and then adding Widget bitmap caching. Currently there is an Update rectangle that is maintained every frame which expands to cover any updated/redrawn Widget however rendering is still bottom to top so every Widget inside that update rectangle renders itself in it's entirety. Caching the widget as a bitmap allows for even quicker rendering when the size hasn't changed or content changed but also allows for efficient alpha masked borders and Widget alpha transparency. Then it's onto the skinning engine, which is the final piece of the puzzle - I'm thinking for Window skinning creating a "Window Title Bar" widget that is draggable (drags the whole window) then you have total control of how your App looks and functions (rather than going down the client / none client area route). Also Z ordering to Widgets so MDI type tool windows are easy to implement.