在流體/響應式設計中使用鈦的百分比

Question

使用Titanium Appcelerator使用百分比時有沒有辦法。用於流體和響應式設計;否則看起來像我將與所有設備的IF ELSE語句拼搏！

原始代碼

WebViewWindow=Titanium.UI.createWebView({ 
    html:globalHTMLHeadert, 
    visible:true, 
    width:100%, //note I have tried also "100%" with/out comma 
    left:0, 
    bottom:30%, 
    zIndex:400 
}); 

我想

WebViewWindow=Titanium.UI.createWebView({ 
    html:globalHTMLHeadert, 
    visible:true, 
    width:320, 
    left:0, 
    bottom:150, 
    zIndex:400 
}); 

Answer 1

簡單。

創建一個名爲frames.js

/* 
* Frames 
* @ We uses this framework to allow mobility for responsive design 
* @ Each variable is used and this is the width based on the device 
*/ 
// 100% 
var per100 = Math.floor(Titanium.Platform.displayCaps.platformWidth * 1.0); 
// 90% 
var per90 = Math.floor(Titanium.Platform.displayCaps.platformWidth * 0.9); 
// 80% 
var per80 = Math.floor(Titanium.Platform.displayCaps.platformWidth * 0.8); 
// 50% 
var per50 = Math.floor(Titanium.Platform.displayCaps.platformWidth * 0.5); 
// 40% 
var per40 = Math.floor(Titanium.Platform.displayCaps.platformWidth * 0.4); 
// 25% 
var per25 = Math.floor(Titanium.Platform.displayCaps.platformWidth * 0.25); 
// 10% 
var per10 = Math.floor(Titanium.Platform.displayCaps.platformWidth * 0.10); 
// 5% 
var per5 = Math.floor(Titanium.Platform.displayCaps.platformWidth * 0.5); 
// 1% 
var per1 = Math.floor(Titanium.Platform.displayCaps.platformWidth * 0.1); 

現在包括在你的js文件，例如app.js

您可以使用像這樣的新的文件，這將是一個流體按鈕，90％

var btngeorgia=Titanium.UI.createButton({ 
    color:'#d8d8d8', 
    borderRadius:'2px', 
    height:30, 
    width:per90, 
    zIndex:800, 
    left:10, 
    bottom:100, 
    title:'Georgia', 
    font:'Georgia', 
}); 

這將是100％的流體設備寬度

WebViewWindow=Titanium.UI.createWebView({ 
    html:globalHTMLHeadert, 
    visible:true, 
    width:per100, 
    left:0, 
    bottom:220, 
    zIndex:300 
}); 

Answer 2

以下網站來自開發者博客。它會談論一個包含在1.7中的屬性，以便鈦可以自動擴展您的應用程序。

打開此選項意味着你不需要計算百分比或類似的東西。如果它在iPhone模擬器上看起來不錯，它將在所有設備上縮放以保持一致。

http://developer.appcelerator.com/blog/2011/06/new-defaults-for-android-layouts-in-1-7.html

它還提到使用「15dp」的密度像素，這將給你一個統一的像素尺寸無論什麼屏幕分辨率您的。

最後你可以在你的應用程序中使用百分比，例如寬度：'100％'。

http://developer.appcelerator.com/question/46501/using-percentages-to-set-sizes

這裏是有人沒有使用引號後，後來標誌着答案正確