Details
Medium
Description
Issue Description
When the user set percent units in the column width property, the columns set by default equal sizes. For example, if the Picker have 2 columns and the first column have a width of 75% and the other column have 20%, the percentage applied is a percentage of their 50% widths. So the columns actually show less information instead of splitting up the whole width of the screen in the desired (75% / 25%) proportions.
Expected behavior
The percentage of each column should be the percentage of the picker width
Steps to Replicate:
1. Create a new titanium classic project
2. Grab the app.js file
3. Replace the code with the testcase code
4. Run the application on iOS simulator
Test Case
|
|
Ti.UI.backgroundColor = 'white';
|
var win = Ti.UI.createWindow({
|
exitOnClose: true,
|
layout: 'vertical'
|
});
|
|
|
var picker = Ti.UI.createPicker({
|
width: "100%",
|
useSpinner: true
|
});
|
picker.selectionIndicator = true;
|
|
|
var fruit = [ 'Bananas', 'Strawberries', 'Mangos', 'Grapes' ];
|
var color = [ 'red', 'green', 'blue', 'orange' ];
|
|
|
var column1 = Ti.UI.createPickerColumn({
|
width:"30%"
|
});
|
|
|
for(var i=0, ilen=fruit.length; i<ilen; i++){
|
var row = Ti.UI.createPickerRow({
|
title: fruit[i]
|
});
|
column1.addRow(row);
|
}
|
|
|
var column2 = Ti.UI.createPickerColumn({
|
width:"70%"
|
});
|
|
|
for(var i=0, ilen=color.length; i<ilen; i++){
|
var row = Ti.UI.createPickerRow({ title: color[i] });
|
column2.addRow(row);
|
}
|
|
|
picker.add([column1,column2]);
|
|
|
win.add(picker);
|
|
|
win.open();
|
|
|
picker.setSelectedRow(0, 2, false); // select Mangos
|
picker.setSelectedRow(1, 3, false); // select Orange
|
|