Flex Mobile - Preventing the Back Button Event Android

Hi Guys,

There are many occasions when you would like to prevent or override default back button event for android devices. One of them is say when your present user with a login screen and they log in successfully and then you push a target view to the view stack, what if someone press hardware back button? Some questions that may arise in this situation is if you are offering in built session support or something equivalent to “remember me” functionality what happens? I guess user log-in View is shown again because the hardware Back button behaves a little bit different to your in view “popView” handler.

To prevent the default Back button event is really simple?

Override backKeyUpHandler function of your ViewNavigatorApplication

Here is how its done:

In your application main file enter the following code

[geshi lang=”mxml” nums=”1″ target=”_self” ]

override protected function backKeyUpHandler(event:KeyboardEvent):void
			{
				event.preventDefault();
			}

override protected function backKeyUpHandler(event:KeyboardEvent):void

{

event.preventDefault();

}

Above code is enough to stop default event to occur.

Even better what If you would like to ask your user a question (when they hit hardware back key say) “do you want to Exit this application?” how you go about this?

Lets find out how?

To start with create a SkinnablePopUpContainer and save it as PopUp.mxml under your components package or may be anywhere you like.

[geshi lang=”mxml” nums=”1″ target=”_self” ]

<?xml version="1.0" encoding="utf-8"?>
<s:SkinnablePopUpContainer xmlns:fx="http://ns.adobe.com/mxml/2009"
						   xmlns:s="library://ns.adobe.com/flex/spark"  backgroundAlpha="0.5" backgroundColor="0x000000" width="90%" >
	<s:Panel title="Alert" horizontalCenter="0" verticalCenter="0" width="90%" >
		<s:VGroup horizontalAlign="center"
				  paddingTop="8"
				  paddingBottom="8"
				  paddingLeft="8"
				  paddingRight="8"
				  gap="10"
				  width="100%">
	<fx:Script>
		<![CDATA[

		private function onClick(close:Boolean):void {
				if(close)
					NativeApplication.nativeApplication.exit(); // Important bit
				else
					this.close();
		}

		]]>
	</fx:Script>

	<s:Label text="Exit Application?" width="100%" textAlign="center" paddingTop="40" color="#000000"/>

	<s:HGroup width="100%"  paddingTop="60">
		<s:Button label="Yes" width="50%" click="onClick(true)"/>
		<s:Button label="No" width="50%" click="onClick(false)"/>
	</s:HGroup>
			</s:VGroup>
	</s:Panel>
</s:SkinnablePopUpContainer>

<?xml version="1.0" encoding="utf-8"?>

<s:SkinnablePopUpContainer xmlns:fx="http://ns.adobe.com/mxml/2009"

xmlns:s="library://ns.adobe.com/flex/spark" backgroundAlpha="0.5" backgroundColor="0x000000" width="90%" >

<s:Panel title="Alert" horizontalCenter="0" verticalCenter="0" width="90%" >

<s:VGroup horizontalAlign="center"

paddingTop="8"

paddingBottom="8"

paddingLeft="8"

paddingRight="8"

gap="10"

width="100%">

<fx:Script>

<![CDATA[

private function onClick(close:Boolean):void {

if(close)

NativeApplication.nativeApplication.exit(); // Important bit

else

this.close();

}

]]>

</fx:Script>

<s:Label text="Exit Application?" width="100%" textAlign="center" paddingTop="40" color="#000000"/>

<s:HGroup width="100%" paddingTop="60">

<s:Button label="Yes" width="50%" click="onClick(true)"/>

<s:Button label="No" width="50%" click="onClick(false)"/>

</s:HGroup>

</s:VGroup>

</s:Panel>

</s:SkinnablePopUpContainer>

Now edit the overridden backKeyUpHandler function to include this code [geshi lang=”mxml” nums=”1″ target=”_self” ]

override protected function backKeyUpHandler(event:KeyboardEvent):void
			{

1 2	override protected function backKeyUpHandler(event:KeyboardEvent):void {

                                var popupyn:PopUp = new PopUp();
				popupyn.open(this);

1 2	var popupyn:PopUp = new PopUp(); popupyn.open(this);

}

}

and thats it you get the following result

I hope this helps. If it does answer your question please leave your comments as a feedback, Ta!

Cheers

Flex Mobile – Preventing the Back Button Event Android

Related

Leave a ReplyCancel reply

Sponsored Links

Ads

Subscribe to my Blog via Email

Connect

Categories

Ads

Disclaimer

Recent Comments

Software by me {shop now}

My Other Sites