titanium-mobileappcelerator-mobiletitanium-android

Android Titanium - ImageView doesn't show a remote image


I have to download a remote image and show it in a ImageView. In iOS works prefectly but in Android doesn't work. The image size is 190x190, and the url is correct because the same url works in iOS. This is my code:

View:

<ScrollView id="scrollView" showVerticalScrollIndicator="true">
   <Label id="titleLabel"></Label>
   <ImageView id="qr"></ImageView>

   <View id="codigoView">
      <Label id="codigoLabel"></Label>
      <Label id="numeroLabel"></Label>
   </View>

   <Button id="condicionesButton" onClick="condicionesAction"></Button>
   <Button id="localizacionButton" onClick="localizacionAction"></Button>
   <Button id="emailButton" onClick="emailAction"></Button>
</ScrollView>

Style:

"#qr":{
    top: 5,
    width: 190,
    height: 190
}

Controller:

var qrString = args.get('qrcode');
$.qr.image = Alloy.Globals.qr_url + qrString;

$.qr.addEventListener('load', function(e){
    alert('Picture loaded');
});

This alert does never showed.

The url is:

https://api.qrserver.com/v1/create-qr-code/?size=190x190&data="akjlsdfkjalskdjfal"

And the image is a png.

My question in Appcelerator Q&A

EDIT:

This can cause the problem?

For Android, if there is a redirect and change in protocol, it will not follow. For example, from http to https and vice versa


Solution

  • I've tried to implement your example, and anything works fine, both on iOS and Android!

    This is index.xml (view):

    <Alloy>
        <Window class="container">
            <ImageView id="qr"/>
        </Window>
    </Alloy>
    

    And this is index.js (controller):

    $.qr.addEventListener('load', function() {
        alert('picture loaded');
    });
    $.qr.image = "https://api.qrserver.com/v1/create-qr-code/?size=190x190&data=akjlsdfkjalskdjfal"
    $.index.open();
    

    There are no problems of any type: no redirects and no changes in the used protocol! Anything seems to be ok.

    Your problem is probably due to the fact that you add the EventListener after the operation that can fire the event! Indeed, if the event 'load' is fired very soon there is nothing which is listening for it!!

    Even if the problem is not caused by that, remember to add the EventListener always before the lines which could fire the event!