Adobe AIR Development

[AmonRaHR]

hi all,

i manage to port sample WeatherGuesser from FDT to Mobile AS Application and it works.

But How to port that into Flex Mobile application.

I'd like to use native look of action bar, back and all of that.

is there any chance to accomplish that.

Thanks,

Vedran

[jtegen · Accepted solution]

Any QNX control has to be wrapped into a Flex control to be included in MXML. It works fine as an AS3 control.

[AmonRaHR]

Thanks

[AwesomeDev]

Hi Jtegen

How do you wrap a QNX control into a flex control? thanks

[jtegen]

I have never done it, because I stay with AS3 which is a little more portable, but I've been told is to add the QNX control into a MXML UIComponent.

[AmonRaHR]

Like This: 

<fx:Script>
<![CDATA[

import qnx.fuse.ui.progress.ActivityIndicator;

private var myActivity:ActivityIndicator = new ActivityIndicator();

private function init():void {
myActivity.width = 150;
activity.addChild(myActivity);
myActivity.animate(true);

}


]]>
</fx:Script>


<mx:UIComponent id="activity" top="50" left="150"/>

[agaripian]

Were you able to configure the Action Bar to like the Native BB10 navigation bar/ buttons etc?
I would like to do this using the Flex Mobile Application as well - I need to use MXML components with QNX.. I cant seem to add MXML components to the Weather Guesser sample witch is strictly an actions sctript mobile project.

[AmonRaHR]

You can do it like this: 

imports and variables:

import qnx.fuse.ui.actionbar.ActionBar;
import qnx.fuse.ui.core.Action;
import qnx.fuse.ui.core.TabAction;
import qnx.fuse.ui.events.ActionEvent;
import qnx.fuse.ui.core.MultiSelectAction;

import mx.core.UIComponent;

// Create Action Bar
private	var appActionBar:ActionBar = new ActionBar();

then on creationComplete call some function for me is init():

//Set component
var ab:UIComponent = new UIComponent();
ab.left = ab.right = ab.bottom = 0;
ab.height=140;
				
// Add event listeners
appActionBar.addEventListener(ActionEvent.ACTION_SELECTED, ActionSelected );
				
// ActionPar Preferences
appActionBar.removeAll();
appActionBar.reserveActionSpace(true);
appActionBar.showTabsFirstOnBar( false );
appActionBar.enableBackButtonDrag = true;
				
// Populate action bar
appActionBar.backButton = new Action( 'Back', null, {id:'back'} );
//appActionBar.addAction(new MultiSelectAction("MultiSelect", new Assets.BTT_LOGIN(), {id:'brisi'} ) );
appActionBar.addAction( new Action( 'Login' , new Assets.BTT_LOGIN(), {id:'login'} ));
appActionBar.addAction( new Action( 'SingUp', new Assets.BTT_SIGNUP, {id:'singup'} ));
appActionBar.addAction( new Action( 'Account', new Assets.BTT_SIGNUP, {id:'account'} ));
appActionBar.addAction( new Action( 'Information', new Assets.BTT_INFO, {id:'info'} ));
				
//Add ActionBar on component AND place on stage.
ab.addChild(appActionBar);
this.addElement(ab);

 you need some function to handle clicks (see event listener above):

			private function ActionSelected(e:ActionEvent):void {
				/***
				 * by Vedran Tomičić 
				 * Rijeka, 26.10.2012
				 * 
				 * Ova funkcija služi za hvatanje akcija kada se tapne po action Bar-u
				 * Koristimo Switch funkciju.
				 * 
				 * 
				 * */
				if(e.action.data!=null) {
					switch(e.action.data.id){
						case "back": {
							navigator.popView();
							break;
						}
						case "login": {
							navigator.pushView(Login);
							break;
						}
						case "singup": {
							navigator.pushView(SignUp);
							break;
						}
						case "account": {
							navigator.pushView(Account);
							break;
						}
						case "info": {
							navigator.pushView(Info);
							break;
						}
					}
				}
			}	

 thats it, you will have action bar on your mxml file.

backButton drag not work here but tab button drag works ok .

[agaripian]

Wow I can't thank you enough!! Thats a great start for me!

I still could not get get the BackButtonDrag working. You indicated that wont work in your post.. Do you have any examples on how you got this working?

appActionBar.enableBackButtonDrag = true;  Flash Builder cant find (enableBackButtonDrag on ActionBar) 

Also there isnt much documentation on this!

Thanks again for all the help!!

[jtegen]

I tried setting that to true myself and saw no changes. I'm not even certain what it is suppose to do. Maybe after the next SDK update, that might do what ever it is suppose to do.