2

各行に静的テキストと何かを入力できる textField がある Titanium のテーブルを取得しようとしています。

そこで、左の部分が静的テキストで、右の部分が入力テキスト フィールドである行を作成します。ちょっとした問題ですが、キーボードの外側をクリックしてもキーボードを隠すことができません。

テーブルの外側にある通常の textField の場合は、blur メソッドを使用するだけですが、この場合はそれを機能させることができません。

これはこれまでの私のコードです:これがどのように機能するか、およびソリューションが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)
4

1 に答える 1

2

コードにいくつかの変更を加えました。これを試してください

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("click", function(e){ textField.blur(); });clicktableView の高さのためにウィンドウのイベントが発生せず、ウィンドウが非表示になり、クリックが tableView で発生した ため、プログラムの上記のコード セグメントは機能しませんでした。backgroundColortableViewのプロパティを設定すると、違いがわかります。そこで、tableViewの高さを調整したため、ウィンドウでクリックが発生し、キーボードが消えました。

  2. textField 配列の作成: textField 配列を作成せずに同じことを行うことができ、内部でfor looptextField を として作成できますvar textField = Ti.UI.createTextField();。ただし、そうすると、最後の textField に対してのみイベントが発生するため、キーボードを常に非表示にすることはできません。したがって、textField配列を作成しました

  3. Ti.UI.android.hideSoftKeybaord ()メソッドAndroidを使用することもできます。そのためには、コードのメソッドを次のように変更するだけです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
             }
        }
    }
    
于 2013-04-19T05:07:15.917 に答える