Question

我在最近的一个项目中遇到了这个问题，当时艺术部门的人注意到图像质量下降。我不确定是什么导致它，但我们能够通过删除它嵌套的ScrollView来解决问题。但这不是一个可行的解决方案，因为我们需要在嵌套在滚动视图中的视图中嵌套图像。

我的代码看起来像：

<View>
    <ScrollView>
         <View>
              <ImageView image="someImage.png" />
         </View>
    </ScrollView>
</View>

当我们从嵌套的ScrollView和它的直接父视图中删除ImageView时，渲染效果很好。我用一个简单的项目创建了一个repo来说明这一点。暗淡效果最明显的是字母的颜色，文本上的白色阴影和灰色边框的模糊。

https://bitbucket.org/bwellons/blurry-images

这是一个需要报告的错误，还是某个地方的文档说“不要这样做”，我不知道？

此致布兰特

Answer 1

我认为这是因为没有以一致的方式定义视图的边界（宽度，高度）和锚点（顶部，左侧，右侧，底部），例如，如果我只是更改它：

".parent": {
    width: '100%',
    height : 59,
}

对此：

".parent": {
    top : 0,
    width: '100%',
    height : 59
}

模糊消失了。我认为这是因为你在一个紧密绑定的框中混合相对和绝对视图布局技术（百分比和绝对像素）（.parent视图与子图像视图的高度完全相同），这导致下面的布局计算在父视图中绘制图像时略微捏造。

我之所以这样说是因为通过为转换错误留出更多空间，这也可以明显消除模糊：

".parent": {
    width: '100%',
    height : 62 // Added 3 pixels of padding
}

以下是一些其他方法，通过对宽度和高度使用相同的布局机制，或为变换提供更多空间：

".parent": {
    width: '100%',
    height : '50%' // Dont do this, but shows the point
}

".parent": {
    bottom : 0,
    width: Ti.UI.FILL, // I use Ti.UI.FILL instead of 100% generally
    height : 59
}

因此，除非您愿意在父级中给出一些摆动空间，或者定义锚点（顶部，左侧，右侧，底部）以进行绘制转换，否则请远离嵌套视图链尺寸中的混合百分比和绝对值。锻炼。

免责声明：我只是基于大约15-20种不同的有限布局测试和我自己的经验（我还没有通过本机代码）这个陈述，所以这绝不是科学。 < / p>

嵌套视图会降低图像质量

1 个答案: