At first I thought that didn't work at all, but that's just because I was using debug mode and timer-based stuff (setTimeout, Timer, or enter_frame events) never works when I'm doing that for some reason.
I played a bit and got the following working too, which I think is closer to what you were trying to do before. This more closely mimics the system menu. I used roughly the same Y value as SWIPE_DOWN triggers at. If you release the mouse when still above that the menu retracts, but if you're below it locks it into position.
Sliding the menu back up is considered an app-specific behaviour here... maybe you want to just click below it, but maybe some other behaviour is better for you... depends on what you have in the menu.
package
{
import caurina.transitions.Tweener;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.display.Sprite;
import qnx.events.QNXApplicationEvent;
import qnx.system.QNXApplication;
[SWF(height="600", width="1024", frameRate="30", backgroundColor="#cccccc")]
public class MenuTest extends Sprite
{
private var ui:UI;
private var swiping:int;
// rough numbers eyeballed from system menu
public const SWIPE_REGION:int = 23;
public const MENU_HEIGHT:int = 62;
public function MenuTest()
{
ui = new UI(stage.stageWidth, MENU_HEIGHT)
addChild(ui);
QNXApplication.qnxApplication.addEventListener(QNXApplicationEvent.SWIPE_START, swipeMenu);
stage.addEventListener(MouseEvent.MOUSE_DOWN, swipeMenu);
stage.addEventListener(MouseEvent.MOUSE_UP, swipeMenu);
}
private function swipeMenu(e:Event):void
{
if (e.type == QNXApplicationEvent.SWIPE_START)
{
trace("prepare to swipe");
swiping = 1;
}
else if (e.type == MouseEvent.MOUSE_UP)
{
if (swiping == 2)
{
if (stage.mouseY >= SWIPE_REGION)
{
function now_showing():void {
trace("menu now visible");
// in real code could be a method on the class
}
Tweener.addTween(ui, {y: 0, time: .3, transition: "linear",
onComplete: now_showing});
}
else
{
trace("swipe cancelled");
Tweener.addTween(ui, {y: -MENU_HEIGHT, time: .3, transition: "linear"});
}
// either way, we're done swiping
stage.removeEventListener(Event.ENTER_FRAME, swipingMenu);
swiping = 0;
}
}
else if (e.type == MouseEvent.MOUSE_DOWN)
{
if (swiping == 1)
{
trace("swiping");
swiping = 2;
stage.addEventListener(Event.ENTER_FRAME, swipingMenu);
}
}
}
private function swipingMenu(e:Event):void
{
var y:int = stage.mouseY >= MENU_HEIGHT ? MENU_HEIGHT : stage.mouseY;
ui.y = y - MENU_HEIGHT;
trace(e, y);
}
}
}
import flash.display.Shape;
import flash.display.Sprite;
import qnx.ui.text.Label;
class UI extends Sprite
{
public function UI(width:int, height:int)
{
var navBar:Shape = new Shape();
navBar.graphics.beginFill(0x333333, 1);
navBar.graphics.drawRect(0, 0, width, height);
navBar.graphics.endFill();
var title:Label = new Label();
title.text = "App Menu";
title.y = (height - title.textHeight) / 2;
this.y = -height;
addChild(navBar);
addChild(title);
}
}
That's all in one file for ease of use...
It occurs to me that we maybe shouldn't be thinking of these in the
same way as drop-down menus in desktop operating systems (i.e. where you
get a vertical selection of choices as you wave the mouse around).
Here we probably are getting more like a panel of choices with buttons,
ala the Navigator's system menu.
(Edited: The code is now what I initially had, before I simplified for posting and didn't test adequately. This one uses a small state machine to ensure that you are still holding the mouse button down. The previous one may work okay on the tablet, but this one is required for use with a mouse. Otherwise you can click-and-release on the bezel, then see the menu being dragged down as you move the mouse down even though you aren't holding the mouse button down. Yet another case where not having a real tablet makes testing difficult.)
