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);
});
Try to add the "zIndex:1000" property to the modal window to make sure that it is not hidden by another one.