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

Web and WebWorks Development

Reply
Developer
rorybarnes
Posts: 214
Registered: ‎01-07-2011
My Device: Bold 9900
My Carrier: Rogers

Re: onSwipeDown Menu

There is an issue open for this in github.

 

As an alternative: http://pastebin.com/H3qe9rJ9 That is the code I am using to show/hide my onSwipeDown menu on OS2. It adds a couple things not done with the example one so that the menu better mimics the BB apps with onSwipeDon menus. It uses jQuery to animate the show/hide, but you should be able to do with out those.

--
Rory (@roryboy)
Click "Accept as Solution" if post solved your original issue. Give like/thumbs up if you feel post is helpful
Please use plain text.
Developer
scrid2000
Posts: 142
Registered: ‎07-27-2011
My Device: Red Z10, 32GB PlayBook, Numerous Android/WP8/FirefoxOS/Other devices
My Carrier: T-Mobile

Re: onSwipeDown Menu

Awesome, thanks Rory, I'll take a look at that.
-----------------------------------------------------------------------------------------



Please use plain text.
Developer
asiayeah
Posts: 118
Registered: ‎11-05-2011
My Device: Z10, Bold 9900
My Carrier: Smartone

Re: onSwipeDown Menu

[ Edited ]

Thanks, Rory. Can I have some details on why the original solution doesn't work on OS2?

 

I've hit the same problem with the original solution on OS2, it doesn't always work unless I refresh the canvas on the main screen and then the show menu will work. I haven't yet found out why...

 

I will look at your solution at http://pastebin.com/H3qe9rJ9. Does that work on both OS 1 and 2?

Please use plain text.
Developer
rorybarnes
Posts: 214
Registered: ‎01-07-2011
My Device: Bold 9900
My Carrier: Rogers

Re: onSwipeDown Menu

My solution drops the CSS animation and replaces it with JS/jQuery so it works on all PB OS versions.

 

I don't actually know what the root cause of it is. I assume it is a rendering bug with the BB WebKit but I haven't heard a reason for it from RIM yet.

 

I should have an update to this code this sometime this week with a better animation but I can't promise a date on that.

--
Rory (@roryboy)
Click "Accept as Solution" if post solved your original issue. Give like/thumbs up if you feel post is helpful
Please use plain text.
Developer
d_source
Posts: 116
Registered: ‎03-08-2011
My Device: Not Specified

Re: onSwipeDown Menu

OS2 seems to have many issues, not just with the swipe down menu. Have a look at this thread  for disgruntled devs who are experiencing many problems. Hopefully RIM looks into these issues quickly so as not to upset the devs and give the users a bad experience.

 

Using CSS is a much cleaner and simpler solution than using jQuery or other external libraries. It's great that

was able to put together a script but really he shouldn't have to when the transition is already built into CSS3 and is very clean and supposed to function properly on the PB (and did up until this final release of OS2).

 

Please use plain text.
Developer
rorybarnes
Posts: 214
Registered: ‎01-07-2011
My Device: Bold 9900
My Carrier: Rogers

Re: onSwipeDown Menu

This quirk actually isn't only OS2, it showed up in 1.0.5+ as well.

 

That said, once this is fixed the jQuery code can be pulled out and the CSS3 will work again. The rest of the non-jQuery code I added actually beefs up the example as it makes the onSwipeDown menu work much more like native than the original.

--
Rory (@roryboy)
Click "Accept as Solution" if post solved your original issue. Give like/thumbs up if you feel post is helpful
Please use plain text.
Developer
rorybarnes
Posts: 214
Registered: ‎01-07-2011
My Device: Bold 9900
My Carrier: Rogers

Re: onSwipeDown Menu

As promised: http://glpr.ca/zSYQp6

 

A better version of the menuBar for both CSS3 (when the rendering bug is fixed) and a jQuery based one until then.

--
Rory (@roryboy)
Click "Accept as Solution" if post solved your original issue. Give like/thumbs up if you feel post is helpful
Please use plain text.
Developer
rorybarnes
Posts: 214
Registered: ‎01-07-2011
My Device: Bold 9900
My Carrier: Rogers

Re: onSwipeDown Menu

Ok I have learned a temporary work around so that pure CSS3/JS can be used again without needing jQuery, I can't promise this will always work but it does for now.

 

As for why: apparently this all started occurring when things were optimised for performance (browser and Webworks), one of the optimizations was to not render items off screen until they were needed. For some reason that causes issues this this particular rendering.

 

To make it work add this CSS class to your CSS file 

.initPosition {
-webkit-transform: translate(0, 0);
}

 

Then when you initialize your menu, add the above class to the menu div, which forces the menu to render even off screen:

function load_menu() {
blackberry.app.event.onSwipeDown(showMenuBar);
document.getElementById('menuBar').className = 'initPosition';
}

I tried this out in one of my apps this evening and everything appears to work for me.

--
Rory (@roryboy)
Click "Accept as Solution" if post solved your original issue. Give like/thumbs up if you feel post is helpful
Please use plain text.
Administrator
astanley
Posts: 1,382
Registered: ‎07-02-2009
My Device: BlackBerry Bold 9900
My Carrier: Bell

Re: onSwipeDown Menu

Would also like to add that, with Rory's help, we have published the following improved "Swipe Menu" sample application in github:

 

https://github.com/blackberry/WebWorks-Samples/tree/master/swipemenu

 

This sample offers an easier interface to add the menu and customize buttons (text only, image only, mixed text and image) to your Tablet OS WebWorks applications..

 

 

Thanks Rory for your contribution!

Follow me on Twitter: @n_adam_stanley
-------------------------------------------------------------------------------------------------------------------------
Your app doesn't work? Use BlackBerry remote web inspector to find out why.
Please use plain text.
Developer
d_source
Posts: 116
Registered: ‎03-08-2011
My Device: Not Specified

Re: onSwipeDown Menu

Thanks Adam and Rory. The sample menu works very well (better than the original one!).

 

It seems that the menu items can only have one style for all elements added. Is it possible to add a menu item with a secondary style?

 

Thanks

Please use plain text.