11 posts / 0 new
Last post
sasij
sasij's picture
Offline
Mobile Conjurer
Joined: 2 Apr 2011
Posts:
UI Streamliner

I was wondering if anyone would be interested in a UI editor. Kind of like a more basic version of what visual studio has. I have been working on one due to bhagyavendras mention that there wasn't one. I thought to myself, no there's not and that would be useful. To have to spend almost no time at all creating an interface layout. Obviously you would still need to make the widgets do what you want on your own, but no time laying it out or programming the code for that layout would save time. So I started pecking away (several days after pondering it) and have a use able result finally. It's not really ready for a release but it does actually work. I can draw my ui in my app and export a .cpp file that i just make a new mosync project with. It compiles right away with no errors after adding MAUI.lib to project settings. You can view the ui on your phone immediately and it's waiting for you, the programmer, to add functionality to it all. I've attached a screen shot to show its current status. I plan to continue developing it for my own use but if people would have use for it I have no problem releasing it for everyone.

Currently has:
Edit resolution for several phone resolutions because everyone's developing for different screen sizes.
Edit Screen Orientation of backing rectangle to develop gui's for different orientations.
Supports Labels, EditBoxes,ListBoxes, Buttons almost done.
Exports ready to compile mosync code.
Saving and loading of gui's to a simple format made if you want to change it later.

Currently needs:
Add Combobox and Image widget functionality
Finish small portion of button widgets (drawing etc)
Add resize controls after they are placed
Add advanced editing of placed controls. (variable name in the exported code etc)
Undo\Redo

AttachmentSize
Dsc01962.jpg55.49 KB

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.
Sam Pickard
rival's picture
Offline
Mobile Archmage
Joined: 19 Mar 2009
Posts:

Ahh man, we need to get together. I'm finishing up my declarative UI system, so you can define your UI in XML and it will generate the screens at run time (along with downloaded resources, and CSS-like styles for widgets). You can even download a new XML during runtime, and completely repurpose your application. My next stage was to add code generation, so you can create static screens from XML declarations. I've had to make some changes to MAUI though, so it uses a custom version. My system also contains a lot of code for standard processing (like saving and loading form data, XMLDOM and XPath support, caching screens or destroying them after use to reclaim memory, persistent state for Apple compatibility, etc).

Ideally, what we need to do is get something like this as an Eclipse plugin, so you can view you screen code either as the UI designer or have a code view.

In short, I would be very interested in looking at this, seeing how the code is generated, and tying it up with my work. I'll PM you my Skype and we can have a chat (after I've dropped my son at school).

gretty
gretty's picture
Offline
Mobile Wizard
Joined: 27 Jan 2011
Posts:

Sounds cool, I would use this. Although one of the reasons I dont like coding in native android is because of the XML layout (but yes you can layout not using the XML) thing, its a real pain :P

Anders Malm
andersmalm's picture
Offline
Mobile Conjurer
Joined: 28 Aug 2008
Posts:

Hi Sasij

Thats sounds really interesting!
If you would like to release your editor as a public project we would be very happy to look at it and blog about it, giving it more spread. If you would make it open source it would be even better since other developers could help you evolving it. Seeing things like this, being developed by users of MoSync really makes me very happy! If you would like to share more info you can either write it here or send me a mail at anders(at)mosync.com.

There is a open source project at http://www.mobilelua.org which has something called the MobileLuaLive editor in which you can define a Native UI in a tree-like structure. The editor has a server running so by running the MobileLuaLive client program on a iOS or Android device the user can get an immediate result on the devices when working in the editor. This is done by sending LUA scripts to the device. This is still work in progress but for testing Native UI on iOS and Android it's a really mind-blowing experience. You can also write LUA code directly which can access, more or less all the functionality in MoSync. We have tried running the client on an Android device on the other side of the planet and the UI was updating in real-time. The editor can then export the code as either C++ or LUA source code. The C++ code can then be compiled directly in to your project and you will get the same result which the editor had.

We are also planning for a UI layer which will use either Native UI or MAUI depending on what phone and settings you are using so we get even more into the "one source code, many devices" thinking concerning UI in MoSync, but that work is still in a planning stage.

James Agada
James.Agada's picture
Offline
Joined: 22 Oct 2011
Posts:

had a look at mobilelua but not what i need. Where can I get the tools described by Sam and Sasij?

NotDifficult
NotDifficult's picture
Offline
Joined: 20 Jul 2011
Posts:

Hi Sam,

I found several links to your declarative-ui-example on appmancer.com, however, that page does not exist anymore. Did you stop working on that project?
Does(Ddid?) it work only for MoRE or also for Android environments?

Julian

Sam Pickard
rival's picture
Offline
Mobile Archmage
Joined: 19 Mar 2009
Posts:

Hi, I don't know how I missed this post until now. No, DeclarativeUI is not dead, it is being tested again and documented. It works for all UI platforms, as it creates AppMancer DualUI widgets. I will have something more concrete later this week.

m4rvin
m4rvin's picture
Offline
Joined: 11 Apr 2012
Posts:

just downloaded mosync today.

my thoughts on UI editor.

1. use Eclipse/ADT graphical editp

2. or use QT's ui designer

3. post process the resulting XML into C++ code - or to your own format

coding #3 would probably just take a week.

Sam Pickard
rival's picture
Offline
Mobile Archmage
Joined: 19 Mar 2009
Posts:

Hi, good ideas - there is an AppMancer project underway to convert Qt .ui files into AppMancer code, but MoSync has 5 UI technologies, so it may not be a week!

m4rvin
m4rvin's picture
Offline
Joined: 11 Apr 2012
Posts:

 

cool. i hope it gets out soon. even if only a subset of the components are supported. or if only Android & iOS are initially supported :)

bazzilic
bazzilic's picture
Offline
Joined: 16 May 2012
Posts:

Hi!

Any updates on this?

What I am actually interested in is a some kind of visual UI designer for native UI in HTML5 since HTML editors are unable to visualize it. Is there something of that kind?