This article presents a few of the new features coming in Axure RP Pro Version 5, which are included in the alpha release Shared Projects Preview.

• Scroll to Image Map Region (Anchors)
• Moving Dynamic Panels
• OnFocus and OnLostFocus Events

Here are links to the sample file and generated prototype that are discussed in this article.

Version5PreviewFeatures RP File (Opens in Shared Projects Preview version or later)
Version5PreviewFeatures Sample Prototype

Scroll to Image Map Region (Anchors)

The action to Scroll to Image Map Region allows you to scroll a page in response to an event like a user clicking on a link. You can choose to scroll the page horizontally, vertically or both to the location of an image map region.

In the page "Example 1" in the sample, we have created a list of topics that link to corresponding topic sections on the page.

We placed an image map region over the titles of each topic section that we want to scroll to. Then, we added a case to the OnClick event of each of the topic links with an action to "Scroll to Image Map Region", and specified the appropriate image map region.

The Select Image Map Region dialog allows you to select the Image Map Region and choose whether to scroll horizontally only, vertically only, or horizontally and vertically.

We also added "Top" links at the end of each section that scroll back to the Top of the page where the Help header is.

Moving Dynamic Panels

The Move Dynamic Panels action allows you to move a dynamic panel in response to an event like OnClick or OnMouseEnter. A common use of this feature would be to more easily prototype expanding and collapsing regions on a form.

In the page "Example 2" in the sample, we have created a survey form with optional questions that are shown and hidden based on answers to other questions. When the questions are shown, all of the questions beneath them are moved down. When they are hidden, the questions are moved back up.

On the page, we have Yes and No radio buttons next to the question "Were you traveling with children?". Beneath that is a dynamic panel labeled "Optional Question 1" panel (set to hidden) which includes the questions we would like to show and hide based on whether Yes or No is selected. Then, there is a dynamic panel labeled "Form 1" that contains the remaining questions on the form that will be moved up and down when showing and hiding the "Optional Question 1" panel.

The OnClick events on the Yes and No radio buttons have cases with actions to Show/Hide the "Optional Question 1" panel and move the "Form 1" panel down or up. For the Yes radio button, we added the action to show the "Optional Question 1" panel and the action to "Moved Panel(s)".

Clicking on the link for Move Panel in Step 3 of the Interactions Case Properties dialog, we selected "Move Form 1 to (x,y)" and enter the coordinates we would like to move the panel to. You can also choose to "Move widget by" a certain number of pixels to the left/right and up/down.

Within the "Form 1" dynamic panel, there are a few more dynamic panels that expand and collapse optional questions. It is important to note that the containing dynamic panel should be large enough to show all of the contained panels when they are moved.

OnFocus and OnLostFocus Events

The OnFocus and OnLostFocus Events allow you to perform actions when tabbing or clicking on to and off of form widgets (Text Field, Text Area, Droplist, List Box, Checkbox, Radio Button). In Example 2 of the sample, we added actions to the OnFocus and OnLostFocus events for the "Date of trip" fields to show and hide a dynamic panel containing a date formatting tip. This was also done for the three fields containing dollar amounts to show formatting tips.

Here are the links to this sample one more time:

Version5PreviewFeatures RP File (Opens in Shared Projects Preview version or later)
Version5PreviewFeatures Sample Prototype

We hope you get a chance to try out these features and the other features included in this preview release. Let us know what you think!  Please report any issues you might find to support@axure.com or in the forums.  Enjoy!