ForeUI is an easy-to-use UI prototyping tool, designed to create mockup / wireframe / prototypes for any application or website you have in mind.

Archive for April, 2010

ForeUI V2.22: Nesting Mechanism and Enhanced Table


Hello everyone, tomorrow is the one-year birthday of ForeUI!¬† So today’s release (V2.22) must be a big one ūüôā

Although the version number is not increased so much, this version is¬†really a major milestone.¬† From¬†this version, a brand new “Container” concept is introduced into ForeUI,¬†that means¬†we¬†can embed element into another one.¬†¬†

Container for Nesting

Table Element becomes container now, you can press right key to drag another element into the table cell.

The embedded elements really belong to the container table, if you set the table scrollable and run the simulation, the embedded elements will be scrolled together:

The embedded elements are still selectable, so you can still tweak the elements even if they are embedded into the table cell. 

You can also extract the embedded element from the container by clicking the  button in the floating tool pane. 

Element Group can also work as a container, you can select the member in group and adjust its properties without ungrouping the Group.¬† That’s really convenient ūüėČ

Brand New Table Editor

This version also bring us a brand new table editor, which allows you to specify the table row height and column width.

You can drag the header to resize the column or row, you can also double click the header to toggle the sizing policy.¬† The default sizing policy of column width is “auto”, which means allocate the size according to the content.¬† The default sizing policy of row height is¬†“fixed”, which will use the default table row height.

In the editor you can also add/remove any row or column.  You can hold the Ctrl key to select multiple cells and manipulate them.

What’s more, you can also specify the cell alignment respectively.¬† If no cell alignment is specified here, the default table alignment will be used.

Fixed Bugs:

  • Bug_0185: Line element can not be rendered correctly in IE if the element width or height less than 20.¬† (Thank pohldoug for reporting)
  • Bug_0186: Should not hide the text editor when clicking its semitransparent border.
  • Bug_0187: In Mac OS, press CMD+R to launch simulation. When return to the application, the element selecting is not working properly.

Edit on 2010-04-28:

We have released an unoffical update V2.23 for bug fixing purpose.  Details here:

ForeUI V2.20: Zoom In and Zoom Out

Hi everybody, it is Monday again ūüôā¬†¬†¬†This time we bring you the zoom in/out feature, which will help you a lot when you want to tweak the details of the wireframe or preview¬†the whole¬†design.¬†¬† The V2.20 also contains some enhancements and bug fixings (see below).

Zoom In / Out

This feature is requested by Jeffrey Werner about 6 month ago, and we also received similar requests from other channels (email, twitter etc.).  Now you can choose the zooming scale from the list at the bottom right corner, you can also input any percentage value for zooming:

 It is also possible to change the current zooming scale from the menu:

As you can see in the popup menu, you can use hotkeys to change the scale as well:

  • Ctrl =: Zoom In (Cmd = in Mac OS)
  • Ctrl -: Zoom Out (Cmd – in Mac OS)
  • Ctrl 1: Zoom to 100% (Cmd 1 in Mac OS)
  • Ctrl 2: Zoom to 200% (Cmd 2 in Mac OS)
  • Ctrl 3: Zoom to 300% (Cmd 3 in Mac OS)
  • Ctrl 4: Zoom to 400% (Cmd 4 in Mac OS)
  • Ctrl 5: Zoom to 50% (Cmd 5 in Mac OS)

Smartly Update Custom Event Name

This is quite useful enhancement.  When you duplicate an element with some custom event handlers defined, if the custom event name contains the id of the element, the id part will be replaced with new id automatically.

This is quite useful if you need an element has its exclusive custom event:  just use the element id as prefix of the custom event name.  You can pack such an element into custom element, thus it can always handle its own event, no matter how many instances are created.

Here is an example.¬† It is an interactive slider element (you can download it from the community).¬† It has its exclusive custom event “TextBox_Slider_AdjustPos”, which starts with the element id “TextBox_Slider”.¬† So you can create as many instances of it¬†as you want and they will not interfere each other.

Text Editor Placement

In previous versions, the text editor for editing text element is not allowed to exceed the bounds of the plot.¬† That’s not reasonable and inconvenient.¬† Now we improve it a little bit and don’t restrict the text editor placement so tough:

Other Enhancements:

  • Ajust the text positioning for all text elements.
  • Do not bring the progress window to top when exporting in progress.¬† (Thank Remco Douma’s suggestion)
  • Show warning message when trying to load a plot created by higher version.¬† (Thank Tim’s suggestion)

Fixed Bugs:

  • Bug_0180: Set the date of Calendar element to the last day of the month, all buttons after the date will be filled incorrectly.
  • Bug_0181: Arrow Line element is not rendered properly in simulation.¬† (Thank Jeremy Kerr for reporting)
  • Bug_0182: TextBox with initial invisible state can not really become visible via “Change Visibility” action.
  • Bug_0183: Add custom element to user-defined element category and restart the software, the category will be lost.¬† (Thank pohldoug for reporting)
  • Bug_0184: “Set Global Cursor” action does not work for Rectangle and some other elements since V2.17.¬†¬† (Thank Jeremy Kerr for reporting)