Hi everyone!
Today’s release adds support for skins which allow you to customize the look of built-in widgets. Other changes include new Alert, Shape and Switch widgets, along with a several other improvements and bug fixes. Read on for more details.
Skinnable widgets
Stencils are a good way to extend WireframeSketcher’s widget library with new widgets that better match the targeted user interface. There are stencils for iOS, Android and Windows Phone that provide UI elements for those platforms. One common problem with these stencils is that widgets that they provide are “dumb”. New widgets are usually constructed as groups of some primitives like lines, text and images. These widgets don’t have properties and don’t support smart text like built-in widgets do.
This release finally brings a mechanism for solving this problem. This is widget skinning mechanism that lets you to completely change the look of built-in widgets, while still keeping properties and smart text support.
Here are a few examples of what widget skinning can do. See what skinned Scrollbar, Slider, Tabs and Window can look like:
How widget skinning works? We tried hard to provide a mechanism that is as accessible as possible and is built around well known standards and skills. Skins are regular SVG image files with embedded JavaScript that are placed in your projects along with other assets. See skinning widgets documentation for more technical details.
Note that skinning mechanism is not meant to be used by everyone. This mechanism is there for stencil developers that can build new widgets and provide them to final users. Stencil developers need to have a good grasp of SVG, JavaScript and some WireframeSketcher internals. We’ll be using this mechanism ourselves to gradually migrate and improve existing stencils to use it.
If you are interested in developing some stencils for your company or for a wider public then please don’t hesitate to contact us. It is just the first release and we are looking into improving it based on your feedback.
New Alert, Shape and Switch widgets
This release also brings several new widgets: Alert, Shape and Switch. These widgets were added with skinning support in mind so that they can be re-used by stencils to provide specialized versions.
Alert widget lets you quickly add alert and message dialogs. Note how easy it is to create buttons by using smart text:
Shape widget brings a set of common shapes that support text and other common properties. At the same time Rectangle and Circle widgets were deprecated as Shape widget provides a much more flexible alternative:
Switch widget is there to represent toggles as are now found on all mobile platforms and in UI toolkits like GTK. Switch is also skinnable and can be customized to better match the target platform:
Other changes
- Added round border option for Button widget
- Added header toggle property for List widget
- Added automatic image refresh in editor on image change
- Changed “Clone Screen” action to include source screen as component instead of copying it
- Improved the look of Tabs widget and made it resizeable horizontally
- Disabled delete action for locked widgets
- Renamed “Export to HTML” action to “Share Online”
- Improved painting performance
- Removed “Advanced” button from new screen and storyboard wizards
- Fixed center alignment for widgets with “\n” in text
- Fixed the behavior of Image widget placeholder on resize
- Fixed the error sometimes occurring when overriding properties
Updating
To update to the latest version of WireframeSketcher use Help > Check for Updates, or just download it from our website.
The version number of this release is 4.1.0.
Enjoy!