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
Posts: 17
Registered: ‎11-04-2010
My Device: Not Specified

Long labels in Picker

I'm trying to use the Picker to present a list of items.  Some of them are long, though nothing excessive, just a few words.  However, the picker doesn't display the labels correctly.  They're centered in the picker but, if the label is long, only the left half of the label is visible and the right half is cut off.

 

Here's simple code that reproduces what I'm seeing:

 

 

var p:Picker = new Picker();
var arr:Array = new Array();		
var dp:DataProvider = new DataProvider();
			
arr.push({label: "A long label."});
arr.push({label: "A very long label."});
arr.push({label: "An extremeley long label."});			
var rangeDP:DataProvider = new DataProvider(arr);
			
dp.addItem(rangeDP); 
p.dataProvider = dp;
p.width = 400;
p.defaultListWidth = 350;
addChild(p);

The result looks like this:

picker.png

 

 

It would appear that the label used by the picker has a width, but I don't see how to change it to make it fit the text properly. 

 

Can anyone offer any ideas?

 

 

Developer
Posts: 110
Registered: ‎10-31-2010
My Device: Blackberry Torch 9800
My Carrier: Bell Mobility

Re: Long labels in Picker

I'm having the same problem with the text class.  I've tried autosize but like you it only displays a certain number of pixels in the control and it doesn't seem like the control can be expanded to match the text (even though its << smaller than the available area on the stage).   When I make the font smaller, I can display more characters but the visible area is exactly the same.  I suspect there is a bug in the underlying class (which is likely common to both of our classes).   If anyone has any brilliant ideas, I'm wide open to them.   Here's my snipet:

 

            var myFormat:TextFormat = new TextFormat();
            myFormat.color = 0xAA0000;   
            myFormat.size = 24;  
            myFormat.italic = true;  
            myFormat.align = "center";
            
            var text:TextField = new TextField();
            text.text = "This is some really long text";
            text.wordWrap = false;
            text.setTextFormat(myFormat);
            
            var TitleLabel:Label = new Label();
            TitleLabel.addChild(text);        
            TitleLabel.x = (stage.stageWidth - TitleLabel.width)/2;
            TitleLabel.y = 10;
            TitleLabel.autoSize = TextFieldAutoSize.CENTER ;
                     
            addChild(TitleLabel);

Best regards,

Brent

If you found my post helpful, please thank me with a Kudo. Thanks!
Developer
Posts: 2,462
Registered: ‎11-04-2010
My Device: Bold 9700

Re: Long labels in Picker

[ Edited ]

 

			var myFormat:TextFormat = new TextFormat();
myFormat.color = 0xAA0000;
myFormat.size = 24;
myFormat.italic = true;
myFormat.align = "center";

var text:TextField = new TextField();
text.text = "This is some really long text";
text.setTextFormat(myFormat);
text.autoSize = "left";

var TitleLabel:Label = new Label();
TitleLabel.addChild(text);
TitleLabel.x = (stage.stageWidth - TitleLabel.width)/2;
TitleLabel.y = 10;


addChild(TitleLabel);

 

hey i got it working... i just set the text.autosize property to left and it shows the entire text. hope that helps! =]

 

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
Developer
Posts: 17
Registered: ‎11-04-2010
My Device: Not Specified

Re: Long labels in Picker

I had that idea too, but the problem is that the Picker class doesn't seem to expose the labels.  It's taking a dataProvider and rendering the labels but I can't see any way to modify the labels directly.

Developer
Posts: 110
Registered: ‎10-31-2010
My Device: Blackberry Torch 9800
My Carrier: Bell Mobility

Re: Long labels in Picker

Hey J. Rab...  thanks!  I changed your text from "left" to "centre" and it worked just as I expected it should (although not sure why the constants didn't work... I got those from the HelloWorld example).  I guess ActionScript isn't as tightly type cast as I'm used to with C or Java.  Anyway, I'm off and running now so thanks!

Best regards,

Brent

If you found my post helpful, please thank me with a Kudo. Thanks!
Developer
Posts: 2,462
Registered: ‎11-04-2010
My Device: Bold 9700

Re: Long labels in Picker

[ Edited ]

no problem! just glad i cud help! =]

 

@froboz: im looking into it.. kind got me wondering haha... but from wat i can tell.. you mite hafta use either the PickerList or the PickerListCellRenderer (both part of the Picker package) classes to further customize how it should look.

 

EDIT:

 

@froboz: heres some food for thought... what if the picker isnt the rite class to be using.. ive noticed whenever i see someoen referencing the picker class they are usually doing a date picker or something with short text of that nature... we mite hafta use a different drop down function for what we want to accomplish... so im thinking PickerList mite be the key.

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
Highlighted
Developer
Posts: 2,462
Registered: ‎11-04-2010
My Device: Bold 9700

Re: Long labels in Picker

hey froboz, i modified your code a little using the DropDown class instead of the Picker class and it works.. doesnt look as pretty as the picker but i think the picker was designed for dates and numbers and such.. anyways here it is:

 

 

	var dropDownMenu:DropDown = new DropDown();
	
	var arr:Array = new Array();		
	
	arr.push({label: "A long label."});
	arr.push({label: "A very long label."});
	arr.push({label: "An extremeley long label."});	
	
	dropDownMenu.rowHeight = 45;
	dropDownMenu.rowCount = 3;
	dropDownMenu.width = 250;
	
	var dp:DataProvider = new DataProvider(arr);	
	
	dropDownMenu.dataProvider = dp; 
	
	addChild(dropDownMenu);

 

 

 

 

 

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