Adaptive views allow you to convert a design from one screen size to another without having to create different versions of the pages. This is done by resizing, restyling, and rearranging widgets so they fit on the respective adaptive view. In short Adaptive views allows you to create responsive designs for the pre-defined adaptive view in Axure RP.

Click the canvas to focus the page, then click Add Adaptive Views in the Style pane. You can choose from your existing sets or create a new one.
You can also click the Add Adaptive Views button on the Style toolbar.
If you have a set of adaptive views created already, you’ll be asked to select the existing adaptive views or create a new one from the adaptive Layout dialog.

How to create and manage adaptive views in Axure RP?

Adaptive views can help you keep your content aligned across multiple devices, such as desktop computers and mobile devices. To create an adaptive view, click Add Adaptive Views at the top of the Style pane, or on the Style toolbar or click Project → Adaptive Views Set on an empty page, select one of the existing sets, or create a new one.
To add an adaptive view, you will need to go to the left at the top of the dialog and click ‘Add’. There, you can select one of the system defined presets or create your own preset.
Fields that are available in the view:
Presets: Axure-defined system preset views
Name: Name of the view
Width: Width of the view
Height: Height of the view
Inherit from: Select the previously created view that you would like to inherit from. This field remains disabled if you have not created at least one adaptive view.
A parent view is automatically selected in the inherit from the dropdown for a new view but you can change the dropdown value and select a preferred one.

How to edit an existing adaptive view in Axure RP?

To edit an existing adaptive view in Axure RP, click on Edit Views at the top of the Style pane, update the values as per your requirement and click the OK button to save it.

How to remove an existing adaptive view in Axure RP?

You can remove adaptive views from a page in Axure RP by clicking Remove Views from the top right of the Style pane OR by clicking the Remove Views from the Style toolbar.

Recommendation: If you need content that’s specialized for different platforms, you can design inheritance chains to suit your needs. For example, separate chains for mobile devices and desktop browsers.

Recommendation: We always recommend you follow the top-down approach while working with the adaptive views. Start from the base view and keep on updating the child’s views.

Adaptive widget properties

• Visual styling
• Size, and
• Position of widgets

Non-adaptive widget properties

Making changes to the following properties on a widget in one view will also affect all other views.

• Widget text
• Notes, and
• Interactions/interactive properties.

Non-adaptive special widget properties

• Droplist
• The rows and columns in a table widget, and
• The nodes in a tree widget.

Recommendation: When you need a different view of a nonadaptive property amongst adaptive view, create an additional copy of the widget for each adaptive view, and then apply the unplace feature which will decide – based on your needs – which version of the widget appears in each view.

Recommendation

Use the filter to select Placed and Unplaced to see both the placed and unplaced widgets in the Outline pane.

LESSON

It will delete the widget from all the views if you:

• Delete a widget from the base view
• Delete a widget from any view if Affect All Views is checked.

How to Place an unplaced widget in the current view?

To place an unplaced widget in the current view, right-click it from the Outline pane and select Place in View.

How to delete a widget from all views?

You can also delete a widget from all the views. To do so, right-click on the widget and select Delete from All Views. This will delete the widget from all the views.