Question

我正在使用Appcelerator平台开发应用程序，但我遇到了一个问题。

我有一个带有自定义模板的列表视图，其中我使用远程图像（许多不同大小）填充ImageView。我希望它们扩展到100％宽度和自动高度（Ti.UI.Fill和Ti.UI.SIZE的宽度和高度）。

如果我没有为图像的容器设置高度，这是有效的，但是我希望我的所有ListItem都具有相同的高度并屏蔽来自太高图像的任何溢出。

当我设置固定高度时，它会尝试将图像放入容器中，因此左/右或上/下有边框，具体取决于图像的纵横比（似乎忽略了Ti.UI.Fill）

使用ScrollView作为容器并禁用滚动来实现我想要的功能有一个技巧，但在Listview中添加ScrollView会使应用程序崩溃。

这可以实现吗？

编辑：添加一些示例代码。

这是我的模板声明：

            <Templates>
            <ItemTemplate name="eventsListTemplate">
                <Label bindId="name" id="name" />
                <View id="coverContainer">
                    <ImageView bindId="cover" id="cover" />
                    <View id="overlay"></View>
                </View>
                <Label bindId="startTime" id="startTime" />
                <Label bindId="place" id="place" />
            </ItemTemplate>
        </Templates>

这是我用数据填充listitem的地方：

            var mapped = _.map(events,function(event){
            return {
                name : { text : event.name },
                cover : { image : (event.cover) ? event.cover.source : ''},
                startTime : { text : Alloy.Globals.formatDate(event.startTime) },
                place : { text : (event.place) ? event.place.name : event.owner.name },
                id : event.id
            };
        });

相关风格：

"#cover" :{
width: Titanium.UI.FILL,
height : Titanium.UI.SIZE
},
"#coverContainer":{
height: 120
},

Answer 1

好的，所以我没有自动了解如何使用Titanium。

幸运的是，我可以控制远程数据，并能够将图像的原始宽度和高度包含在数据中。

因此，如果您为ImageView设置固定值，它不会再尝试使用它本身并使用它们。然后，根据设备的宽度计算图像的新尺寸并分配这些尺寸（在高度最终低于容器的情况下加上一些条件）。

如果这是web开发设置宽度：100％;身高：自动;加上oveflow：隐藏;因为容器会完成这个伎俩。

Answer 2

如果有一些代码可以检查，你能不能把你的一些xml和js代码放到一边回答。

此外，我认为您必须使用绑定ID在您创建的模板中显示这些图像。如果是，那么将图像传递给元素，您可以传递您想要设置的高度和宽度。对于从遥控器获得的每个图像，如果您的模板具有图像视图，那么它将是这样的。

    var data.bindId = {image : "image from the remote", height: Ti.UI.SIZE, width:Ti.UI.Fill};

将上面代码中的bindId替换为您正在使用的任何bindId，data是您必须传递给列表视图的对象。

ListView中的ImageView缩放

2 个答案: