Titanium Community Questions & Answer Archive

We felt that 6+ years of knowledge should not die so this is the Titanium Community Questions & Answer Archive

images on iphone

i'm running circles right now…

i try to show an image on an iphone. but it doesn't work - obviously.

i see the images in the kitchensink app, so it is working. but not with my app. here's the code i use:

http://pastebin.com/ZMRdKvWZ

the images are in /Resources/images

— asked November 25th 2010 by marcin kolonko
  • images
  • iphone
0 Comments

8 Answers

  • thanks, but i just found out. although i would like your comment on this:

    app.js
    the interesting part is: url:"view/ErmittlungAltanlage.js" -> relative

    ErmittlungAltanlage.js (i shortened it) -> as you can see, all references to images are as well relative.

    with absolute urls, i couldn't get it to work on iphone. -> no problem on android though.
    in app.js, i used: url:"/view/ErmittlungAltanlage.js" -> absolute
    and in ErmittlungAltanlage.js i used image:"/images/someimage.png" -> absolute url as well.

    any thoughts on that?

    thx

    ps.: i'm using 1.4.3 sdk for iphone

    — answered November 25th 2010 by marcin kolonko
    permalink
    2 Comments
    • as before:

      /Resources/app.js, /Resources/view/ErmittlungAltanlage.js, /Resources/images/anyimage.png

      — commented November 25th 2010 by marcin kolonko
    • if you look at the tests in included in my last post, you will see the you need the complete path OR a relative path. Just putting "/Resources/images/anImage.png will not work you need

      var path = Titanium.Filesystem.resourcesDirectory + 
         Titanium.Filesystem.separator +
         "images/SmallHouse.png";
      

      — commented November 25th 2010 by Aaron Saunders
  • your path for the images in incorrect should be

    Titanium.UI.createImageView({
                                url:"images/SmallHouse.png", 
                                touchEnabled:false, 
                                left:77, 
                                top:65});
    

    remove the first "/"

    — answered November 25th 2010 by Aaron Saunders
    permalink
    1 Comment
    • right, but only when the .js file is in the Resources folder.

      my .js file is here: /Resources/view/foo.js
      the images are: /Resources/images/SmallHouse.png

      — commented November 25th 2010 by marcin kolonko
  • Marcin

    In contrast to the other answer, I think your image paths are fine - the preceding forward-slash is equivalent to the Resources folder, so as long as your images are in Resources/images/ then there should be no problem. In fact, I always use absolute paths like these.

    However, you are using the url property for createImageView, which is deprecated, rather than the image property. Hence, code like:

    var iconOil = Titanium.UI.createImageView({
      url:"/images/SmallHouse.png",
      touchEnabled:false,
      left:77,
      top:65
    });
    

    should be:

    var iconOil = Titanium.UI.createImageView({
      image:"/images/SmallHouse.png", 
      touchEnabled:false, 
      left:77, 
      top:65
    });
    

    Hope this resolves your issue. If not, let us know

    — answered November 25th 2010 by Paul Dowsett
    permalink
    4 Comments
    • @Hal the url property has been deprecated but it should still work?

      // we can't have dualing properties that do the same thing or we get into big
      // trouble in tableview repaints
      -(void)setUrl_:(id)img
      {
          NSLog(@"[WARN] the 'url' property on ImageView has been deprecated. Please use 'image' instead");
          // setImage_ does the property replacement for us; no need to do it twice.
          [self setImage_:img];
          return;
      }
      

      — commented November 25th 2010 by Aaron Saunders
    • your right… but i was aware of this and tried it with "image" as well. it's a bit unfortunate that i postet it like this…
      but wichever way, the result is the same: no images.

      — commented November 25th 2010 by marcin kolonko
    • by the way: app.js looks like this http://pastebin.com/gitFsFPg

      — commented November 25th 2010 by marcin kolonko
    • I expected the url property to have been phased out in 1.5. I stand corrected.

      — commented November 25th 2010 by Paul Dowsett
  • I got this approach to work

    image: "../images/SmallHouse.png",
    

    I believe that path needs to be relative to where the .js file is located. I just tested this and it appears to be working, let me know how it turns out

    in response to Hal's comments about using relative paths, this will also work

    var path = Titanium.Filesystem.resourcesDirectory + 
       Titanium.Filesystem.separator;
    Titanium.API.info("--> " + path);
    var imageView = Titanium.UI.createImageView({
                                image: path + "images/SmallHouse.png", 
                                touchEnabled:false, 
                                left:77, 
                                top:65});
    
    — answered November 25th 2010 by Aaron Saunders
    permalink
    2 Comments
    • Aaron

      The trouble with that approach is that you need to know where the context is, and so a relative path won't work in some circumstances. I've been told by appcel staff before that it's generally better to use absolute paths. If you need different images in different circumstances (theming etc), then you can wrap it in a function that contains the logic you need, but for that function to again return an absolute path.

      Having said that, a relative path can certainly work, so it's ultimately the developer's choice.

      — commented November 25th 2010 by Paul Dowsett
    • @Hal the code below doesn't work? There must be something else going on… Also although the staff recommends against using relative paths, they are utilized all over the kitchen sink example that we are told to use as a reference.

      like you said, in the end it is the developers choice, but as of now there doesn't appear to be another option

      — commented November 25th 2010 by Aaron Saunders
  • Marcin

    As your pastebin is long, and contains lots of references to images that will cause exceptions if we try to run it in our environment, if you like you could zip the Resouces folder and upload it somewhere. Then someone can take a look and get this working for you.

    Cheers

    — answered November 25th 2010 by Paul Dowsett
    permalink
    0 Comments
  • test one

    var imageView = Titanium.UI.createImageView({
                                image: "images/appcelerator_small.png", 
                                touchEnabled:false, 
                                left:77, 
                                top:65});
    

    outputs this

    [ERROR] Failed to load image: file://localhost/Users/aaronksaunders/dev/projects/titanium/test1/Resources/view/images/appcelerator_small.png, 
    Error: Error Domain=ASIHTTPRequestErrorDomain Code=1 "A connection failure occurred" 
    UserInfo=0x8c0f260 {NSUnderlyingError=0x8c0dfe0 "The operation couldn’t be completed. Connection refused", 
    NSLocalizedDescription=A connection failure occurred}
    

    test two

    var imageView = Titanium.UI.createImageView({
                                image: "/images/appcelerator_small.png", 
                                touchEnabled:false, 
                                left:77, 
                                top:65});
    

    outputs this

    [ERROR] Failed to load image: file://localhost/images/appcelerator_small.png, 
    Error: Error Domain=ASIHTTPRequestErrorDomain Code=1 "A connection failure occurred" 
    UserInfo=0x8c0f9a0 {NSUnderlyingError=0x8c05df0 "The operation couldn’t be completed. Connection refused", 
    NSLocalizedDescription=A connection failure occurred}
    

    it is not a problem in his code, it is a problem in the way the imageView is loading the url/image. The only way to make it work, at this time, is to specify the full path of the image or to use the relative path from the location of the .js loading the imageView.

    Maybe this is a bug??

    — answered November 25th 2010 by Aaron Saunders
    permalink
    0 Comments
  • well, i think this is definitly a design flow.

    there is no reason why android should get the paths right while the iphone doesn't.
    it just doesn't make sense.

    — answered November 26th 2010 by marcin kolonko
    permalink
    0 Comments
  • Marcin

    I think I have found the reason. Take a look at ticket #1986. If you sign up with LH, and watch the ticket, it will email you any developments on the status of the issue.

    — answered November 26th 2010 by Paul Dowsett
    permalink
    0 Comments
The ownership of individual contributions to this community generated content is retained by the authors of their contributions.
All trademarks remain the property of the respective owner.