Question

我是appcelerator的新手。我正在关注一个教程，其内容应该在主窗口上，但我的代码在启动画面上显示主要内容。当我按回键时，它显示主窗口但没有内容。这是我的主窗口代码。

var win = Ti.UI.currentWindow;

//-- Create the sub windows
var crusts = Ti.UI.createWindow();
var toppings = Ti.UI.createWindow();
var details = Ti.UI.createWindow();

//-- We set the background here since this wont change
win.backgroundImage = '../images/bg_main.png';

//-- Include our clock
Ti.include('../includes/clock.js');

//-- The method will close the toppings window and open the crusts window    
function openCrust(e) {
    crusts.url = 'crusts.js';
    crusts.open();
    Ti.Ti.API.log('info', 'openCrust Called.');
}

openCrust({});

此处crust.js是主要内容窗口，其代码为。

var win = Ti.UI.currentWindow;

//-- Our crust views
var handMade = Ti.UI.createView({width:216,height:156,backgroundImage:'../images/crust/hand.png'});
var natural = Ti.UI.createView({width:216,height:156,backgroundImage:'../images/crust/natural.png'});
var panCrust = Ti.UI.createView({width:216,height:156,backgroundImage:'../images/crust/pan.png'});
var stuffedCrust = Ti.UI.createView({width:216,height:156,backgroundImage:'../images/crust/stuffedCrust.png'});
var thinNCrispy = Ti.UI.createView({width:216,height:156,backgroundImage:'../images/crust/thinNcrispy.png'});
var returnCrust;

//-- Crust reference
var crusts = [
    {title:'Hand Made',path:'../images/crust/hand.png'},
    {title:'Natural',path:'../images/crust/natural.png'},
    {title:'Pan Crust',path:'../images/crust/pan.png'},
    {title:'Stuffed Crust',path:'../images/crust/stuffedCrust.png'},
    {title:'Thin N Crispy Crust',path:'../images/crust/thinNcrispy.png'}
];

//-- Our scroll view that contains our crust views
var scrollView = Ti.UI.createScrollableView({
    views:[handMade,natural,panCrust,stuffedCrust,thinNCrispy],
    showPagingControl:true,
    clipViews:false,
        top:180,
        left:30,
        right:30,
        height:180,
        opacity:0
});

//-- Crust title
var crustTitle = Ti.UI.createLabel({
    text:'1. Choose a crust',
        font:{
            fontFamily:'Verdana',
            fontWeight:'bold',
            fontSize:24
        },
        color:'#A90329',
        shadowColor:'#333',
        shadowOffset:{x:1,y:1},
        textAlign:'left',
        width:Ti.Platform.displayCaps.platformWidth,
        height:58,
        left:10
});

//-- Crust title background
var crustTitleView = Ti.UI.createView({
        width:328,
        height:58,
        backgroundImage:'../images/crustHeaderBg.png',
        top:100,
        left:-6,
        opacity:0
});
crustTitleView.add(crustTitle);

//-- Crust type label
var crustType = Ti.UI.createLabel({
        text:'Hand Made',
        font:{
            fontFamily:'Verdana',
            fontWeight:'bold',
            fontSize:16
        },
        color:'#fff',
        shadowColor:'#333',
        shadowOffset:{x:1,y:1},
        textAlign:'center',
        width:Ti.Platform.displayCaps.platformWidth,
        height:20,
        top:170,
        opacity:0
});

//-- Next Button
var next = Ti.UI.createButton({
        width:137,
        height:75,
        backgroundImage:'../images/toppings_next.png',
        top:385,
        opacity:0
});

//-- If android OS, use the image property instead of backgroundImage (Ti SDK bug)
if (Ti.Platform.osname == 'android')
{
    next.image = '../images/toppings_next.png';
}

next.addEventListener('click',function(e){
    Ti.App.fireEvent('toppings',{
        crust:crusts[scrollView.currentPage].title,
        path:crusts[scrollView.currentPage].path
    });
});

win.add(scrollView);
win.add(crustTitleView);
win.add(crustType);
win.add(next);

//-- Fade the scrollview in
scrollView.animate({
    opacity:1,
    duration:500
});

//-- Fade the crust title in
crustTitleView.animate({
    opacity:1,
    duration:500
});

crustType.animate({
    opacity:1,
    duration:500
});

//-- Fade the next button in
next.animate({
    opacity:1,
    duration:500
});

//-- Changes the crust type label text when the user scrolls
scrollView.addEventListener('scroll',function(){
    crustType.text = crusts[scrollView.currentPage].title;
});

以下是结果截图。

带有实际结果的图片：https://www.dropbox.com/s/m58pvx2dvde2xy7/actual%20result.png?dl=0

带有所需结果的图片：https://www.dropbox.com/s/dslr4ilgo8ro9yf/desired.jpg?dl=0

请告诉我哪里出错了。感谢。

Answer 1

您无法使用../images/XXX之类的路径引用图片。 /images被视为图形资源的根文件夹。

尝试更改窗口背景的路径

win.backgroundImage = '/images/bg_main.png';

Titanium：应用程序在启动画面而不是主窗口上显示主要内容

1 个答案: