search

haxeui / haxeui-hxwidgets

The hxWidgets backend of the HaxeUI framework -
http://haxeui.org
MIT License
24 stars 7 forks source link

Is there a documentation where I can learn more about how to use this library? #27

Open s1-en opened 3 years ago

s1-en commented 3 years ago

The website is unfortunately not very informative and most entries in the API section don't have any descriptions (A simple search feature for the API would probably be a huge boon). Also the guides linked in here are all empty Markdown files for some reason.

https://github.com/haxeui/haxeui-guides

I was specifically looking for:

Sorry if these are a lot!

ianharrigan commented 3 years ago

How to create another window, the Custom Modal Dialog sample in the Components section of the site don't seem to work for hxwidgets

It should work, maybe its out of date, ill have a play later (creating a dialog across all haxeui backends is consistent, unless ive recently broken something, which i dont think i have)

How to prevent the application window from being resized by the user and also disable the maximize button

You can do this will wxWidgets window styles, it may be nice if haxeui would allow some short cuts for this though, ill have to have a check / play

How to disable a menu item and button, or really any element for that matter

.disabled=true should work (or disabled="true") if you are working with xml... ... menus are quite special in haxeui-hxwidgets though, so maybe its not implemented there (or working correctly) - will have to take a look

How to prevent multiple instances of the application executable from running at the same time

There seems to be a wxSingleInstanceChecker inside wxWidgets that will check if another instance is running, but wont do anything else (like bring up the running instance to the foreground for example). wxSingeInstanceChecker isnt exposed to hxWidgets, but that will be easy - more difficult is what to do when another instance is running - looking online it suggests using IPC to do "stuff", this is another thing that might be neat for haxeui to wrap up neatly, but will require some thought.

Apparently it @:bind does work outside of SWF

@:bind is haxeui metadata, i didnt even realise it existing in the haxe compiler, but it shouldnt matter as haxeui-interprets it

Is it possible to create a custom "skin" for hxwidgets with my own design of window decoration and button styles

You can style windows controls somewhat but not fully, this is a limitation of the OS, these are fully native components and therefore the OS (windows in your case) will drastically limit what you can and cant do (eg: wxWidgets on osx is VERY limited, but again, this is a limitation by the OS, not wxWidgets or even haxeui) - what kind of styles are you looking for?

Where can I find all the available options to put inside haxeui-hxwidgets.properties file

I guess there is no central place, as you've noticed (and pointed out) documentation is pretty thin and sporadic - i keep saying im going to fix that, but never get round to it as something else always seems to come along as my time is limited :(

Hope that helps somewhat, not really any solid answers, but i few things ill check out when i get some free hours

Cheers, Ian

s1-en commented 3 years ago

Thanks a lot for the detailed response!

It should work, maybe its out of date, ill have a play later (creating a dialog across all haxeui backends is consistent, unless ive recently broken something, which i dont think i have)

I have managed to get this to work and I must've botched something when initially trying to follow the instruction beforehand.

You can do this will wxWidgets window styles, it may be nice if haxeui would allow some short cuts for this though, ill have to have a check / play

How can I access the wxWidgets API from haxe in the meantime? Or is this not possible?

menus are quite special in haxeui-hxwidgets though, so maybe its not implemented there (or working correctly) - will have to take a look

Indeed using disabled="true" does no seem to do anything to the menu items (On Windows, haven't checked on Linux yet)

wxSingeInstanceChecker isnt exposed to hxWidgets, but that will be easy - more difficult is what to do when another instance is running

I think it would be enough to simply give the users knowledge of the other instance running and then let them handle what to do depending on their use case, (e.g Open a new tab to the existing instance if a new file is opened from the explorer for files associated to the application)

And on a somewhat related note, in order to set file associations on Windows, we need to use the registry so is there a way to interface with the Windows Registry aside from relying on hack-y console commands to launch REG.EXE? I know that another approach would be to set the file associations using the software installer but ideally, the end-user should be able to manage it from the application itself.

And also related to files, I can't seem to find any way to open the native file and folder picker?

@:bind is haxeui metadata, i didnt even realise it existing in the haxe compiler, but it shouldnt matter as haxeui-interprets it

It's one of those things where I couldn't find anything about it in the documentation so I just assumed it was relying on the one haxe uses

You can style windows controls somewhat but not fully, this is a limitation of the OS, these are fully native components and therefore the OS (windows in your case) will drastically limit what you can and cant do (eg: wxWidgets on osx is VERY limited, but again, this is a limitation by the OS, not wxWidgets or even haxeui) - what kind of styles are you looking for?

I am mainly just interested in making the Windows version up-to-par with design "standards" (if you can call it that) of Windows 10. Since Microsoft can't seem to decide on what their design language is going to be and keeps changing it every few years, Windows 10 is now a hodgepodge of different UI systems going all the way back to Windows 98.

What I had in mind is to just roll my own design with custom window decorations, animations, themed controls, etc. that tries to adhere somewhat to the latest one (fluent design) but I only want it applied on the Windows side of things because macOS and Linux don't seem to suffer as much from these design inconsistencies and applications look fine on them by default. Hence why I still want to do this in hxwidgets. Other targets like OpenFL don't seem to have support for custom window decorations anyway and also wouldn't work with a true multi-window setup.

For example, I wanted to have the menubar unified with the title bar just like VS Code but without the massive overhead that Electron brings to the table. I think this can be achievable if I can just hide the native window decoration and figure out how to make custom components for hxwidgets.

image

I guess there is no central place, as you've noticed (and pointed out) documentation is pretty thin and sporadic - i keep saying im going to fix that, but never get round to it as something else always seems to come along as my time is limited :(

I would help if I could but I'm relatively new to haxe / haxeui so I should probably wait until I'm more comfortable before contributing stuff. As for the question at hand, I found this post from you last year: https://community.haxeui.org/t/sizing-of-sub-children/174/13 so that takes care of that then but would still be nice to see a post like this for the other targets as well.

ianharrigan commented 3 years ago

So ive made a few updates:

To answer a few of your other questions:

How can I access the wxWidgets API from haxe in the meantime? Or is this not possible?

Sure, each haxeui component in haxeui-hxwidgets has a "window" property, this is the hxWidgets window, which is a wrapper for the wxWidgets extern.

I think it would be enough to simply give the users knowledge of the other instance running and then let them handle what to do depending on their use case,

It looks to be fairly simple to know if another wxWidgets app is running via that wxSingleInstanceChecker, however, i feel like knowing another app is running isnt that useful. You would need to be able to communicate between that running app and the instance just started. Take you example of opening another tab in the currently running app, well, the "new" app would need to let that running app "know" to do something - the "wx way" seems to be to open sockets between them and send messages back and forth, however, im thinking haxeui could do that with a library like hxWebSockets which could technically mean that an IPC sub system could work for pretty much every backend as its a pure haxe library - ill have to think about it, but it could be very useful (it would be opt in ofc)

What I had in mind is to just roll my own design with custom window decorations, animations, themed controls, etc. that tries to adhere somewhat to the latest one (fluent design)

I could be wrong, but i think this is going to be pretty hard to achieve in wxWidgets, i havent actually tried though ofc... That fluent design looks pretty interesting, do you know how it works?? I mean, what component lib is it using, what language etc? Sounds like it could be a new haxeui backend! ;)

EDIT: you'll need git hxWidgets, haxeui-hxwidgets, haxeui-core

s1-en commented 3 years ago

I just tried it and it works great!

Also, I tried to poke around wxWidgets and apparently it is possible to disable the window's decorations via wxBORDER_NONE. I modified FrameStyle.hx to add BORDER_NONE The problem is that it loses its resizability feature and it would need to be manually reimplemented for the borderless window to be resizable again.

I'm still figuring out how I can use a custom control to handle dragging on the sides of the borderless window but I'm at least glad it's something that can be done. But you are right in that it would be a pain in the ass to basically reinvent the wheel with custom components.

And I only have surface level knowledge about fluent design but I do know it is being used in UWP applications so most definitely .NET. I believe there is an ongoing effort (by Microsoft) to expose these same components to Win32 applications as well via WinUI 3 so projects like wxWidgets would be able to use it.

ianharrigan commented 3 years ago

WinUI 3 looks interesting - never heard of it - downloading it now to have a play. I wonder how / if / when wxWidgets will take advantage of it. UWP could certainly be another backend in haxeui... in fact, i have a prototype somewhere, but stopped playing with it for some reason. Anyways, interesting stuff.

Cheers, Ian

s1-en commented 3 years ago

I seem to have hit some more snags, the shortcutText doesn't seem to work on hxwidgets. As far as I know, this is the correct way to use it right?

<VBox>
    <menubar width="100%">
        <menu text="File">
            <menu-item text="New" shortcutText="Ctrl+N" />
        </menu>
    </menubar>
</VBox>

Meanwhile the resulting app doesn't show it no matter what kind of text I put in there.

Also this sounds dumb but how do I programmatically exit the application outside the main class? And lastly, is it possible to add haxe.ui.hxwidgets.frame.minWidth, haxe.ui.hxwidgets.frame.maxWidth, haxe.ui.hxwidgets.frame.minHeight and haxe.ui.hxwidgets.frame.maxHeight to the options available to the properties file? I ended up adding them myself

ianharrigan commented 3 years ago

Thanks loads for the PRs, i had no idea you could restrict windows on the wx level, figured if you wanted that it would have to be wired up yourself.

Also, wrt to your other questions:

  1. to exit the application: HaxeUIApp.instance.exit()
  2. There was a bug in haxeui-hxwidgets that stopped the shortcuts working correctly, that should be fixed now.

Thanks again for the PRs!

Cheers, Ian

s1-en commented 3 years ago

I just checked it out and it seems while the shortcutText issue had been solved, it seems it still does not render the icon property nor does it send the action events for the menu items. I had hoped these two things would be part of the bugs that were resolved. Oh and also the scrollview contents scroll super slowly on Windows hxwidgets but not on HTML5 release

ianharrigan commented 3 years ago

Do you have a minimal example of both menu issues? I tried using the menu (context and menu bar) and both were fine... I didnt try an icon though, will try that shortly.

Yeah, scrollview increment needs to be calculated on wxWidgets - will look at best way to do that

Ian

EDIT: hmm, yeah, icon doesnt work for some reason, im sure that used to work.

ianharrigan commented 3 years ago

Well, i take it back, icon could never have worked as there was no code linking the haxeui .icon property to the wxWidgets setBitmap function - so i must have dreamed that :D

They should be fixed now in latest git (haxeui-hxwidgets).

menus4

ianharrigan commented 3 years ago

Ive also changed the scroll step (also latest git)... im not conviced its the right value (10 rather than 1) but it feels a little better, it still might make sense to calculate it based on the height of the component and the scrollable area - ill have to a have a bit of a deeper play with that

s1-en commented 3 years ago

Thank you for all the updates! Here's an example of the issue I'm having with the menu not firing events:

https://user-images.githubusercontent.com/63731521/115356340-229dfe00-a1ee-11eb-86d8-f7de01b2040d.mp4

And here's the project source: haxeui-events-test.zip

ianharrigan commented 3 years ago

Ah, ok, you are using the wrong event. Generally you should be listening for a menu selected event, eg:

        mainMenu.onMenuSelected = function(e:MenuEvent) {
            trace("menu bar: " + e.menuItem.text);
        }

or for context menus:

            var menu:Menu = ComponentMacros.buildComponent("assets/menu.xml");
            menu.onMenuSelected = function(e:MenuEvent) {
                trace("context menu: " + e.menuItem.text);
            }
            Screen.instance.registerEvent(MouseEvent.RIGHT_CLICK, function(e:MouseEvent) {
                menu.left = e.screenX;
                menu.top = e.screenY;
                Screen.instance.addComponent(menu);
                menu.show();
            });

The click would work on other backends as the click will still dispatch, which isnt the case in wxWidgets (wx wont dispatch a click event in the same manner)... that said, other people have tried the exact same thing and ive had to explain it a number of times, i wonder if it would make sense to dispatch a click from haxeui-hxwidgets when a menu is selected?... ... ... thoughts?

EDIT: Btw, that event can ofc also be used with binding:

@:bind(mainMenu, MenuEvent.MENU_SELECTED)
function onMainMenu(e:MenuEvent) {
...
}
s1-en commented 3 years ago

I didn't know it needed to be something else because it MouseEvent works with HTML5 export so I thought it was simply hxWidgets having some hiccups.

So then what do I use if I want to have a "global" event catcher? For example, anywhere on the app, if I want to catch the user pressing, let's say Alt+K? Or I want to catch if the user right clicks anywhere on the app?

I think another thing I'm unclear about is how do I reference an image that is in the same project directory? I tried either relative <menu-item text="Test" icon="icon.png" /> or <menu-item text="Test" icon="assets/icon.png" /> and they both end up with the error Could not load bitmap from null bytes

s1-en commented 3 years ago

Also how do I get this awesome file tree view https://community.haxeui.org/t/beginnings-of-a-haxe-ide-written-in-haxeui/121/2

ianharrigan commented 3 years ago

Ok, so for resources (images for this case), haxeui can use either framework specific resources (ie, resources that are specific to the backend framework), or a universal method using haxe resources (that will be turned into the framework specific resources). For wxWidgets these are one at the same, that is a bunch of haxe.Bytes that will be turned into bitmaps etc. So you have a few methods, the first would be to just package up some haxe resources manually (see --resource flag for the compiler)

A much easier method is to use haxeui modules, this does exactly what the resource flag does (essentially) but it does it recursively and allows for renaming of the generated resource names, a simple example would be:

  1. create a module.xml on the class path
  2. add something like: 
    <module>
<resources>
    <resource path="assets/myImages" prefix="myImages" />
</resources>
</module>
  3. now you can refer to images in that folder as something like "myImages/someImage.png"

As for the treeview, there isnt one in core... specifically for the reason that there is no wxTreeView exposed in hxWidgets yet, and so no native counterpart. Its something i keep putting off and putting off, but maybe i should just add it at this stage. It would certainly be useful... maybe this weekend if i have time / motivation (tm)

Cheers, Ian

EDIT: fyi haxeui-core should also understand the following protocols: http://, https://, file://