01-27-2011 08:35 PM
I am trying to set the picker's skin theme to black. I can get it work if I set the global themes to black, but I don't want my entire application flipped to black theme, just this picker. I tried to set the skins for each of the compenents (http://www.blackberry.com/developers/docs/airapi/1
budgetPicker.setButtonSkin(new PickerButtonSkinBlack);
budgetPicker.setListBackgroundSkin(new PickerListBackgroundBlack);
budgetPicker.setSelectionSkin(new PickerSelectionBlack);
But the .setButtonSkin is not doing anything. Even if I comment it out it makes no difference.
Anyone?
Solved! Go to Solution.
01-27-2011 08:51 PM
No clue if this will work or not, but maybe try calling the drawNow() method after setting your skin to black. This should force a redraw, and hopefully with the new skin in place.
01-27-2011 09:02 PM - last edited on 01-27-2011 09:03 PM
Thank you for the suggestion. I tried it and it did not work.
In case anyone cares to test it, here's some code:
import qnx.ui.skins.picker.PickerButtonSkinBlack;
import qnx.ui.skins.picker.PickerListBackgroundBlack;
import qnx.ui.skins.picker.PickerSelectionBlack;
import qnx.ui.picker.Picker;
import qnx.ui.data.DataProvider;
var budgetPicker:Picker;
var budgetPickerArray:Array;
var budgetPickerDP:DataProvider;
var budgetIDArray:Array;
var budgetIDdp:DataProvider;
budgetPicker = new Picker();
budgetPicker.setButtonSkin(new PickerButtonSkinBlack);
budgetPicker.setListBackgroundSkin(new PickerListBackgroundBlack);
budgetPicker.setSelectionSkin(new PickerSelectionBlack);
budgetIDArray = new Array();
budgetIDArray.push({label: "Item 1"});
budgetIDArray.push({label: "Item 2"});
budgetIDdp = new DataProvider(budgetIDArray);
budgetPickerArray = new Array();
budgetPickerArray.push(budgetIDdp);
budgetPickerDP = new DataProvider(budgetPickerArray);
budgetPicker.dataProvider = budgetPickerDP;
addChild(budgetPicker);
Thanks for your help guys. I think this might be a bug.
01-27-2011 09:19 PM
Tstorm2086 experienced the same problem. I think you may be right about it being a bug, as his only solution was to set the ThemeGlobals to black.
01-27-2011 09:22 PM
**bleep**, that's what I didn't want to hear. Setting the global theme to black means I have to then change all of the text in my app back to black from the black theme's white text.
01-27-2011 09:23 PM
hey,
yep i can also confirm that its a bug. no matter how you go about setting it (asside from the themeglobal option) it wont ever set the skin of the button. all the other set methods work though, except this one.
01-27-2011 09:27 PM
I know it's impossible to tell when a bug will get fixed, but can you not just leave your app as is and fix it when the bug is resolved? (I'm assuming its purely an aesthetic thing)
01-27-2011 09:29 PM
Thanks for the suggestion. Might do that.
01-27-2011 11:43 PM
hey EraserX,
i did some more digging and found a possible workaround. thanks to Flash Builder i was able to snoop around the Picker class via extending it with a custom class. turns out the button is a protected value therefore totally accessible via extending the class. to summarize i basically took the setButtonSkin method and overrode it and then modified the __buttonBackground (turns out its a button so its skinnable via its own setSkin method).
CustomPicker.as:
package
{
import qnx.ui.picker.Picker;
public class CustomPicker extends Picker
{
public function CustomPicker()
{
super();
}
override public function setButtonSkin(skin:Object):void
{
this.__backgroundButton.setSkin(skin);
}
}
}
so from now on instead of creating a Picker() object, you can create a CustomPicker() object.
// A short example of a picker component that displays
// day, month and year.
package
{
import flash.display.Sprite;
import flash.events.Event;
import qnx.ui.data.DataProvider;
import qnx.ui.picker.Picker;
import qnx.ui.skins.picker.PickerButtonSkinBlack;
import qnx.ui.skins.picker.PickerListBackgroundBlack;
import qnx.ui.skins.picker.PickerSelectionBlack;
import qnx.ui.text.Label;
[SWF(height="600", width="1024", frameRate="30", backgroundColor="#BBBBBB")]
public class PickerSample extends Sprite
{
public function PickerSample()
{
// Create three arrays to handle days, months, years.
var arrDay:Array=[];
var arrMonth:Array=[];
var arrYear:Array=[];
// Populate the month array and create the
// day DataProvider
for (var i:int=1; i<32; i++) {
arrDay.push({label: i.toString()});
}
var dayDP:DataProvider=new DataProvider(arrDay);
// Populate and month array and create the month
// DataProvider
arrMonth.push({label: "January"});
arrMonth.push({label: "February"});
arrMonth.push({label: "March"});
arrMonth.push({label: "April"});
arrMonth.push({label: "May"});
arrMonth.push({label: "June"});
arrMonth.push({label: "July"});
arrMonth.push({label: "August"});
arrMonth.push({label: "September"});
arrMonth.push({label: "October"});
arrMonth.push({label: "November"});
arrMonth.push({label: "December"});
var monthDP:DataProvider=new DataProvider(arrMonth);
// Create the year DataProvider
for (var l:int=1900; l<2015; l++) {
arrYear.push({label: l.toString()});
}
var yearDP:DataProvider=new DataProvider(arrYear);
// Add the day, month and year DataProviders to the main
// array
var dpp:Array = new Array();
dpp.push(dayDP);
dpp.push(monthDP);
dpp.push(yearDP);
// Create the picker and add the main DataProvider
var picker:CustomPicker = new CustomPicker();
picker.setListBackgroundSkin(PickerListBackgroundBlack);
picker.setSelectionSkin(PickerSelectionBlack);
picker.setButtonSkin(PickerButtonSkinBlack);
picker.width=400;
picker.height=50;
picker.x=picker.y=300;
picker.dataProvider=new DataProvider(dpp);
addChild(picker);
// To customize column widths,
// all widths are added up and then used for
// a ratio against the component set width
picker.setListWidth(0,100);
picker.setListWidth(1,300);
picker.setListWidth(2,200);
// Set to Jan 1, 2010
picker.selectedIndices=[0,6,111];
// Add listeners for open, close and select events
picker.addEventListener(Event.OPEN,handleOpen);
picker.addEventListener(Event.CLOSE,handleClose);
picker.addEventListener(Event.SELECT,handleSelect);
// A simple function that displays currently selected
// item information in the console.
traceItems();
function traceItems():void
{
for (var j:int = 0; j <picker.selectedItems.length; j++) {
trace("Picker.selectedItems " +picker.selectedItems[j].label);
}
trace("Picker.selectedIndices "+picker.selectedIndices);
trace("Picker.data "+picker.data);
}
function handleSelect(e:Event):void {
traceItems();
}
function handleOpen(e:Event):void {
trace("Picker.open event captured");
}
function handleClose(e:Event):void {
trace("Picker.close event captured");
}
}
}
}
it should ahve the same functionality of the original class just with a modified setButtonSkin() method. i also want to add because this was a total guess i have no idea if we are losing extra functionality. example being if something else was also done within that method i dont know about. but it gets the job done hah hope this helps till they clear up the bug. good luck!
01-27-2011 11:48 PM
Brilliant JRab!