Problem Description
Customer has been putting a bunch of textfields in rows inside a table. This is working nice in general, except when the device has an external keyboard (slider models, like HTC PG06100). We are looking for a possible fix in the platform or workaround in order to get the focus properly in each textfield.
Actual results
The textfield is not getting the focus in the bottom of the tableview.
Expected results
All textfields getting focus across all the textfields.
Test Case
1. Create a mobile project
2. Paste this code:
var win = Ti.UI.createWindow();
var datasource = [];
win.orientationModes = [Titanium.UI.PORTRAIT, Titanium.UI.UPSIDE_PORTRAIT, Titanium.UI.LANDSCAPE_LEFT, Titanium.UI.LANDSCAPE_RIGHT];
win.windowSoftInputMode = (Ti.UI.Android) ? Ti.UI.Android.SOFT_INPUT_ADJUST_PAN : '';
function createRows(i) {
var row = Titanium.UI.createTableViewRow({
height : 'auto',
backgroundColor : 'white',
bottom:10,
});
var textLabel = Titanium.UI.createLabel({
top : 10,
bottom : 10,
left : '5%',
right : '30%',
height : 'auto',
color : '#363636',
text : 'This is Row ' + (i + 1),
font : {
fontSize : 14,
fontFamily : 'Helvetica Neue',
fontWeight : 'regular'
}
});
row.add(textLabel);
var txtField = Titanium.UI.createTextField({
right : '3.1%',
left : '55%',
borderStyle : Ti.UI.INPUT_BORDERSTYLE_ROUNDED,
height : 44,
top : 10,
bottom : 10,
borderRadius : 5,
font : {
fontSize : 17,
fontFamily : 'Helvetica Neue'
},
returnKeyType : Titanium.UI.RETURNKEY_DONE
});
txtField.softKeyboardOnFocus = (Ti.UI.Android) ? Titanium.UI.Android.SOFT_KEYBOARD_SHOW_ON_FOCUS : '';
txtField.addEventListener('focus', function(e) {
var alertDialog = Titanium.UI.createAlertDialog({
title : 'AttentioN',
message : 'Focus Event on Text Field',
buttonNames : ['OK']
});
alertDialog.show();
});
txtField.addEventListener('return', function(e) {
//txtField.blur();
});
row.add(txtField);
return row;
}
for( i = 0; i <= 15; i++) {
var row = createRows(i);
datasource.push(row);
}
var tableView = Titanium.UI.createTableView({
top : 0,
bottom : 0,
separatorColor : '#e7e7e7',
data : datasource,
backgroundColor : '#ffffff'
});
win.add(tableView);
win.open();
Extra info
Needs to be reproduced with a slider phone
After some investigation, it looks like it's some odd behavior with the native android list view and hardware keyboards. The current position in the list view does not get resolved correctly when using hardware keyboard, and as a result, the list view is forced to the very top. When the list view scrolls to the top, we lose focus of the text field, and can't regain the focus on it. This is odd android behavior, and can't be fixed on our platform. In general, I would try to avoid using textfields inside table views since it is not well supported on the android platform.
Closing ticket as the issue will not fix and with reference to the above comments.