titanium - 查看钛金属 TSS

Question

您好，我是钛合金新手，不知道如何使用 TSS 创建流体设计。如何放置三个 View ，一个作为页眉 (20%)，两个作为内容支架 (60%)，三个作为页脚 (20%)，全宽 (Ti.UI.FILL)。我的代码是，

index.xml

<Alloy>
   <Window class="container">
       <Require src="home" id="home"></Require>
   </Window>
</Alloy>

home.xml

<Alloy>
    <View id="header"></View>
    <View id="content"></View>
    <View id="footer"></View>
</Alloy>

home.tss

"#home": {
    layout: 'vertical',
    width: Ti.UI.FILL,
    height: Ti.UI.FILL,
    backgroundColor: '#000'
},
'#header':{
    layout: 'horizontal',
    height: '20%',
    width: Ti.UI.FILL,
    backgroundColor: '#fff'
},
'#content': {
    layout: 'vertical',
    height: '60%',
    width: Ti.UI.FILL,
    backgroundColor: '#ccc'
},
'#footer': {
    layout: 'horizontal',
    height: '20%',
    width: Ti.UI.FILL,
    backgroundColor: '#fff'
}

我尝试的是将后退按钮(左)、标题(中)和刷新按钮(右)作为水平布局放置在标题 View 中，并将应用内容放置在内容 View <中/strong> 并在页脚 View 中进行一些滚动选择(即，我们可以通过在其上放置选项来使用幻灯片事件进行滚动)。如果我运行此代码， View 最终会被划分为 this 60% 的人的内容 View 不受影响。我已经在 appcelerator 论坛中询问过，但尚未得到答复。希望这会有所帮助。

Answer 1

您的 id 为“home”的对象实际上并不是一个 View ，它只是对 home 类的引用，因此您不能像这样将样式归因于它。

我会像这样重新放置 home.xml:

<Alloy>
    <View id="homeHolder">
        <View id="header"></View>
        <View id="content"></View>
        <View id="footer"></View>
    </View>
</Alloy>

然后这就会像你期望的那样工作

"#homeHolder": {
    layout: 'vertical',
    width: Ti.UI.FILL,
    height: Ti.UI.FILL,
    backgroundColor: '#000'
}