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
Developer
mplacona
Posts: 80
Registered: ‎03-17-2011
My Device: Playbook Tablet
My Carrier: -

Adding more options to my settings page.

[ Edited ]

Hi, on my application, I created a settings page in which the user can modify the background colour by selecting one of the pre-defined colours from a PopupList.

 

I;m then saving it to a shared object, so when the user comes back to the application, they don't need to select their colour preferences again.

 

I was wondering about three things though.

 

1 - How can I pre-select the the item on my PopUp list, so if the user clicks settings again, the last chosen colour is already pre-select? You can assume I know what the index will be, as it's already stored in the sharedObject.

 

2 - If I wanted to add more items to this settings page, how would I go about it? Let's say I'd like to have an option in which the user can select an option from a radiobutton, or aa second dropdown.

It looks like using the PopUpList only allows me to have one option, as the PopUplist creates the dropdown automatically.

 

3 - Although my popUpList displays correctly on the simulator, it always errors when I try it from Flash builder (burrito) directly, giving me "Variable qnx.display::IowWindow is not defined"

 

Here's the code I'm using:

 

 

private function showSettings():void{
			var popUp:PopupList = new PopupList();
			with(popUp){
				title = "Colour Settings";
				items = ['Grey', 'Red', 'Blue'];
				addButton("OK");
				addButton("CANCEL");
				dialogSize = DialogSize.SIZE_SMALL;
				popUp.addEventListener(Event.SELECT, colourSelected);
				show(qnx.display.IowWindow.getAirWindow().group);
			}
		}

 Any helpwill  greatly appreciated.

 

Marcos Placona
www.placona.co.uk
My Playbook Apps:
Bonjour | Time Traveller | Magic Ball
Please use plain text.
Developer
TheDarkIn1978
Posts: 409
Registered: ‎12-10-2010
My Device: PlayBook
My Carrier: N/A

Re: Adding more options to my settings page.

[ Edited ]

1.  you can simply assign the previous selection to a variable, which could also hold the default value. (this code is untested)

 

 

private var popUpIndex:uint = 3;

private function showSettings():void
	{
	var popUp:PopupList = new PopupList();
	
	with	(popUp)
	 		{
			title = "Colour Settings";
			items = ['Grey', 'Red', 'Blue'];
			addButton("OK");
			addButton("CANCEL");
			dialogSize = DialogSize.SIZE_SMALL;
			scrollToIndex = popUpIndex;
			selectedIndices = [popUpIndex];
			popUp.addEventListener(Event.SELECT, colourSelected);
			show(qnx.display.IowWindow.getAirWindow().group);
			}
	}
	
private function colourSelected(evt:Event):void
	{
	popUpIndex = evt.currentTarget.selectedIndices[0];
	}

 

2.  instead of using dialogue windows, you could roll your own view using QNX components.

 

 

3.  UI components and other APIs from the BlackBerry PlayBook Tablet OS SDK require the simulator or the device to function.  they will not work in a standard AIR application.  if you feel having to test in the simulator is slowing you down, you might want to either include them last for later testing when the majority of the application is already complete, or use more portable solutions that don't require QNX.

 

by the way, i've never actually seen code using a "with" statement and had to research it in the docs since i've never even known about it!  so kudos to you on teaching me something new.


PlayBook Applications:
Drop Swatch
Please use plain text.
Developer
mplacona
Posts: 80
Registered: ‎03-17-2011
My Device: Playbook Tablet
My Carrier: -

Re: Adding more options to my settings page.

Hey, thanks for that, I've tried pre-selecting the item and it worked. In regards to rolling my own popup, do you have any examples of how to accomplish that? I've only been an actionscript developer for about 15 days, so I think I;m still not matured enough for such thing, but would really be keen to learn, or read more about.

 

Thanks

Marcos Placona
www.placona.co.uk
My Playbook Apps:
Bonjour | Time Traveller | Magic Ball
Please use plain text.
Developer
TheDarkIn1978
Posts: 409
Registered: ‎12-10-2010
My Device: PlayBook
My Carrier: N/A

Re: Adding more options to my settings page.

for your own settings view you could siimply create a sprite to act as the view's canvas or background, dress its graphics up as you would like and then add QNX components (or non QNX components) to it as children.

 

toggle the new view's visible property to show/hide the view

 

i just tossed this together really quick to give you an idea.  you can use it as a base for your own settings view.  just add your own components, data providers, logic, etc., again, it's untested code, but hopefully you'll understand it.

 

 

package
{
//Imports
import flash.display.Sprite;
import qnx.ui.buttons.LabelButton;

//Class
public class SettingsView extends Sprite
	{
	//Properties
	var canvasWidthProperty:uint;
	var canvasHeightProperty:uint;
	
	//Variables
	var canvas:Sprite = new Sprite();
	var labelButton:LabelButton = new LabelButton();
	
	//Constructor
	public function SettingsView(canvasWidth:uint = 600, canvasHeight:uint = 300)
		{
		this.canvasWidth = canvasWidth;
		this.canvasHeight = canvasHeight;
		
		drawCanvas();
		}
	
	//Draw Canvas
	private function drawCanvas():void
		{
		canvas.graphics.clear();
		canvas.graphics.beginFill(0x555555, 1.0);
		canvas.graphics.drawRoundRect(0, 0, canvasWidth, canvasHeight, canvasWidth / 10);
		canvas.graphics.endFill();
		
		if	(!contains(canvas))
			{
			addChild(canvas);
			drawComponents();
			}
			else
			layoutComponents();
		}
		
	//Draw Components
	private function drawComponents():void
		{
		labelButton.label = "My Button";
		
		canvas.addChild(labelButton);
		
		layoutComponents();
		}
		
	//Layout Components
	private function layoutComponents():void
		{
		labelButton.x = canvas.width / 2 - labelButton.width / 2;
		labelButton.y = canvas.height / 2 = labelButton.height / 2;
		}
		
	//Canvas Width Setter
	public function set canvasWidth(value:uint):void
		{
		canvasWidthProperty = value;
		drawView();
		}

	//Canvas Width Getter
	public function get canvasWidth():uint
		{
		return canvasWidthProperty;
		}
		
	//Canvas Height Setter
	public function set canvasHeight(value:uint):void
		{
		canvasHeightProperty = value;
		drawView();
		}
		
	//Canvas Height Getter
	public function get canvasHeight():uint
		{
		return canvasHeightProperty;
		}
	}
}

 

 


PlayBook Applications:
Drop Swatch
Please use plain text.