Appcelerator鈦，我怎樣才能創建一個模態窗口？

Question

我是新來Appcelerator的鈦和有問題

我怎麼可以創建一個模糊其父模式窗口，或有一個半透明的背景？我設法創建一個模式窗口，但家長一黑。

在此先感謝

Answer 1

在Appcelerator的鈦（1.6.2試過）模式窗口始終是一個全屏窗口。父母可能看起來是黑色的，因爲這個模式窗口的背景是黑色的。

嘗試指定半透明圖像作爲此模式窗口的背景，您正在創建，您可能會從中獲得所需的效果。

Answer 2

您可以嘗試在您有覆蓋另一個的窗口上使用opacity。

Ti.UI.currentWindow.opacity = 0.4; 

Answer 3

它非常simple.Just創建的窗口，當你打開它，指定「模式」屬性爲true！

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

Answer 4

如果你在iPhone上，可能你無法做到。在iPhone上，如果出現模式對話框，則渲染堆棧上的其他窗口將被清除。也就是說，渲染堆棧中只有一個模態對話框。這就是當父母的其他區域沒有被你的模態窗口覆蓋時變黑的原因。 iPad使用「工作表」樣式實現了模式對話框，因此您可以將「半透明」區域設置爲半透明區域。

Answer 5

這是從iOS 3.1.3開始在Titanium中實現此目標的最新方法。

首先，創建一個新窗口。

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(); 
}); 

現在建立自己的UI棧。順序對於避免必須設置z-index很重要。

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

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

myModal.add(wrapperView); 

現在你可以打開你的模式，但沒有設置modal : true

myModal.open({ 
    animate : true 
}); 

Answer 6

我喜歡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' 
}); 

在這一過程中，你可以「堆疊」了該視圖中的GUI元素，而不是擔心（太很多）關於設置佈局座標...至少這就是我使用這裏概述的技術創建定製警報框的過程。

Answer 7

我還在爲ios 8.4尋找這樣的半透明背景窗口。我在Alloy XMl中嘗試了「AlienWebguy」的方式，但問題是整個窗口變得不透明度爲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> 

希望這將節省開發商合金做的時間。感謝「AlienWebguy」這個概念。

Answer 8

爲什麼不給它透明的背景？

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