PureBasic Forum
http://forums.purebasic.com/english/

SweetyVD (Visual Designer)
http://forums.purebasic.com/english/viewtopic.php?f=12&t=68187
Page 8 of 11

Author:  Bitblazer [ Sun Nov 24, 2019 8:28 pm ]
Post subject:  Re: SweetyVD (Visual Designer)

The UI look has been a topic of discussion for a while. I remember the licensing of sciter was discussed, but i assume it was simply not affordable.

What i did previously, was to use a skin engine like Skincrafter or a windowblinds compatible engine to offer a more modern application look. But i stopped offering skinned apps as they usually just create more problems. Especially for those people who care enough about their desktop look, they mostly hate skinned applications because that usually interferes with their personal desktop software and their own UI design choice.

But an integrated sciter based solution would be very useful.

Author:  Caronte3D [ Mon Nov 25, 2019 9:35 am ]
Post subject:  Re: SweetyVD (Visual Designer)

mohsen wrote:
I'm building a new designer...


Wow! :shock:
It Looks very promissing!
I will be happy to be an alpha tester :wink:

Author:  ChrisR [ Wed Jan 29, 2020 3:11 pm ]
Post subject:  Re: SweetyVD (Visual Designer)

Updated v2.1.0

Well, it's been a little while, but I've restarted a bit, the dev of my baby's...

There's been a lot of changes, I've been trying to structure the code better.
so I don't get lost myself :wink:

Main points:
Decrease the flickering (on Windows) due to the overlap of Gadgets and Canvas
Design changed with a pseudo ribbon and a setting panel
Selection of multiple gadgets to move them together
Group Gadgets for future selections
Align Gadget to Left, Right, Top, Bottomand Same Width, Height
Play (Compil and Run)
...
Maybe it will avoid the project going to the trash.
It' s still Open on GitHub, the links are on 1st post.


Image


Note on Linux:
Use Purebasic version 5.61 (or 5.60). The Gadgets are Not drawn over the canvas with the following versions (5.62, 5.70, 5.71). I don't know why!
Screenshot available on the 2nd post

Thanks for your feedbacks, they are Welcome :)

Author:  FlatEarth [ Wed Jan 29, 2020 4:06 pm ]
Post subject:  Re: SweetyVD (Visual Designer)

@ChrisR : Very promising, congratulations. :wink:

My Comments Only For Windows Platform:

To reduce flicker in Windows, it may be better to use capture gadgets instead of using (overlap of Gadgets and Canvas).
viewtopic.php?f=5&t=70746&hilit=capture+gadget%3B+64bit%3B

For multiple selection by dragging the rectangle, the IntersectRect_ function can also be used to detect selection controls.

Author:  ChrisR [ Wed Jan 29, 2020 4:20 pm ]
Post subject:  Re: SweetyVD (Visual Designer)

Thanks for your feedback. Have you tried it ?

I used 2 things to reduce flicker in Windows:
Hide the Canvas Gadget(s) while moving or resizing and then make them visible again.
Add #WS_CLIPCHILDREN GWL_STYLE On the drawing area canvas, the grid.

It's not perfect, but it's already much better than before, really better.
The flicker on windows is a big headache
and I try to avoid using the APIs as much as possible for cross platform compatibility.

Thanks for your link on capture gadgets!, I'll check it out later
:)

Author:  FlatEarth [ Wed Jan 29, 2020 4:32 pm ]
Post subject:  Re: SweetyVD (Visual Designer)

ChrisR wrote:
Thanks for your feedback. Have you tried it ?

you're welcome ,I've tried it and I'm pretty sure :D :wink:
the #WM_PRINT can capture hidden controls so the main control will remain hidden forever and you use the image of it on the canvas.

This code is also effective in reducing flicker, for example: when you want to move controls with handles
Code:
Procedure SetRedraw(MainForm, State)
  If State = #False
    SendMessage_(GadgetID(MainForm),#WM_SETREDRAW,0,0)
  Else
    SendMessage_(GadgetID(MainForm),#WM_SETREDRAW,1,0)
    RedrawWindow_(GadgetID(MainForm),0,0,#RDW_INVALIDATE|#RDW_ERASE|#RDW_ALLCHILDREN|#RDW_UPDATENOW)   
  EndIf
EndProcedure


Author:  ChrisR [ Wed Jan 29, 2020 5:03 pm ]
Post subject:  Re: SweetyVD (Visual Designer)

I have basically the same procedure in the Sweetymodule.pbi, but I don't use it currently

Code:
  Procedure SetWinRedrawON(Gadget.i, State.b=#True)
    CompilerIf #PB_Compiler_OS = #PB_OS_Windows
      If DisplayHandleCornerOnMove = #False
        SendMessage_(GadgetID(Gadget),#WM_SETREDRAW,State,0)
        If State = #True
          ;InvalidateRect_(GadgetID(Gadget), #Null, State)
          RedrawWindow_(GadgetID(Gadget), #Null, #Null, #RDW_INVALIDATE | #RDW_UPDATENOW)     ;#RDW_ERASE | #RDW_FRAME | #RDW_INVALIDATE | #RDW_ALLCHILDREN
        EndIf
      EndIf
    CompilerEndIf
  EndProcedure


On the Main Canvas Container,
Code:
SetWindowLong_(GadgetID(#DrawArea), #GWL_STYLE, GetWindowLong_(GadgetID(#DrawArea), #GWL_STYLE) | #WS_CLIPCHILDREN)

Gives approximately the same result without having to call the procedure before and after each moving.

I'm going to watch to Capture Gadget, sounds really interesting If I understand correctly.
With the captured Gadget visible and the real gadget hidden
And all that play between what's hidden and what's visible... with handle corner on top and self-managed ZOrder Gadget...
But it seems only for Windows
Thanks :)

Author:  FlatEarth [ Wed Jan 29, 2020 5:19 pm ]
Post subject:  Re: SweetyVD (Visual Designer)

Yes I also said in the first post that my comments are for Windows.
However, this method has disadvantages that need to manage. few controls such as spin,ExplorerCombo,Editor not capture properly.

Of course, another method comes to my mind, but I haven't tested it. I'll try and say the result.

Author:  BarryG [ Wed Jan 29, 2020 10:11 pm ]
Post subject:  Re: SweetyVD (Visual Designer)

You need to use GetWindowLongPtr_() and SetWindowLongPtr_() instead of GetWindowLong_() and SetWindowLong_(), too. This was mentioned in a PureBasic blog post some time ago, when PureBasic became 64-bit. Just a simple search-and-replace in your sources.

Author:  ChrisR [ Thu Jan 30, 2020 12:40 am ]
Post subject:  Re: SweetyVD (Visual Designer)

Yes, thanks :)
Not the first time I've forgotten these two WindowLongPtr, the copy-paste defect also.
It is fixed now and updated on Github.

Edit: With my 100th post, I've moved to Enthusiast but I already was :wink:

Author:  Caronte3D [ Thu Jan 30, 2020 9:08 am ]
Post subject:  Re: SweetyVD (Visual Designer)

Hi, your app is very nice, I like it, but... why not add load/import functionality? :?
Without this possibility it's almost unusable for complex interfaces where we must do changes over time.

Author:  ChrisR [ Thu Jan 30, 2020 11:44 am ]
Post subject:  Re: SweetyVD (Visual Designer)

Caronte3D wrote:
Hi, your app is very nice, I like it, but... why not add load/import functionality? :?

Thanks :)
Load/Open should be the next step now that it's flashing a little bit less and that it has the multi-selection and the grouped moving.

For the moment the sheet is blank. I can't promise anything for the time it will take.
SweetyVD is just an exercice for me, for the fun in my spare time.
But it's an exciting subject and I've already gone a lot further than I originally thought.
I'll try to continue a little more.

I believed a lot in Amitris, but I don't know what happened behind the scenes :!:
I hope Moshen will continue his project because the first beta was very beautiful, very fluid and without flickering ...
Only the properties grid was too complicated to my taste... (it's probably not so nice, in SweetyVD without a real grid but everything is easily accessible in 1 click).
It was seeing the promising Amitris that made me want to go on a little longer.

Author:  ChrisR [ Thu Jan 30, 2020 12:09 pm ]
Post subject:  Re: SweetyVD (Visual Designer)

FlatEarth wrote:
However, this method has disadvantages that need to manage. few controls such as spin,ExplorerCombo,Editor not capture properly.

Of course, another method comes to my mind, but I haven't tested it. I'll try and say the result.

I've tested Rashad's CaptureGadget examples.
Only Windows but I understand All the interest for a designer, really interesting.
The suggested example (without moving) of SpinGadget Capture seems to work, what's the concern about the few contols not properly captured ?
Let us know for the other method.

Author:  FlatEarth [ Thu Jan 30, 2020 2:55 pm ]
Post subject:  Re: SweetyVD (Visual Designer)

ChrisR wrote:
Let us know for the other method.


I wrote a few lines of code to illustrate what I mean.Of course the codes are dirty and not optimized.
In these codes, instead of using a dedicated canvas for each gadget, I only use one canvas that sits on the main canvas.
Of course requires more work but the result seems to me desirable because :

1-Prevents the creation of additional canvas.
2-The controls are moved without flickering

I do not know maybe not good. :D

Code:
Procedure SetGadgetZOrder(gadget, zorder=0)
  If IsGadget(gadget)
    If zorder = 0   ;Call with zorder=0 just after creating each gadget
      SetWindowLong_(GadgetID(gadget), #GWL_STYLE, GetWindowLong_(GadgetID(gadget), #GWL_STYLE) | #WS_CLIPSIBLINGS)
    ElseIf zorder = 1   ;Call with zorder=1 to later bring a gadget to the top of the z-order
      SetWindowPos_(GadgetID (gadget), #HWND_BOTTOM, 0,0,0,0, #SWP_NOSIZE | #SWP_NOMOVE)
    Else   ;Call with zorder=-1 to later bring a gadget to the bottom of the z-order
      SetWindowPos_(GadgetID(gadget), #HWND_TOP, 0, 0, 0, 0, #SWP_NOSIZE | #SWP_NOMOVE)
    EndIf
  EndIf
EndProcedure

Structure VDG_Data
  Btn.i
  IsSelected.b
EndStructure 

Global NewList  GList.VDG_Data()

Enumeration
  #UnderForm
  #OverForm
  #AddGadget
EndEnumeration

Procedure CreateGadget(X,Y,W,H)
  OpenGadgetList(#UnderForm)
    AddElement(GList())
    GList()\Btn = ExplorerComboGadget(#PB_Any,X,Y,W,H,"")
  CloseGadgetList()
EndProcedure

Procedure IsMouseOverGadget(dummyX,dummyY,GX,GW,GY,GH)
  If (dummyX > GX) And ( dummyX < (GX + GW) ) And
     (dummyY > GY) And ( dummyY < (GY + GH) )   
    ProcedureReturn 1
  EndIf
EndProcedure

Procedure Canvas_Events_Handler()
 
  Protected  eg,et,MMX,MMY,_Gadget
  Static g_Drag,LBD_X,LBD_Y
   
  eg = EventGadget()
  et = EventType()

  Select et   
    Case #PB_EventType_LeftButtonDown
     
      LBD_X = GetGadgetAttribute(eg,#PB_Canvas_MouseX)
      LBD_Y = GetGadgetAttribute(eg,#PB_Canvas_MouseY) 
     
      ResetList(GList())
      ForEach GList()
        _Gadget = GList()\Btn
        If IsMouseOverGadget(LBD_X,LBD_Y,GadgetX(_Gadget),GadgetWidth(_Gadget),GadgetY(_Gadget),GadgetHeight(_Gadget))
          g_Drag = #True
          GList()\IsSelected = #True
        EndIf
      Next
     
    Case #PB_EventType_MouseMove
     
      If g_Drag
        MMX = GetGadgetAttribute(eg,#PB_Canvas_MouseX)  ;- LBD_X
        MMY = GetGadgetAttribute(eg,#PB_Canvas_MouseY)  ;- LBD_Y
        ResetList(GList())
        ForEach GList()
          If GList()\IsSelected
            ResizeGadget(GList()\Btn,MMX,MMY,#PB_Ignore,#PB_Ignore)
          EndIf
        Next
      EndIf         
     
    Case #PB_EventType_LeftButtonUp
      If g_Drag
        g_Drag = #False
       
        ResetList(GList())
        ForEach GList()
          If GList()\IsSelected
            GList()\IsSelected = #False
          EndIf 
        Next   
      EndIf
     
  EndSelect
EndProcedure 

If OpenWindow(0, 0, 0, 800, 600, "", #PB_Window_SystemMenu | #PB_Window_ScreenCentered|#PB_Window_SizeGadget)
 
  ButtonGadget(#AddGadget,650,20,100,30,"Add Gadget")
 
  CanvasGadget(#OverForm,0,0,600,600)
  SetGadgetZOrder(#OverForm)
  SetGadgetZOrder(#OverForm,1)
  BindGadgetEvent(#OverForm,@Canvas_Events_Handler())
 
  CanvasGadget(#UnderForm,0,0,600,600,#PB_Canvas_Container)
  CloseGadgetList() 
 
  Repeat
    Event = WaitWindowEvent()
    If Event = #PB_Event_Gadget
      Select EventGadget()
        Case #AddGadget : CreateGadget(20,20,100,30) 
      EndSelect
    EndIf     
  Until Event = #PB_Event_CloseWindow
EndIf

Author:  FlatEarth [ Thu Jan 30, 2020 3:16 pm ]
Post subject:  Re: SweetyVD (Visual Designer)

ChrisR wrote:
The suggested example (without moving) of SpinGadget Capture seems to work, what's the concern about the few contols not properly captured ?


1- I have already tested the spin control, it works fine with a slight change in Rashad codes when moving and resizing.
2- For editor and shortcut it is easy to use string control because it is properly captured.
3- Nothing comes to my mind for ExplorerComboGadget. :D

Page 8 of 11 All times are UTC + 1 hour
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
http://www.phpbb.com/