Jump to content
jarto

New Visual Designer for Smart Mobile Studio

Recommended Posts

Hi all,

as you have probably noticed, we've been a bit quiet lately. That's because we've been hard at work on exciting new changes and features to Smart Mobile Studio. I'd like to share with you, what we're doing to the Visual Designer.

image.png

We're rewriting the Visual Designer from scratch. This new one is completely WYSIWYG as it's actually a Smart Mobile Studio app itself, running inside the IDE in Embedded Chrome. This lets us accurately show what components look like, instead of the dull old boxes in the old designer. You can set Align, Anchors, Angle and any other property and they are accurately reflected in the component in the Designer - like the blue panel (Align Top) or the rotated List box.

The new designer also lets us support non-visual components, which will add a number of new components into our component palette. TW3Timer was the first one to be added and it already works just like in Delphi.

We'll also be able to expand the concept into a full featured Multi Device Designer, so you could design forms for multiple devices, multiple screen sizes and multiple themes.

The Designer also has support for Wizards and Component specific designers, so you'll be able to design popup menus in a Menu Designer and all the tabs in the Tab Control.

Share this post


Link to post
Share on other sites

My most significant challenge, I find, is making a webpage/app properly responsive. The tlayout is not inuitiove and has weird side effects. Will the new designer make it easier to create responsive programs?

 

Also, side thought, the css is pretty extensive but also difficult and resistant to reskinning for a different look/feel.

Share this post


Link to post
Share on other sites
7 hours ago, Czar said:

My most significant challenge, I find, is making a webpage/app properly responsive. The tlayout is not inuitiove and has weird side effects. Will the new designer make it easier to create responsive programs?

 

Also, side thought, the css is pretty extensive but also difficult and resistant to reskinning for a different look/feel.

The new designer does automatically support Align and Anchor, which makes creating responsive apps easy. On top of that, you'll be able to tweak the form for different screen sizes.

 

Share this post


Link to post
Share on other sites
On 9/18/2019 at 5:29 PM, jarto said:

We're rewriting the Visual Designer from scratch. This new one is completely WYSIWYG as it's actually a Smart Mobile Studio app itself, running inside the IDE in Embedded Chrome. This lets us accurately show what components look like, instead of the dull old boxes in the old designer. You can set Align, Anchors, Angle and any other property and they are accurately reflected in the component in the Designer - like the blue panel (Align Top) or the rotated List box.

 

Interesting decision to move away from Delphi, you'll probably loose something in the process but it has great potential. When can we expect a preview?

BTW would it then be possible to make SMS an online application?

Share this post


Link to post
Share on other sites
11 hours ago, IgorSavkic said:

 

Interesting decision to move away from Delphi, you'll probably loose something in the process but it has great potential. When can we expect a preview?

BTW would it then be possible to make SMS an online application?

Technically, we are not moving away from Delphi. We are just creating one component (the designer) as an html5 app. The rest of the IDE will still be Delphi code. Eventually it could be possible to rewrite the whole IDE as an online application (+server) but that's not something we are attempting to do right now.

When it comes to the new designer as an SMS app, we actually don't lose anything. As far as I can see, there are only advantages. There were many disadvantages in having the designer as a Delphi component. Getting the look right even with standard components was very hard. Supporting anything more complicated was impossible. When the Designer is an SMS app, we only have to create the component and it automatically looks right, no matter what theme is used or how complicated the component is or what properties it happens to have.

The hard part is only the communication between the IDE and the new designer. That's done using Websockets and it already works well. So I can add a component in the new designer and it shows up in the IDE's component list and the Object Inspector. I can move the component and see the coordinates changing in the Object Inspector. I can change properties and they are reflected in the new Designer. And if I compile and run the app I drew in the new designer, well, it works.

I can't tell yet, when I can push out the first alpha. There are still some things that need to be taken care of. For example, we need to finish updating the IDE to use a newer Chrome component. Also, I want to write a few editors to make sure that the new designer has propert support for more complicated controls.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×