4

无论如何使用 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
});
4

2 回答 2

7

简单的。

创建一个名为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.05); 
// 1%
var per1 = Math.floor(Titanium.Platform.displayCaps.platformWidth * 0.01);

现在,在你的 js 文件中包含 frames.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% 流体设备宽度的 Web 视图

WebViewWindow=Titanium.UI.createWebView({
    html:globalHTMLHeadert,
    visible:true,
    width:per100,
    left:0,
    bottom:220,
    zIndex:300
});
于 2012-05-02T16:01:32.807 回答
1

以下网站来自开发者博客。它谈到了 1.7 中包含的一个属性,可以交换,以便钛自动为您扩展您的应用程序。

打开此选项意味着您不需要计算百分比或类似的东西。如果它在 iphone 模拟器上看起来不错,它将缩放到在所有设备上看起来都一样。

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

它还提到使用“15dp”作为密度像素,无论您使用什么屏幕分辨率,它都会为您提供统一的像素大小。

最后,您实际上可以在您的应用程序中使用诸如 width:'100%' 之类的百分比。

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

这是一个帖子,有人没有使用引号,后来将答案标记为正确

于 2012-05-03T14:23:27.547 回答