Question

我正在尝试使BitmapImage标记与其容器一样宽，同时缩放位图。我使用这个代码实现了它，我认为你会发现它很明显：

<s:BitmapImage id='image' width='100%' source='assets/eyes.jpg' scaleMode="letterbox"/>

我遇到的问题是在容器宽度和图像大小的某些组合下，位图根本不显示。我减少了问题，发现如果我向上（或向下）BitmapImage的高度（例如使用计时器），它会完美显示。所以我假设问题与高度是一些奇怪的十进制数有关（尽管它确实适用于一些非整数高度）。

有人发现了同样的问题吗？我有代码可以在需要时重现它。

Answer 1

 <s:Group id="grp" width="50%" height="50%" horizontalCenter="0" verticalCenter="0" color="RED" >




<s:BitmapImage id="bmpImg" depth="100" width="{grp.width - 20}" height="{grp.height - 30}"
               source="@Embed('assets/image1.jpg')"
               horizontalCenter="0" verticalCenter="0">
    <s:mask>
        <s:BorderContainer id="bmpMask"
                           cornerRadius="{sl.value}"
                           width="{bmpImg.width}" height="{bmpImg.height}" />
    </s:mask>
</s:BitmapImage>
</s:Group>

Answer 2

  <s:controlBarContent>
    <mx:Form id="fid">
        <mx:FormItem id="fiid" label="cornerRadius:">
            <s:HSlider id="sl"
                       minimum="0"
                       maximum="{bmpImg.height/2}" />
        </mx:FormItem>
    </mx:Form>
</s:controlBarContent>
<s:Group id="grp" width="50%" height="50%" horizontalCenter="0" verticalCenter="0" color="RED" >




<s:BitmapImage id="bmpImg" depth="100" width="{grp.width}" height="{grp.height}"
               source="@Embed('assets/image1.jpg')"
               horizontalCenter="0" verticalCenter="0">
    <s:mask>
        <s:BorderContainer id="bmpMask"
                           cornerRadius="{sl.value}"
                           width="{bmpImg.width}" height="{bmpImg.height}" />
    </s:mask>
</s:BitmapImage>
</s:Group>

如何使BitmapImage适合其容器的宽度？

2 个答案: