DRAGGABLE SCROLLING FOR IPHONE APPS

SCROLLING CONTENT TUTORIAL OVERVIEW

Resize the dynamic panel from the bottom to fit above the music controls.

Step 3: Size the panel

First, open AxureiPhoneApp.zip and open the iPhoneApp-ScrollingContentTutorial.rp file.

 

Drag a paragraph to the center of the app layout and align the top below the image widget. Copy and paste the text so the text will go beyond the bottom controls.

Step 1: Position the text

Convert the text into a dynamic panel by right-clicking it and selecting Convert > Convert to Dynamic Panel.

Step 2: Convert

text to dynamic panel

Right-click on the dynamic panel and select Scrollbars > Show Vertical Scrollbars As Needed.

 

Test it out by generating to your desktop or view the prototype on your iPhone.

Step 4: Add

scrollbars as needed

Positioning the text to make scrolling content for iPhone apps.

Convert the text in your iPhone app.

Resize the text in your iPhone app prototype.

Add scrollbars to the dynamic panel to make scrolling text.

© 2002-2016 Axure Software Solutions, Inc. All rights reserved. Axure is a registered trademark of Axure Software Solutions Inc.

u35_start u35_end u35_line

Instead of building your iPhone App as a long page, put your content inside of a scrolling dynamic panel. iPhone Apps frequently have a static header and/or footer which stay. You can make the main content scrollable by putting it in a dynamic panel. Using headers and footers that are "pinned to the browser" is another option, but the scrolling dynamic panel technique gives you more control over the visible areas of your iPhone App, and lets you take advantage of the "Prevent Vertical Page Scrolling/Elastic Scrolling" setting in the Generate > Prototype dialog. This example uses text content, but the content of the panel could be anything.

We gotta say it... let the good times scroll!

DOWNLOAD

u50_start u50_end u50_line
u52_start u52_end u52_line
u54_start u54_end u54_line

Still need help? Check out the forum or drop us a line at support@axure.com.

THE ROUNDUP

IPHONE APP TUTORIAL & TRAINING ARTICLES

Scrolling Content Tutorial

u73_start u73_end u73_line

MORE IPHONE APP TUTORIALS & TRAINING ARTICLES ::

This zip contains the iPhone App Template and files to complete the iPhone app tutorials

This is an archived Axure 7 training resource. You can update to Axure 8 for free at www.axure.com/update.