Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Adobe AIR Development

Reply
Developer
Posts: 193
Registered: ‎12-29-2010
My Device: Bold 9900
My Carrier: Rogers
Accepted Solution

Going back to main page

Hey,

 

I've seen a couple of posts related to navigating to new posts, and while I have the basic gist down, I'm having some problems in going back to the main page from my 2nd page.

 

So the first page is called Unit and here is the code:

 

 

package
{	
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.filesystem.File;
	import flash.text.TextField;
	import flash.text.TextFormat;
	
	import qnx.dialog.*;
	import qnx.display.IowWindow;
	import qnx.events.DialogEvent;
	import qnx.ui.buttons.Button;
	import qnx.ui.buttons.IconButton;
	import qnx.ui.data.DataProvider;
	import qnx.ui.display.Image;
	import qnx.ui.listClasses.DropDown;
	import qnx.ui.text.Label;
	
	[SWF(width="1024", height="600", backgroundColor="#cccccc", frameRate="30")]
	public class Unit extends Sprite
	{

                private var currentView:String = "mainWindow";		
		private var backgroundBlack:Boolean = true;
		
		public function Unit()
		{	
			drawMainWindow();
		}
		
		
		private function drawMainWindow():void {
			clearWindow();
			this.currentView = "mainWindow";

                        createBackground();

                        var distanceButton:IconButton = new IconButton();
			distanceButton.setSize(BUTTON_WIDTH,BUTTON_HEIGHT);
			distanceButton.addEventListener(MouseEvent.CLICK, clickDistanceButton);
			distanceButton.x = 47;
			distanceButton.y = 100;
			addChild(distanceButton);
			
			stage.nativeWindow.visible = true;			
		}
		
		
		private function clickDistanceButton(event:MouseEvent):void {
			clearWindow();
			var distanceScreen:distance = new distance();
			addChild(distanceScreen);
		}
		
		private function clickHomeButton(event:MouseEvent):void {
			clearWindow();
			drawMainWindow();
		}
		
		
		public function createBackground():void {
			var appBackgroundImage:Image = new Image();
			  if(backgroundBlack){
				appBackgroundImage.setImage(File.applicationDirectory.resolvePath('backgroundBlack.png').url);	
			
			appBackgroundImage.setPosition(0,0);
			addChild(appBackgroundImage);
		}
		
		
		//Clears the window
		private function clearWindow():void {
			while(numChildren > 0) {
				removeChildAt(0);
			}
		}
		
		
	}
}

 

 

Now my second page called "distance.as" is as follows:

 

 

package
{	
	import flash.display.Sprite;
	import flash.events.MouseEvent;
	
	import qnx.ui.buttons.IconButton;
	
	//[SWF(width="1024", height="600", backgroundColor="#cccccc", frameRate="30")]
	public class distance extends Sprite
	{
		public function distance()
		{
			drawDistanceWindow();
		}
		
		public function drawDistanceWindow():void {
			
			
			//Home Button - take back to main app screen.
			var homeButton:IconButton = new IconButton();
			homeButton.addEventListener(MouseEvent.CLICK, clickHomeButton);
			homeButton.setSize(48,48);
			homeButton.setIcon("homeIcon.png");
			homeButton.x = 929;
			homeButton.y = 15;
			addChild(homeButton);
		}
		
		
		private function clickHomeButton(event:MouseEvent):void{
			clearWindow();
			var homeScreen:Unit = new Unit();
			addChild(homeScreen);
		}
		

		
		//Clears the window
		private function clearWindow():void {
			while(numChildren > 0) {
				removeChildAt(0);
			}
		}
		
		
	}
}

 

 

When I click the "homeButton", the screen goes to gray, and doesn't actually add the new homeScreen.

 

Any clue?

 

 

Also, at the same time, you'll notice that my first page "Unit" has a function called "createBackground".

 

I want to be able to access the function from my second page (titled: distance.as). How can I do that?

I don't want to rewrite the code again, and so it'd be better if I can just access the function (createBackground) from my second page.

 

If I do: Unit.createBackground()....this gives me an error.

 

Any help would be great!

 

Thanks!

 

 

Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: Going back to main page

[ Edited ]

 

You have a lot going on here.  It is best to keep the pages neutral from one another.  For example, your clearWindow discards everything about it.  I use the root Sprite as the main playing area that controls the pages that might be displayed in it.  I dont allow a page to know about each other, but if a page needs to show another page, it requests that from the root Sprite who will do the work.  I dont destroy a page, I just add/remove and move it as requested.  For example (psedo code):

 

public class MyApp extends Sprite
{
  private var unit_page     : Unit = new Unit();
  private var distance_page : Distance = new Distance();

  public function MyApp()
  {
    this.addChild( this.unit_page );
    this.stage.nativeWindow.visible = true;
  }

  private function ShowDistancePage() : void
  {
    this.removeChild( this.unit_page );
    this.addChild( this.distance_page );
  }

  private function ShowUnitPage() : void
  {
    this.removeChild( this.distance_page );
    this.addChild( this.unit_page );
  }

}

I use a singleton class EventDispatcher to allow pages to communicate to the root Sprite (if you dont know what that is, I will post code for you).

 

To animate the pages, you can use Tweener to move the page.  I posted some code a day or so ago that encapsulate page turning as well as some others have too.

 

Hope that helps.

Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: Going back to main page

Highlighted
Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: Going back to main page

[ Edited ]

Here is a singleton class dispatcher in case you were not cetain what that was:

 

public class SharedData extends EventDispatcher
{
  private static var _instance          : SharedData = null;

  ///////////////////////////////////////////////////////////////////////
  public function SharedData(target:IEventDispatcher=null)
  {
    super(target);
  }

  ///////////////////////////////////////////////////////////////////////
  public static function get instance() : SharedData
  {
	if( _instance == null ) // first time
	{
		_instance = new SharedData();
	}
	return _instance;
  }

  // ...
}

 

 

The singleton gets added to each class/page/what ever that needs to share information or communicate between pages:

 

private var shared_data : SharedData = SharedData.instance;

 

To send a message, from one page:

 

this.shared_data.dispatchEvent( new Event( 'showpage1' ) );

// typically I define a public static const in the singleton class for the event id

 In the main root Sprite, it listens for this event (no matter who requests it ):

 

this.shared_data.addEventListener( 'showpage1', ShowPageOne );

// ....

private function ShowPageOne( event : Event ) : void
{
  // show page 1
}

 

Developer
Posts: 193
Registered: ‎12-29-2010
My Device: Bold 9900
My Carrier: Rogers

Re: Going back to main page

[ Edited ]

EDIT: I guess I should have hit the refresh button.

Thanks!

 

 

Hey jtegen,

 

Thanks for you reply. I'll try doing that and let you know the results.

 

Can you provide more info on the singleton class EventDispatcher? I don't know what the means. Is it just one single event listener for the whole app?

 

G

Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: Going back to main page

An EventDispatcher is a flash class that allows events to be posted and listened to.  Buttons are EventDispatchers, lists, etc.  A singleton is an object-oriented design pattern (one of many). Think of a singleton class as a "bridge" between anything that can be linked together.  Without a singleton, references to other objects has to be passed around.  The singleton can have a single reference with anyone who wants to communicate across that "bridge" with events.  The other nice thing about the singleton is that it can retain state information.  For example, I hold preference information in the singleton class.  It gets loaded at startup, views use it as needed, and if there is a view that changes the state of the preferences, there is one place to get it.

 

Hope that helps.

Developer
Posts: 6,473
Registered: ‎12-08-2010
My Device: PlayBook, Z10
My Carrier: none

Re: Going back to main page

A singleton could also be described as just a reasonably clean way to deal with some global data.  The name "singleton" refers to the fact that only one instance of it can exist, often enforced by subtle trickery involving language-specific mechanisms.


Peter Hansen -- (BB10 and dev-related blog posts at http://peterhansen.ca.)
Author of White Noise and Battery Guru for BB10 and for PlayBook | Get more from your battery!
Developer
Posts: 193
Registered: ‎12-29-2010
My Device: Bold 9900
My Carrier: Rogers

Re: Going back to main page

[ Edited ]

Hi,

 

Deleted old post. See new post below.

 

G

Developer
Posts: 193
Registered: ‎12-29-2010
My Device: Bold 9900
My Carrier: Rogers

Re: Going back to main page

[ Edited ]

Hey,

 

So I've followed your way, which makes some sense now.

 

This is what I have so far.

 

my MainWindow.as class:

 

 

package
{
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	
	import qnx.ui.buttons.IconButton;
	import qnx.ui.display.Image;


	public class MainWindow extends Sprite
	{	
		
		private var shared_data:SharedData = SharedData.instance;
		
		public function MainWindow()
		{
			drawMainWindow();
		}
		
		public function drawMainWindow():void {
			
			// Main title image
			var mainTitle:Image = new Image();
			mainTitle.setImage("unitConverterTitle.png");
			mainTitle.x = 320;
			mainTitle.y = 7;
			addChild(mainTitle);
			
			var distanceButton:IconButton = new IconButton();
			distanceButton.addEventListener(MouseEvent.CLICK, clickDistanceButton);
			distanceButton.setSize(150,100);
			distanceButton.x = 47;
			distanceButton.y = 100;
			addChild(distanceButton);
			
		}		
		
		private function clickDistanceButton(e:Event):void {
			this.shared_data.dispatchEvent(new Event('showDistancePage'));
		}
	}
}

 

 

 

 

I get an error:

 1042: The this keyword can not be used in static methods. It can only be used in instance methods, function closures, and global code.

 

So that is where I'm stuck.

 

 

Thanks.

 

 

Developer
Posts: 193
Registered: ‎12-29-2010
My Device: Bold 9900
My Carrier: Rogers

Re: Going back to main page

[ Edited ]

I figured it out after 5 freakin' hours!

Arrrgghh....Smiley Tongue

 

 

Thanks so much for your help guys!