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
New Contributor
Posts: 6
Registered: ‎11-25-2010
My Device: Not Specified
Accepted Solution

What Theme to Use?

I have practically completed my app, made in a mix of mxml and as3 (if this holds any relevancy) and I would like to know what theme to use? Do we choose whichever we want, or must we stick to the default Spark theme? I believe it said somewhere that importing qnx will give it a BlackBerry-esque UI but so far it remains looking like the plain old Spark Theme. Am I doing something wrong?

Developer
Posts: 137
Registered: ‎10-26-2010
My Device: Bold 9900 + PlayBook
My Carrier: Rogers

Re: What Theme to Use?

[ Edited ]

Just importing QNX won't do, you have to actually use it. The QNX UI framework exists completely seperate from Spark, and provides a different set of controls you can use. They have the advantages of being significantly higher performance, and matching the native look and feel.

--------
Taylor Byrnes
Developer
Posts: 17
Registered: ‎11-22-2010
My Device: PlayBook

Re: What Theme to Use?

What mxml components did you get to work, in your actionscript project?  

 

I tried a few, but I couldn't get them to work.

 

Brad

 

 

Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: What Theme to Use?

If you're getting compile errors in trying to use MX controls you have to add:

 

-locale en_US -library-path+="C:\Program Files\Adobe\Adobe Flash Builder 4\sdks\blackberry-tablet-sdk-0.9.0\frameworks\locale\en_US"

 

Under Flex Compiler arguments.

 

You can use MX controls, however your application file size will be a lot larger and the start up time is a lot longer than basing the application of Spark and BB frameworks.

Developer
Posts: 137
Registered: ‎10-26-2010
My Device: Bold 9900 + PlayBook
My Carrier: Rogers

Re: What Theme to Use?

 


jtegen wrote:

If you're getting compile errors in trying to use MX controls you have to add:

 


 

@jtegen

 

Slow down and read the OP's post. They didn't mention anything about compile errors. Based on the fact they're talking about what their app looks like when running, I'm quite certain they aren't having compile errors. Responding with irrelevant info makes it harder to find the real solution, and this isn't the first thread you've done this in. I hope I'm not speaking out of turn, not being a mod, but I wanted to give you a friendly reminder in the interest of this being a more useful resource.

--------
Taylor Byrnes
New Contributor
Posts: 6
Registered: ‎11-25-2010
My Device: Not Specified

Re: What Theme to Use?

How do I use the QNX UI then? just a demo of how to set up a button would be much appreciated... 

Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: What Theme to Use?

Thanks.  There was a thread somewhere else that some people were not able to get MX controls to compile, so I read into that question as being surprised that that was possible.  And the fix to get MX controls to compile was my alternate reply.

 

Sorry for any confusion.

Developer
Posts: 2,462
Registered: ‎11-04-2010
My Device: Bold 9700

Re: What Theme to Use?

hey lexrussian,

 

here is a sample usage of the LabelButton:

 

 

package
{
	
	import flash.display.Sprite;
	
	import qnx.ui.buttons.LabelButton;
	import qnx.ui.skins.buttons.RoundedButtonSkinWhite;
	
	
	
	// The following metadata specifies the size and properties of the canvas that
	// this application should occupy on the BlackBerry PlayBook screen.
	[SWF(width="1024", height="600", backgroundColor="#cccccc", frameRate="30")]
	public class LabelButtonTest extends Sprite
	{
		
		public function LabelButtonTest()
		{
			
			var newbtn:LabelButton = new LabelButton();
			
			newbtn.label = "A New Button";
			newbtn.setPosition(0,300);
			newbtn.setSkin(RoundedButtonSkinWhite);
			
			addChild(newbtn);
			
			
		}
		
	}
}

 the default skin for any button is

 

 

qnx.ui.skins.buttons.RoundedButtonSkinWhite;

 but you can change that to other skin

 

 

 

qnx.ui.skins.buttons.RoundedButtonSkinBlack;

 so if you went that route your code would look like this:

 

 

package
{
	
	import flash.display.Sprite;
	
	import qnx.ui.buttons.LabelButton;
	import qnx.ui.skins.buttons.RoundedButtonSkinBlack;
	
	
	
	// The following metadata specifies the size and properties of the canvas that
	// this application should occupy on the BlackBerry PlayBook screen.
	[SWF(width="1024", height="600", backgroundColor="#cccccc", frameRate="30")]
	public class LabelButtonTest extends Sprite
	{
		
		public function LabelButtonTest()
		{
			
			var newbtn:LabelButton = new LabelButton();
			
			newbtn.label = "A New Button";
			newbtn.setPosition(0,300);
			newbtn.setSkin(RoundedButtonSkinBlack);
			
			addChild(newbtn);
			
			
		}
		
	}
}

 

 

and the result would be a black gradient button.

 

 

you can read more about the skins here:

 

http://www.blackberry.com/developers/docs/airapi/1.0.0/qnx/ui/skins/package-detail.html

 

and more specifically button skins here:

 

http://www.blackberry.com/developers/docs/airapi/1.0.0/qnx/ui/skins/buttons/package-detail.html

 

good luck!

 

@jtegen: don't sweat it man. you've been more than helpful through out the forums and is much appreciated. everyone makes mistakes!

 

J. Rab (Blog) (Twitter)
--
1. If you liked my post or found it useful please click on the thumbs up and provide a Like!
2. If my post solved your problem please click on the Accept as Solution button. Much appreciated!

Approved Apps: OnTrack | ssShots | Hangman
New Contributor
Posts: 6
Registered: ‎11-25-2010
My Device: Not Specified

Re: What Theme to Use?

Just when i thought I had it all figured out thanks to your help...More Problems... it gives me an error after i copy-pasted your code into Flex 4.  Error:

 

 

 

Description Resource Path Location Type
A file found in a source-path 'Buttons' must have the same name as the class definition inside the file 'LabelButtonTest'. Buttons.as /Buttons/src Unknown Flex Problem

 

Description Resource Path Location TypeA file found in a source-path 'Buttons' must have the same name as the class definition inside the file 'LabelButtonTest'. Buttons.as /Buttons/src Unknown Flex Problem

 

However, thank you very very much for explaining skins and all that. I think if i get over this last hurtle i will no longer have to rely on Adobe themes, as simply changing the button skins is very favourable over that...

Developer
Posts: 2,462
Registered: ‎11-04-2010
My Device: Bold 9700

Re: What Theme to Use?

hey lexrussian,

 

i know the feeling! but thats what this forum is here for Smiley Happy

 

that error simply means that ActionScript likes to have the class names the same as the file name. So i think in your case you set up your project with the name Buttons and the code you copy and pasted had the class name LabelButtonTest. I believe you can simply change the class name of the copied and pasted code to Buttons it should do the trick:

 

 

package
{
	
	import flash.display.Sprite;
	
	import qnx.ui.buttons.LabelButton;
	import qnx.ui.skins.buttons.RoundedButtonSkinBlack;
	
	
	
	// The following metadata specifies the size and properties of the canvas that
	// this application should occupy on the BlackBerry PlayBook screen.
	[SWF(width="1024", height="600", backgroundColor="#cccccc", frameRate="30")]
	public class Buttons extends Sprite
	{
		
		public function Buttons()
		{
			
			var newbtn:LabelButton = new LabelButton();
			
			newbtn.label = "A New Button";
			newbtn.setPosition(0,300);
			newbtn.setSkin(RoundedButtonSkinBlack);
			
			addChild(newbtn);
			
			
		}
		
	}
}

 

try that and see if it works. if that doesnt work go back and recreate a project with the name LabelButtonTest and copy and paste from my other post and it should work. Good luck!

 

J. Rab (Blog) (Twitter)
--
1. If you liked my post or found it useful please click on the thumbs up and provide a Like!
2. If my post solved your problem please click on the Accept as Solution button. Much appreciated!

Approved Apps: OnTrack | ssShots | Hangman