Question

SDK Version 6.0.1.GA

我试图简化我的情况

查看1 ，查看父级
查看2/3 ，视图1的儿童
视图3必须自动高度，所以我使用 Ti.UI.FILL 。并始终在底部0 （视图1）。

问题是视图2的大小。应该占用视图3的未使用空间。

我尝试了几种解决方案（例如设置布局垂直于视图1，更改视图顶部2-3，将视图2的高度更改为Ti.UI.SIZE / Ti.UI.FILL），但是放置视图2中没有出现在图像中。我认为不可能在不知道视图高度的情况下做我想做的事情3.有一个解决方案吗？

Answer 1

在一行中：由于以下原因无法做到你想做的事情：

每当我们在其中添加内容时，视图的高度就会向下增加。所以View 2永远不会是Ti.UI.SIZE高度以及View 3.要么View应该有一个有限的高度，而另一个应该根据那个高度有顶/底。
顶部/底部属性仅定义透视视图的位置，但不定义高度变化的方式（第1点）。

如果您可以通过提供一些UI屏幕或您想要创建的UI类型为我们提供更清晰的想法，我们可以为您提供更多帮助，因为我从来不需要创建这种类型的视图布局，所以可能会有其他满足您要求的方法。

Answer 2

基本上，您的View 2应该有top = 0和bottom=View3.height，但您的主要问题是您没有View 3的确切高度，因为它设置为Ti.UI.SIZE

为了实现这一点，你必须监听View3的postlayout事件并通过rect属性获得它的确切高度。

rect属性是一个只读字典，其属性为x，y，宽度和高度。它提供了渲染的大小和位置查看，并且只有它和它的祖先一直可用完全画出来。

这是一个适用于Android和iOS的工作代码：

查看XML：

<Alloy>
<Window class="container">
    <Button onClick="doClick" top="30">load new text</Button>
    <ScrollView id="scrollView" top="100">
        <View height="500" backgroundColor="red">
            <Label top="0" text="top label"/>
            <Label text="middle label"/>
            <Label bottom="0" text="bottom label"/>
        </View>
    </ScrollView>
    <View id="containerDynamic" onPostlayout="postlayoutB" height="Ti.UI.SIZE" layout="vertical">
        <Label id="label_2" text=""/>
    </View>
</Window>

Tss文件

".container": {
    backgroundColor:"white"
}

"Label": {
    width: Ti.UI.SIZE,
    height: Ti.UI.SIZE,
    color: "#000"
}

"#label": {
    font: {
        fontSize: 12
    }
}

"#containerDynamic": {
    bottom: 0,
    backgroundColor: "lightgray"
}

"#scrollView": {
    top: 0,
    backgroundColor: "green",
    showScrollbars: true
}

JS档案

var lorem = "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
function doClick(e) {
    var random = getRandomArbitrary(1,lorem.length);
    var text = lorem.substring(lorem.length-random, random);
    $.label_2.text = text;
}


$.index.open();

function postlayoutB(e){
    $.scrollView.bottom = e.source.rect.height
}

function getRandomArbitrary(min, max) {
  return Math.random() * (max - min) + min;
}

通过将此代码复制到一个新项目（index.js，index.xml，index.tss）来运行此代码

了解它，然后相应地将其应用到您的应用

我希望我能得到一些帮助。

iOS - Appcelerator：垂直布局问题

2 个答案: