Аппселератор титаниум, как мне создать модальное окно?

Это текущий способ сделать это в Titanium версии 3.1.3 для iOS.

Сначала создайте новое окно.

var myModal = Ti.UI.createWindow({
    title           : 'My Modal',
    backgroundColor : 'transparent'
});

Затем создайте представление-оболочку, фоновое представление и представление-контейнер:

var wrapperView    = Ti.UI.createView(); // Full screen
var backgroundView = Ti.UI.createView({  // Also full screen
    backgroundColor : '#000',
    opacity         : 0.5
});
var containerView  = Ti.UI.createView({  // Set height appropriately
    height          : 300,
    backgroundColor : '#FFF'
});
var someLabel      = Ti.UI.createLabel({
    title : 'Here is your modal',
    top   : 40
});
var closeButton    = Ti.UI.createButton({
    title  : 'Close',
    bottom : 40
});
closeButton.addEventListener('click', function () {
    myModal.close();
});

Теперь создайте свой стек пользовательского интерфейса. Порядок важен, чтобы не устанавливать z-index.

containerView.add(someLabel);
containerView.add(closeButton);

wrapperView.add(backgroundView);
wrapperView.add(containerView);

myModal.add(wrapperView);

Теперь вы можете открыть модальное окно, но НЕ устанавливать modal : true

myModal.open({
    animate : true
});

Это очень просто. Просто создайте окно, и когда вы его открываете, укажите для свойства 'modal' значение true!

var ModalWindow = Ti.UI.createWindow({});
ModalWindow.open({modal:true}); 

В Titanium Appcelerator (попробовано в 1.6.2) модальное окно всегда является полноэкранным окном. Родитель может показаться черным, потому что фон этого модального окна черный.

Попробуйте указать полупрозрачное изображение в качестве фона этого модального окна, которое вы создаете, и вы можете получить от него желаемый эффект.

Вы можете попробовать использовать opacity в окне, которое у вас есть, которое перекрывает другое.

Ti.UI.currentWindow.opacity = 0.4;

Если вы на iPhone, возможно, вы не сможете это сделать. на iPhone, если появится модальное диалоговое окно, другое окно в стеке рендеринга будет очищено. То есть только ОДИН модальный диалог в стеке рендеринга. Вот почему вы получили черный цвет, если другие области родителя не закрыты вашим модальным окном. В iPad реализован модальный диалог с использованием стиля «лист», поэтому вы можете сделать области полупрозрачными.

Мне нравится решение, представленное AlienWebguy, хотя я думаю, что есть небольшая ошибка. Когда вы создаете свою метку, я думаю, вы хотели установить свойство text, а не свойство title:

var someLabel = Ti.UI.createLabel({
    text: 'Here is your modal',
    /* etc., etc. */
});

Когда я использовал title, он (метка) не появлялся в окне.

Еще одна модификация, которую я мог бы сделать, — установить свойство макета для представления контейнера, например,

var containerView = Ti.UI.createView({
    height: 100, /* or whatever is appropriate */
    backgroundColor : '#FFF',
    layout: 'vertical'
});

При этом вы можете «складывать» элементы графического интерфейса в этом представлении и не беспокоиться (слишком сильно) об установке координат макета... По крайней мере, это то, что я делаю при создании настраиваемого окна предупреждения, используя методы, описанные здесь.

Я также искал такое окно с полупрозрачным фоном для ios 8.4. Я попробовал способ «AlienWebguy» в Alloy XMl, но проблема заключалась в том, что все окно получало непрозрачность 0,5, а содержимое окна с фоновым стеком было четко видно, чем содержимое переднего плана. я внес некоторые изменения в «AlienWebguy», чтобы получить требуемый результат:

<Alloy>
     <Window backgroundColor="transparent" modal="false">
          <View layout="vertical" width="Ti.UI.FILL" height="Ti.UI.FILL" backgroundColor="#000" opacity="0.5">
                   // View will fill whole window with transparent shade of black color.
          </View>

          <View class="container" zIndex="100" height="400" width="Ti.UI.FILL" backgroundColor="#fff"> 
                  // You can add any content here, which will be look like Modal window.
                  //View automatically vertically centered on screen.
          </View>
     </Window>
</Alloy>

Надеюсь, это сэкономит время разработчиков в Alloy. Спасибо "AlienWebguy" за концепцию.

почему бы просто не сделать его прозрачным фоном?

<Window backgroundColor="#80000000">
    <View class="container">
    // Your views
    </View>
</Window>