keyboard - 单击 Titanium 中 tableView 内的文本字段时隐藏键盘(模糊)

Question

我正在尝试在 Titanium 中获取一个表格，其中每行都有一个静态文本和一个可以输入内容的文本字段。

所以我去创建一行，其中左侧部分是静态文本，右侧部分是我的输入文本字段。 只是一个小问题，我无法通过点击键盘外部来隐藏键盘。

如果它是表格外的普通文本字段，我只会使用模糊方法，但在这种情况下我无法让它工作。

这是我到目前为止的代码: 知道它是如何工作的以及该解决方案是否对 iOS 和 Android 都有效吗？

var winAddObjectView = Titanium.UI.currentWindow;

var tableAddObjectData = [
    {title:'name', hintText:'item name (optional)'},
    {title:'track no.', hintText:'object tracking code'}
];

var tableAddObjectRowData = [];
for (var i = 0; i < tableAddObjectData.length; i++) {
    var title = Ti.UI.createLabel({
        text:tableAddObjectData[i].title,
        textAlign:"right",
        left:"20",
        height:'auto',
        width:'68',
        color:'#526691',
        font:{fontSize:12, fontWeight:'bold'},
    });
    var textField = Ti.UI.createTextField({
        hintText:tableAddObjectData[i].hintText,
        textAlign:"left",
        left:"96",
        height:'auto',
        width:'184',
        color:'#4C4C4C',
        font:{fontSize:12, fontWeight:'bold'},
    });

    winAddObjectView.addEventListener("click", function(e){
        textField.blur();
    });

    var row = Ti.UI.createTableViewRow({
        height:"45",
    });

    row.add(title);
    row.add(textField);
    tableAddObjectRowData.push(row);
}

var tableAddObjectView = Ti.UI.createTableView({
    headerTitle:'Enter Tracking Information',
    style:Titanium.UI.iPhone.TableViewStyle.GROUPED,
    backgroundColor:'transparent',
    data:tableAddObjectRowData,
});

winAddObjectView.add(tableAddObjectView)

Answer 1

我对您的代码做了一些更改。请尝试这个

var tableAddObjectRowData = [];
var textFields = [];              //Created an array of textFields
for (var i = 0; i < tableAddObjectData.length; i++) {
    var title = Ti.UI.createLabel({
        text:tableAddObjectData[i].title,
        textAlign:"right",
        left:"20",
        height:'auto',
        width:'68',
        color:'#526691',
        font:{fontSize:12, fontWeight:'bold'},
    });
    textFields[i] = Ti.UI.createTextField({            //Creating the textField
        hintText:tableAddObjectData[i].hintText,
        textAlign:"left",
        left:"96",
        height:'auto',
        width:'184',
        color:'#4C4C4C',
        font:{fontSize:12, fontWeight:'bold'},
    });

    var row = Ti.UI.createTableViewRow({
        height:"45",
    });

    row.add(title);
    row.add(textFields[i]);
    tableAddObjectRowData.push(row);
}

var tableAddObjectView = Ti.UI.createTableView({
    headerTitle:'Enter Tracking Information',
    style:Titanium.UI.iPhone.TableViewStyle.GROUPED,
    backgroundColor:'transparent',
    data:tableAddObjectRowData,
    height : (tableAddObjectRowData.length * 45) + 60     //Added the height property for the tableView
});

winAddObjectView.addEventListener("click", hideSoftKeyboard);  //added event listener to the window, moved this to out of the loop

function hideSoftKeyboard(){                  //Added function to hide the keyboard
    for(var i=0; i<textFields.length; i++){
        textFields[i].blur();             //Hiding each keyboards
    }
}
winAddObjectView.add(tableAddObjectView);

说明

1. winAddObjectView.addEventListener("点击", function(e){ textField.blur(); }); 程序中的上述代码段不起作用，因为窗口的 click 事件未触发由于 tableView 的高度，窗口被隐藏，并且您的点击在 tableView 上触发。如果您为 tableView 设置 backgroundColor 属性，您可以看到差异。所以我调整了 tableView 的高度，因此窗口中触发的点击和键盘消失了。

2. 创建 textField 数组:您可以执行相同的操作，而无需创建 textField 数组，并且在 for 循环 内，您可以将 textField 创建为 var textField = Ti.UI.createTextField ();。但如果这样做，则无法始终隐藏键盘，因为只会为最后一个文本字段触发事件。因此我创建了 textField 数组

3. 对于 Android，您还可以使用 Ti.UI.android.hideSoftKeybaord()方法。为此，只需更改代码中的 hideSoftkeyboard() 方法，如下所示

   function hideSoftKeyboard(){                  //Added function to hide the keyboard
       if(Ti.Platform.osname === 'android'){
            Ti.UI.Android.hideSoftKeyboard();
       } else {
            for(var i=0; i<textFields.length; i++){
                 textFields[i].blur();             //Hiding each keayboards
            }
       }
   }