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
Highlighted
New Developer
Posts: 6
Registered: ‎12-23-2010
My Device: Not Specified

Looking for the 'Popover' UI component

Hi,

 

I'm looking for a popup component just like the one you can see in the playbook simulator when you click on the "tools" or "music" icons. The name 'Popover' comes from the name of that component in other platforms.

 

Being pretty confident that it doesn't currently exist, I would like to know if it is on the SDK roadmap, and if some developers out there are also interested in having this component.

 

I think this should became a very common component, and since it is already used in the playbook (at least in the current simulator), it would be just natural to have it included in the SDK.

 

 

Thanks.

Developer
Posts: 1,008
Registered: ‎12-12-2010
My Device: Passport (Red Limited Edition)
My Carrier: Mobile Vikings

Re: Looking for the 'Popover' UI component

It is not available (yet?). I use a similar component in my application: it's not that hard to create using a Sprite and Tweener.

 

 

package UI.Menu
{
	import UI.MindmapView;
	
	import flash.display.Sprite;
	import flash.geom.Matrix;
	
	public class PopupMenu extends Sprite
	{
		
		public static const MENUWIDTH:int = 240;
		public static const MENUHEIGHT:int = 180;
		public static const ARROWBASEWIDTH:int = 30;
		public static const ARROWHEIGHT:int = 20;
		public static const INNERMARGIN:int = 20;
		private var arrowLocation:int;
		private var menuHeight:int;
		

		public function PopupMenu(arrowLocation:int, menuHeight:int = MENUHEIGHT)
		{
			this.arrowLocation = arrowLocation;
			this.menuHeight = menuHeight;
			draw();
		}
		
		private function draw():void{
			//Draw top arrow
			var matr:Matrix = new Matrix();
			matr.createGradientBox(ARROWBASEWIDTH, ARROWHEIGHT/2, 90/180*Math.PI, 0, 0);
			graphics.beginGradientFill("linear", [0x5D5D5D, 0x3C3C3C], [100, 100], [0, 255], matr);
			var squareCommands:Vector.<int> = new Vector.<int>(3, true);
			squareCommands[0] = 1;
			squareCommands[1] = 2;
			squareCommands[2] = 2;
			var squareCoord:Vector.<Number> = new Vector.<Number>(6, true);
			squareCoord[0] = arrowLocation;
			squareCoord[1] = 0;
			squareCoord[2] = squareCoord[0] + ARROWBASEWIDTH/2;
			squareCoord[3] = -ARROWHEIGHT;
			squareCoord[4] = squareCoord[0] + ARROWBASEWIDTH;
			squareCoord[5] = 0;
			graphics.drawPath(squareCommands, squareCoord);
			graphics.endFill();
			//Draw box
			matr = new Matrix();
			matr.createGradientBox(MENUWIDTH, menuHeight, 90/180*Math.PI, 0, 0);
			graphics.beginGradientFill("linear", [0x3C3C3C, 0x000000], [100, 100], [0, 255], matr);
			graphics.drawRoundRect(0, 0, MENUWIDTH, menuHeight, 10, 10);
			graphics.endFill();
		}
		
	}
}

 

Here's my code, note that it does not contain any tweens yet.

 

-------------------------------------------
BlackBerry Certified Builder for Native Application Development -- Proud member of the Belgian BlackBerry Developer group
Samples: Park in Ghent
Feeling generous? Nominate me for BB Elite member!
Developer
Posts: 6,473
Registered: ‎12-08-2010
My Device: PlayBook, Z10
My Carrier: none

Re: Looking for the 'Popover' UI component

The component doesn't exist in any public form yet.  There is no published "SDK roadmap" either, unfortunately, so other than those with inside knowledge nobody knows whether it will ever be released.

 

It is a nice-looking component... but it also looks like something that would be pretty simple to build from scratch, IMHO.

 

My theory, since this wasn't how the first simulator looked, is that this is one of the first contributions we've seen from the acquisition of TAT.  If it's a sign of what's to come, I'm very optimistic about the long-term usability of the Tablet OS.


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!
New Developer
Posts: 6
Registered: ‎12-23-2010
My Device: Not Specified

Re: Looking for the 'Popover' UI component

Agree that can be easily done, but  wanted to prevent  wasted efforts.

 

Thanks for the code, it's a nice start.

 

 

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

Re: Looking for the 'Popover' UI component

For a slightly different purpose, I wanted to learn how this sort of thing could best be done.  As a result of help in another thread, I was able to build something very close to the system popover, starting with @zezke's code above as a base.


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!