In this post I will talk about managing views with the ViewNavigator (handling pop and push of Views), passing and persisting data across views, popping back multiple Views and overriding the default transition or using custom transitions when popping and pushing Views. So in my latest mobile project I used different types of Views for different screens in the application. The main reason for this is to make sure the correct type of interaction is offered to the user for that screens content.
ViewNavigatorApplication
OK since Adobe’s announcement today (11/04/2011) of CS5.5 updates, i thought its time to update my post on Flash Builder 4.5 views. I will be updating this quite a lot of the next couple of months once I get to play around with it more and as the SDK becomes widely available amongst more developers im sure we will see great things developed using Flash Builder.
So what is a view? well a view in its simplest form is a what the users sees on the screen, each view can pass data between each other as the user navigates through your application. There are many ways to pass the data around the views this can involve storing your data in a Shared Objects, which can be used within the application or you can manually pass Objects from view to view. As I state the views contain all the content on the screen this being said when the user rotates the screen the view automatically handles the layout of the objects on the screen and adjusts accordingly.
When designing an application you can use the ActionBar which sits above the view of the application and contains buttons (that in my case are using to save and navigate from view to view) also you can see from my image below the ActionBar also holds the title for that particular view.
The ViewNavigator is the simplest type of navigation to use, the application will load the first view which you specify once loaded on the view, you can design your application to push and pop to different views (like the names suggest push refers to pushing a new view on top and pop refers to popping the view out of the stack).
ViewNavigatorApplication offers the project a basic structure for the initial screens of the application, the benefits to this type of view is based around the amount of screen real estate you save. This is only beneficial to adopt when you need more space on the screen or there isn’t many screens to interact with.
The ActionBar (across the top of the screen), used for a title customised for the current information displayed, a navigation button to go back to the first screen and buttons for actions related to the current screen.
TabbedViewNavigator
Like TabbedViewNavigator suggests it offers tabs to the view navigator. As you can see this takes up quite a lot of space on the screen, but is equally important if you want the user to easily navigate from view to view in a timely manner.
Pass data between views
The are many different ways to pass data from views, in this post I will talk about storing data in objects and passing the objects from view using the pushView(), the devices sharedObject and SQLite database.
The easiest way is to store all you data in an Object and pass via the pushView
navigator.pushView(views.VIEW_NAME, OBJECT_NAME,null,null);
in the example the pushView takes four parameters the first being the view you wish to push to, the second the object you want to pass, context object and the type of transition.
Sometimes this isn’t always the best way to pass data, in this project I found issues passing the object from a standard View to a tabbedView (for some reason the object wasn’t being passed), also another issue with passing objects from View to View is that if you popView (go back to a previous view) you have to remember to pass the object back else the view wont be able to capture that objects data.
sharedObjects have been around for many years in mobile (this is a small area where you can sae persistant data to the devices memory). SharedObjects can be used to store usernames, passwords, settings, game states etc…. In this project I used the SQLite database to hold all the data input for the application and stored the database name in the shardObject this was i could pass from View to View and not worry about making sure the database was passed each time as i had it stored in the devices sharedObject.
sharedObject
sharedObj = SharedObject.getLocal("SHARED OBJECT NAME");
poppingViews/replacingViews
Similar to pushingViews replacing and popping views take four parameters (view name, object, context object, transition).
navigator.replaceView(views.HomeView,null,null,globalVar.xFadeTrans);
View Transitions
This is an important aspect when dealing with UX, you want to make the experience as nice as possible to the user, by allowing you to change the type of transition you can offer the user a different visual appearance to your application.
globalVar.xFadeTrans.duration = 500;
ACM Digital Library
