Premature optimization is the root of all evil. – Donald Knuth
You’re probably aware by now that we made a lot of improvements in AppStudio 5. One thing we did not do right away was optimize everything. It’s safer to make sure the code is solid and stable before looking for all the ways to make it fast.
In 5.0.8 and 5.0.9, having identified the bottlenecks, we got to work on making the IDE fast. Some of these date back to very early versions of AppStudio: some from new features added since. It is quite possible that AppStudio 5 is now the fastest version we have shipped.
Here are some of the things we did:
AppStudio 5.0.9 is now available. It includes a number of speed improvements, especially for larger projects, plus some other fixes and new stuff.
- Code Window: Much faster. Lag between keystrokes on large projects eliminated.
- Script Window: Lets you display code, but no longer to modify it.
- Modal Forms: Overlay parameter fixed.
- Design Screen: CSS files work again.
- Samples: New OpenStreetMaps/Leaflet sample (Thanks, Adrian!)
- Controls: Tune Footerbar defaults.
- Controls: List control had a problem with empty list.
- Code Window: Fix intellisense not working all the time.
- Documentation: Offline Wiki files updated.
AppStudio 5.0.8 is now available. It includes a number of speed improvements, especially for larger projects, plus some other fixes and new stuff.
- Design Screen: Adding controls more than twice as fast.
- Project Explorer: Moving controls up and down about 8 times faster.
- Code Window: Intellisense for user functions much, much faster.
- ServerStorage: Docs for installing on your own server are now available.
- Controls: jqxGrid now handles % heights properly.
- Design Screen: Copy and Paste of Containers fixed.
- Design Screen: Zero value for designHeight, DesignWidth fixed.
- Project Explorer: Dragging and dropping sound files fixed.
- Design Screen: Scrollbar no longer appears when fullscreen is false.
- Controls: Select no longer shows gray circle for custom icon.
- Samples: New Swipe sample. (Thanks, Mike Burgher!)
- Localization: Thai is complete. (Thanks, Theprasit S.!)
In our last blog post, we looked at how the new AppStudio 5 Container control could be used to create your own controls. Today, we discuss how the Container can be used to group controls.
There are a few reason to do this:
- Controls in a Container can be moved around be moving just the Container
- Controls can be logically combined in groups.
- Controls can be visually linked by drawing a border around them.
- Controls can be grouped together for Responsive Design purposes.
Let’s see how this is done:
One of the new controls in AppStudio 5 is the Container. It has a couple of uses: you can create your own controls with it, or you can use it as a container for other controls. We’ll deal with the first use in this article.
First, a bit of background. Late in Version 4, we introduced a new Generic control. We realized that a lot more could be done with it, so for Version 5 we enhanced it and renamed it Container.
Any page of HTML is made up of Elements. The specifications for HTML define a few dozen Elements. Examples are Paragraph (“<p>”), Input (“<input>”) and Button (“<button>”). Each of these has a whole bunch of parameters, grouped by Classes, Attributes and Styles.
Controls (also called Widgets) are structures made up of one or more Elements, with their parameters defined to provide a particular appearance or behaviour.
What AppStudio essentially does is create fancy HTML pages by making it easy to set up these Controls, then let you use them in your program. The Container gives you a control with complete control over its appearance.
Want to test how your app will look without have to download to a device? Recent enhancements to Chrome make this possible. Now it’s easy to watch the affect of different screen sizes and rotation on your app – all within the Chrome Debugger.
Run your app locally as usual. It will get started in Chrome. Open the Chrome Debugger by hitting F12 (option-command-J on Mac). See the phone shaped icon in the tab bar?
AppStudio 5.0.7 has been released. It has some new features as well as important fixes.
Probably the most useful is that a message now pops up if there is a runtime error in your code. Before, there was no way to know whether there was an error without opening the Chrome Debugger.
You can turn this off with the new stopOnError project property.
Here is what else is new:
- Deploy: A message now appears if errors are encountered at runtime.
- Project Properties: New stopOnError property to hide runtime error messages.
- Controls: MsgBox appearance improved.
- Forms: Modal forms now have onhide and onshow events.
- EXE Files: Put on Start menu, not Startup files list.
- Code Window: False negative on location = fixed.
- DropBox: DataStore API is being deprecated by DropBox.
This update has improvements to Form bounds, plus a number of fixes.
- EXE files: Icon handling improved.
- Forms: Bounds now in a group
- Forms: Bounds can now be percent, “auto” or a value.
- Deploy: Code is only minimized when requested.
- Design Screen: extra time during startup allowed for.
- Controls: Minor path error in jqxDateTimeInput fixed.
The Project Explorer is the table of contents for your app. Whenever you add a Form or a Control to a Form, it gets added to the Project Explorer. You can include files in your app by dragging them into the Project Explorer: in AppStudio 5, we expanded the types of files which can be dragged in. Here’s a project with a lot of different types:
Styles are a powerful tool for shaping the appearance of your controls. To a large extent, AppStudio lets you avoid having to learn a lot about them: it just handles them for you. But if you want to do something special, it’s easy to add extra styling of your own.
The most common place to put a simple style rule is in the ‘style’ property of a control. This is very specific: it will only apply to that specific control. Where the concept of styles gets powerful is the ability to have style rules apply to groups of controls.
Posted in html, tips
Tagged Any ele