About my new visual designer project

Everything else that doesn't fall into one of the other PB categories.
breeze4me
Enthusiast
Enthusiast
Posts: 511
Joined: Thu Mar 09, 2006 9:24 am
Location: S. Kor

About my new visual designer project

Post by breeze4me »

I'm making a visual designer for Windows only, and it needs to be tested on various PCs.
The features are only partially complete with the gadget-related parts.
It can run on Windows XP or later.

Try it and let me know if there are any problems, especially various drawing issues.

BTW, for testing purposes, the window background color is set randomly, it's not a bug. :mrgreen:


https://www.dropbox.com/s/1c7w31d92j9er ... t.zip?dl=0

On Windows 7 English.
Image

On Windows 10 Korean.
Image


Currently implemented functionalities.
- Add all the PB native gadgets.
- Copy, Cut, Paste, Clone, Delete, Align. (hierarchical gadget structures, except for Clone, Align)
- Size, Move. (hierarchical gadget structures)
- DPI Awareness. (system, PB native)


How to use:


* Right click on the main canvas
Display an appropriate menu.

* Right mouse button (or Ctrl key) down + mouse wheel up/down on the main canvas
Change the window tab being displayed.

* Shift key down + mouse wheel up/down on the main canvas
Change the project tab being displayed.

* Drag and drop on the gadget object tree
Change the order of gadgets.
Change the order of tabs on the Panel gadget.
Swap two children of the Splitter gadget.

* Left click on a gadget
Select a gadget.
A gadget marked with the black handles:
- It is a base gadget for alignment.
- It will be added as the first child of the Splitter gadget.

* Ctrl + Left click on a gadget
Preserve previously selected gadgets, and select or deselect a gadget.

* Clone a gadget:
Depending on where the menu is called, the location of the new gadget being added changes.
(i.e. left 1/3, upper/lower part of middle 1/3, right 1/3 of a gadget)

* Press ESC key while moving/sizing/creating/selecting
Cancel the current operation.



There are two modes for operations. "Add/Manipulate" and "Move/Select" Modes.


In Add/Manipulate Mode: (crosshair cursor)
(to change the mode, click the middle mouse button or press the Space key on the main canvas)

* Left mouse button down + dragging
Draw a gadget.
Manipulate the V/H scroll bar of the ScrollArea gadget. (hand cursor)
Manipulate the separator of the Splitter gadget. (left-right arrows or up-down arrows cursor)

* Left click on a tab (or left-right button) of the Panel gadget
Change the active tab of the Panel gadget. (hand cursor)



In Move/Select Mode: (default arrow cursor)

* Left mouse button down + dragging
Select gadgets within a rectangular area.

* Shift key down + Left mouse button down and dragging
Preserve previously selected gadgets, and select gadgets within a rectangular area.

* Hold the left mouse button down for the default time(currently 200 ms). (arrow cursor in all directions)
Move a gadget on an unselected gadget.
Move the selected gadgets on a selected gadget.

* Shift key down + movement operation
Move + Change the parent of the selected/unselected gadgets.
Last edited by breeze4me on Thu Feb 25, 2021 7:53 pm, edited 6 times in total.
Axolotl
Enthusiast
Enthusiast
Posts: 435
Joined: Wed Dec 31, 2008 3:36 pm

Re: About my new visual designer project

Post by Axolotl »

Hi breeze4me,

sorry, not even started a test on your solution yet.
Only a stupid opinion of me: "Why are you starting a new visual desiger and not working on the open source project?"

IMHO there are so many startups which lacks on so many things...
Dont get me wrong, just thinking.
Mostly running PureBasic <latest stable version and current alpha/beta> (x64) on Windows 11 Home
User avatar
Saki
Addict
Addict
Posts: 830
Joined: Sun Apr 05, 2020 11:28 am
Location: Pandora

Re: About my new visual designer project

Post by Saki »

I think it has probably crossed everyone's mind to create one.
But you need a very high experience for it.
If you don't have that, you're always starting from scratch, because you're constantly learning and improving things as you go along.
It means thousands of hours of work.
After that, you can give it away, because it is very hard to create something that is better than what already exists.
If you get bad reviews, the job is done quickly.
But it is definitely a good project to learn.
地球上の平和
breeze4me
Enthusiast
Enthusiast
Posts: 511
Joined: Thu Mar 09, 2006 9:24 am
Location: S. Kor

Re: About my new visual designer project

Post by breeze4me »

Axolotl wrote:Hi breeze4me,

sorry, not even started a test on your solution yet.
Only a stupid opinion of me: "Why are you starting a new visual desiger and not working on the open source project?"

IMHO there are so many startups which lacks on so many things...
Dont get me wrong, just thinking.
There is no visual designer that I like, so I decided to make it myself. That's all.
breeze4me
Enthusiast
Enthusiast
Posts: 511
Joined: Thu Mar 09, 2006 9:24 am
Location: S. Kor

Re: About my new visual designer project

Post by breeze4me »

Saki wrote:I think it has probably crossed everyone's mind to create one.
But you need a very high experience for it.
If you don't have that, you're always starting from scratch, because you're constantly learning and improving things as you go along.
It means thousands of hours of work.
After that, you can give it away, because it is very hard to create something that is better than what already exists.
If you get bad reviews, the job is done quickly.
But it is definitely a good project to learn.
I will add all the functions I want because I'm making it for me. :wink:
Axolotl
Enthusiast
Enthusiast
Posts: 435
Joined: Wed Dec 31, 2008 3:36 pm

Re: About my new visual designer project

Post by Axolotl »

no offense, of course your reasoning is valid.

I would just wish that there would be more volunteers for the improvement of the existing OSS tools.
I am unfortunately not good enough for it.

Otherwise, I think that unfortunately most projects are canceled early and the "official" VD remains as good/bad as it is.
Mostly running PureBasic <latest stable version and current alpha/beta> (x64) on Windows 11 Home
User avatar
Kiffi
Addict
Addict
Posts: 1353
Joined: Tue Mar 02, 2004 1:20 pm
Location: Amphibios 9

Re: About my new visual designer project

Post by Kiffi »

A screenshot would be nice...
Hygge
breeze4me
Enthusiast
Enthusiast
Posts: 511
Joined: Thu Mar 09, 2006 9:24 am
Location: S. Kor

Re: About my new visual designer project

Post by breeze4me »

Axolotl wrote:no offense, of course your reasoning is valid.

I would just wish that there would be more volunteers for the improvement of the existing OSS tools.
I am unfortunately not good enough for it.

Otherwise, I think that unfortunately most projects are canceled early and the "official" VD remains as good/bad as it is.
This is my personal project, so I might open it when I quit. :mrgreen:

Kiffi wrote:A screenshot would be nice...
Added.
User avatar
Lunasole
Addict
Addict
Posts: 1091
Joined: Mon Oct 26, 2015 2:55 am
Location: UA
Contact:

Re: About my new visual designer project

Post by Lunasole »

Nice^^ Reminds me of how I created own DialogDesigner also for myself (to create some unified interfaces for PB, in a fastest way as for me).
Like "If you want a thing done well, do it yourself" :mrgreen: It's surely fine sometimes to reinvent the wheel.
"W̷i̷s̷h̷i̷n̷g o̷n a s̷t̷a̷r"
breeze4me
Enthusiast
Enthusiast
Posts: 511
Joined: Thu Mar 09, 2006 9:24 am
Location: S. Kor

Re: About my new visual designer project

Post by breeze4me »

Here is a new test version.
Try it on.

Save and load functions have not yet been added. :mrgreen:

https://www.dropbox.com/s/in6nmpj39w0au ... 2.zip?dl=0
  • Added property grid.
    - All properties can be set.
    - Pressing the ESC key in each field of the property grid resets the field. (Except for the flag listicon)
    - Enter 1 space character(" ") to empty(null) a specific string field.
    - Common attributes of selected gadgets can be changed.
    - Changes in each field take effect when the focus is lost.(When you press a tab key or shift tab key, move the mouse to the main canvas, or click on another gadget, etc.)
  • Added menu shortcut keys. (When pasting with Ctrl+V shortcut, the copied gadgets are pasted to the position of the mouse pointer.)
  • The base gadget(with black handles) is changed when you position the mouse pointer on a selected gadget and scroll the wheel up/down.


Image
Last edited by breeze4me on Mon Apr 19, 2021 6:18 pm, edited 1 time in total.
User avatar
ChrisR
Addict
Addict
Posts: 1127
Joined: Sun Jan 08, 2017 10:27 pm
Location: France

Re: About my new visual designer project

Post by ChrisR »

Welcome to the club :wink:
There are nice things. I would be curious to understand how you work with the containers!
For now, I can resize but I can't move an object (or don't know how), except via the property grid

A designer is a big job and a good time consumer, so good luck :)
breeze4me
Enthusiast
Enthusiast
Posts: 511
Joined: Thu Mar 09, 2006 9:24 am
Location: S. Kor

Re: About my new visual designer project

Post by breeze4me »

ChrisR wrote:Welcome to the club :wink:
There are nice things. I would be curious to understand how you work with the containers!
For now, I can resize but I can't move an object (or don't know how), except via the property grid

A designer is a big job and a good time consumer, so good luck :)
Thanks!

I applied the method of capturing the entire physical hidden window.
Mouse coordinates on the main canvas are converted into coordinates of the physical window and a gadget information is obtained at that location.
RealChildWindowFromPoint_() and MapWindowPoints_() APIs are used.

Once a container gadget information of the mouse location is obtained, a gadget is added directly to it, and then the entire window is captured and displayed on the main canvas.

However, when moving selected gadgets, they are captured separately and shown on the canvas.
The coordinates calculation is also done by MapWindowPoints_() API.

While the selected gadgets are being moved, the coordinates of the captured individual images are converted into coordinates of the physical window, so that it can be known where the actual position corresponds.

Anyway, it is important to calculate the coordinates on a real window and convert them into the coordinates of the canvas, and vice versa.
User avatar
ChrisR
Addict
Addict
Posts: 1127
Joined: Sun Jan 08, 2017 10:27 pm
Location: France

Re: About my new visual designer project

Post by ChrisR »

Interesting, thanks for the explanation 8)
I can move an object now, I had read diagonally and missed :
(to change the mode, click the middle mouse button or press the Space key on the main canvas)
I think I understand why you change the mode between create and move and I don't know if you could do it differently. It's not really familiar and easy to use, to my taste.
Good continuation :)
breeze4me
Enthusiast
Enthusiast
Posts: 511
Joined: Thu Mar 09, 2006 9:24 am
Location: S. Kor

Re: About my new visual designer project

Post by breeze4me »

A new test version has arrived. :wink:

https://www.dropbox.com/s/dglxvm3pi6txs ... 6.zip?dl=0

Added...
  • Read a external string file. It can be used to support multilingual interfaces.
    (It supports PB's Preference file and DLL file with a string table(STRINGTABLE resource). The latter is experimental.)
  • Export source code to file or clipboard.
  • Set parent window by dragging and dropping a window in the Project-Window object tree.
If the 'Object ID' starts with the '#' character, it is considered a constant, if it does not start with the '#' character, it is considered a variable.
For example, '#Window0' is a constant and 'Window0' is a variable.

Edit: Fixed some bugs. Sorry. :oops:

Edit2: Fixed crash when reading big external string files.

Edit3: Sorry for the frequent updates, but I fixed some minor bugs. :oops:
breeze4me
Enthusiast
Enthusiast
Posts: 511
Joined: Thu Mar 09, 2006 9:24 am
Location: S. Kor

Re: About my new visual designer project

Post by breeze4me »

Sorry for the late update.

Added...
  • Menu editor.
    - Support window menus and popup menus.
    - Code generation for MDI gadgets is possible.
    - Drag-and-drop changes the order of items or the parent of items in the menu tree.
    - In the "Menu Item ID" field, pressing the ESC key clears the string, and the menu item becomes a submenu. (Force to create an empty submenu)
    - The "Menu Item ID" is created as a constant if it starts with the "#" character and as a variable if not.
    - The string "\t" is replaced by a tab character in the "Text" field.
    - Move the key focus from the current field to another field to apply the change, as in the property grid.
https://www.dropbox.com/s/hmripxy5bbfsy ... 8.zip?dl=0

Edit: Fixed a code generation bug under certain circumstances.


Image
Post Reply