Page 1 of 1

[solved] ImageGadget - SetGadget State Flicker

Posted: Tue Aug 05, 2014 11:03 pm
by IdeasVacuum
The snippet below shows basically what I'm trying to do, and the flicker issue caused by an ImageGadget() update.

Code: Select all

Enumeration
#Win
#Img
#ImageGdt
#Cntr
#BtnBox
#BtnExit
EndEnumeration

Global igTrans  = RGBA(128,128,000,000) ;Transparent
Global igOpaque = RGBA(128,128,000,255)

Procedure Win()
;--------------

Protected  iExit.i = #False
Protected iFlags.i = #PB_Container_BorderLess | #PB_Container_Flat

               If OpenWindow(#Win, 0, 0, 800, 600, "", #PB_Window_ScreenCentered)

                                  SetWindowLongPtr_(WindowID(#Win), #GWL_EXSTYLE, #WS_EX_LAYERED)
                        SetLayeredWindowAttributes_(WindowID(#Win), igTrans, 0, #LWA_COLORKEY)

                             CreateImage(#Img, 800, 550, 32, igOpaque)
                             ImageGadget(#ImageGdt,  0, 50, 800, 550, ImageID(#Img))

                         ContainerGadget(#Cntr,      0,  0, 800,  50, iFlags)
                            ButtonGadget(#BtnBox,    2,  2, 100,  26, "Draw Boxes")
                            ButtonGadget(#BtnExit, 105,  2, 100,  26, "Exit")
                          SetGadgetColor(#Cntr, #PB_Gadget_BackColor, RGB(096,096,096))
                         CloseGadgetList()

                            StickyWindow(#Win, #True)

                         Repeat

                                Select WaitWindowEvent(1)

                                      Case #PB_Event_Gadget

                                          Select EventGadget()

                                              Case #BtnExit: iExit = #True
                                              Case #BtnBox

                                                      If StartDrawing(ImageOutput(#Img))
                                                      
                                                                        Box(150,100,100,100,RGB(Random(255),Random(255),Random(255)))
                                                                        Box(250,200,100,100,RGB(Random(255),Random(255),Random(255)))
                                                                        Box(300,300,100,100,RGB(Random(255),Random(255),Random(255)))
                                                                        Box(450,100,100,100,RGB(Random(255),Random(255),Random(255)))
                                                                        Box(350,200,100,100,RGB(Random(255),Random(255),Random(255)))
                                                                StopDrawing()
                                                      EndIf

                                                      SetGadgetState(#ImageGdt,ImageID(#Img))
                                          EndSelect

                                EndSelect

                         Until iExit = #True
               EndIf
EndProcedure

Win()

End
In fact in the real world the flicker is far worst, because shapes/lines are drawn dynamically by the User by dragging the mouse. If the drawing output is to the Window rather than the image, there is of course no flicker problem but there are issues updating dynamic shapes/lines as they intersect others and Undo -Redo is slow. A CanvasGadget() might be the answer to all these issues, but it can't be transparent?

Re: ImageGadget - SetGadget State Flicker

Posted: Wed Aug 06, 2014 3:24 pm
by RASHAD
Hi IV
No flicker I suppose

Code: Select all

               If OpenWindow(#Win, 0, 0, 800, 600, "", #PB_Window_ScreenCentered)
               SmartWindowRefresh(#Win,1)

Re: ImageGadget - SetGadget State Flicker

Posted: Wed Aug 06, 2014 3:27 pm
by IdeasVacuum
Hi Rashad - that's a nice tip thank you.
Can actually use a transparent Canvas, see below:

Code: Select all

Enumeration
#Win
#Canv
#Cntr
#BtnBox
#BtnExit
EndEnumeration

Global igTrans  = RGBA(128,128,000,000) ;Transparent
Global igOpaque = RGBA(128,128,000,255)

Procedure Win()
;--------------

Protected  iExit.i = #False
Protected iFlags.i = #PB_Container_BorderLess | #PB_Container_Flat

               If OpenWindow(#Win, 0, 0, 800, 600, "", #PB_Window_ScreenCentered)

                                  SetWindowLongPtr_(WindowID(#Win), #GWL_EXSTYLE, #WS_EX_LAYERED)
                        SetLayeredWindowAttributes_(WindowID(#Win), igTrans, 0, #LWA_COLORKEY)

                             CanvasGadget(#Canv,  0, 50, 800, 550)

                                If StartDrawing(CanvasOutput(#Canv))

                                       DrawingMode(#PB_2DDrawing_Default)
                                               Box(0,0,800, 550, igOpaque)
                                       StopDrawing()
                                EndIf

                         ContainerGadget(#Cntr,      0,  0, 800,  50, iFlags)
                            ButtonGadget(#BtnBox,    2,  2, 100,  26, "Draw Boxes")
                            ButtonGadget(#BtnExit, 105,  2, 100,  26, "Exit")
                          SetGadgetColor(#Cntr, #PB_Gadget_BackColor, RGB(096,096,096))
                         CloseGadgetList()

                            StickyWindow(#Win, #True)

                         Repeat

                                Select WaitWindowEvent(1)

                                      Case #PB_Event_Gadget

                                          Select EventGadget()

                                              Case #BtnExit: iExit = #True
                                              Case #BtnBox

                                                      If StartDrawing(CanvasOutput(#Canv))
                                                      
                                                                        Box(150,100,100,100,RGB(Random(255),Random(255),Random(255)))
                                                                        Box(250,200,100,100,RGB(Random(255),Random(255),Random(255)))
                                                                        Box(300,300,100,100,RGB(Random(255),Random(255),Random(255)))
                                                                        Box(450,100,100,100,RGB(Random(255),Random(255),Random(255)))
                                                                        Box(350,200,100,100,RGB(Random(255),Random(255),Random(255)))
                                                                StopDrawing()
                                                      EndIf
                                          EndSelect

                                EndSelect

                         Until iExit = #True
               EndIf
EndProcedure

Win()

End
Works like a charm! :mrgreen:

Re: [solved] ImageGadget - SetGadget State Flicker

Posted: Wed Aug 06, 2014 3:33 pm
by Fred
Looks good :)

Re: [solved] ImageGadget - SetGadget State Flicker

Posted: Fri Aug 08, 2014 3:16 am
by netmaestro
You can't host an image of 32bit depth in an imagegadget if you're going to be updating it very much. It will flicker. You can use a 24bit image with the imagegadget and have smooth animation.