I’ve got a feeling that images loaded from http & <ImageFill Url="{url}" />
are not unloaded from memory after the url
is changed or the imaged is no longer on screen/needed… my app always crashes around 50/60 images
Here is the demo app:
<App>
<JavaScript>
var Observable = require('FuseJS/Observable');
preURL = Observable("");
imgURL = Observable("");
nxtURL = Observable("");
pictureLoaded = Observable("");
imgURLno = 1920;
nxtURLno = 0;
preURLno = 0;
loadSum = 2;
setInterval(function() {
loadSum = loadSum + 1
imgURLno = imgURLno + 1; nxtURLno = imgURLno + 1; preURLno = imgURLno - 1;
imgURL.value = "https://res.cloudinary.com/demo/image/fetch/https://unsplash.it/1080/"+imgURLno+"/?random"
nxtURL.value = "https://res.cloudinary.com/demo/image/fetch/https://unsplash.it/1080/"+nxtURLno+"/?random"
preURL.value = "https://res.cloudinary.com/demo/image/fetch/https://unsplash.it/1080/"+preURLno+"/?random"
pictureLoaded.value = "total photos in memory "+loadSum+" ?";
}, 5000); // width="1080" height="1921" ios img //url...
module.exports = {
preURL : preURL, imgURL : imgURL, nxtURL : nxtURL, pictureLoaded : pictureLoaded
};
</JavaScript>
<Text Alignment="TopCenter" FontSize="17" Value="main photo" Margin="0,80,0,0"/>
<Rectangle Width="170" Height="200" Alignment="Top" Margin="0,100,0,0">
<ScrollView>
<ImageFill Url="{imgURL}" StretchMode="UniformToFill" MemoryPolicy="UnloadUnused" />
</ScrollView>
</Rectangle>
<Text Alignment="TopCenter" FontSize="17" Value="pre photo" Margin="0,380,200,0" Opacity="1"/>
<Rectangle Width="70" Height="100" Alignment="Top" Margin="0,400,200,0">
<ImageFill Url="{preURL}" StretchMode="UniformToFill" MemoryPolicy="UnloadUnused" />
</Rectangle>
<Text Alignment="TopCenter" FontSize="17" Value="next photo" Margin="0,380,-200,0" Opacity="1"/>
<Rectangle Width="70" Height="100" Alignment="Top" Margin="0,400,-200,0">
<ImageFill Url="{nxtURL}" StretchMode="UniformToFill" MemoryPolicy="UnloadUnused" />
</Rectangle>
<Panel Height="10%" Color="#0008" Alignment="Bottom">
<Text Alignment="Center" FontSize="17" Value="{pictureLoaded}" Color="#fff"/>
</Panel>
</App>
how do i unload the images?