titaniumappceleratorcreatewindow

appcelerator createwindow makes the whole window black


I'm using the Titanium to develop an iOS app. I have a main window and I need to open a modal window above it. I put on the modal window (attached the code) a textArea and two buttons for save and cancel.

The problem is when I open the window, the whole window is turned black.

What do I do wrong? Thanks...

addEvenButton.addEventListener('click', function() {
    var eventDesc = '';
    var t = Titanium.UI.create2DMatrix();
    t = t.scale(0);

    var noteWin = Titanium.UI.createWindow({
        backgroundColor : '#b4be00',
        borderWidth : 8,
        borderColor : '#999',
        height : 460,
        width : 325,
        borderRadius : 10,
        opacity : 0.92,
        modal: true,
        transform : t
    });

    // create first transform to go beyond normal size
    var t1 = Titanium.UI.create2DMatrix();
    t1 = t1.scale(1.1);
    var a = Titanium.UI.createAnimation();
    a.transform = t1;
    a.duration = 1000;

    // when this animation completes, scale to normal size
    a.addEventListener('complete', function() {
        var t2 = Titanium.UI.create2DMatrix();
        t2 = t2.scale(1.0);
        noteWin.animate({
            transform : t2,
            duration : 200
        });

    });
    var noteField = Titanium.UI.createTextArea({
        color : 'black',
        hintText : 'Enter text description here',
        suppressReturn:false,
        height : 200,
        top : 100,
        width : 250,
        keyboardType : Titanium.UI.KEYBOARD_NAMEPHONE_PAD,
        returnKeyType : Titanium.UI.RETURNKEY_DEFAULT,
        borderStyle : Titanium.UI.INPUT_BORDERSTYLE_ROUNDED
    });

    // create a button to close window
    var closeButton = Titanium.UI.createButton({
        title : 'Save text',
        height : 40,
        left : 40,
        top : 50,
        width : 100
    });

    // create a button to close window
    var cancelButton = Titanium.UI.createButton({
        title : 'Cancel',
        height : 40,
        left : 180,
        top : 50,
        width : 100
    });

    noteWin.add(noteField);
    noteWin.add(closeButton);
    noteWin.add(cancelButton);

    closeButton.addEventListener('click', function() {
        var t3 = Titanium.UI.create2DMatrix();
        t3 = t3.scale(0);
        noteWin.close({
            transform : t3,
            duration : 300
        });
        addEvent('Event', noteField.value);
    });

    cancelButton.addEventListener('click', function() {
        var t3 = Titanium.UI.create2DMatrix();
        t3 = t3.scale(0);
        noteWin.close({
            transform : t3,
            duration : 300
        });
    });

    noteWin.addEventListener('singletap', function(e) {
        noteField.blur();
    });
    noteWin.addEventListener('open', function(e) {
        noteField.focus();
    });

    noteWin.open(a);
});

Solution

  • Try to add the "zIndex:1000" property to the modal window to make sure that it is not hidden by another one.