createButton and backgroundImage

I have a tableview which I am using to display contact information. I have been trying to create a mail button but I have been unable to set a backgroundImage. I have been using the following code:

var mailMe=Titanium.UI.createButton({

I have tried setting it from the createButton method, setting it from an event handler and changing the background, setting the backgroundImage, backgroundImageselected at creation, I tried moving the images to a different folder as explained here but have been unable to get it to work. I even tried using image instead of backgroundImage and have been unable to get it to work.

Any help would be appreciated!

2 Answers

  • Accepted Answer

    I finally got it working.

    My app.js opens a file in a folder called main-windows. However, as I went through the code to try to figure out what was wrong, I realized that in my code I was calling the
    however, when I changed it to
    it all started working properly.

    Thank you Christian and Kevin for all your help!

    So if you have this problem, make sure all your references are correct because although the main.js did open up, that is what prevented the backgroundImage from showing!

  • i guess you're using the android platform, if so, those properties (like backgroundImage) are only available in the constructor of the object, which means you can't change them at runtime.

    my solution to this problem was creating a button while using an imageview. if you wrap this inside a custom function, you may even be able to get off/on state behaviour by using touch-event listeners

    as it's true that there are quite some properties missing for the android implementation of ti-mobile, one often is able to code around them by using custom function or creating javascript classes that result in similar behaviours

    — answered 5 years ago by Christian Sigl
    • I am actually using the iPhone platform as you can see in the tags. I still haven't been able to get it to work though.

      — commented 5 years ago by Abraham Vivas
    • sorry, you are speaking about no being able to get the initial image working, or not being able to change the image afterwards?

      — commented 5 years ago by Christian Sigl
    • Neither. I can't set the initial image and I also tried by changing it afterwards and haven't been able to either. I get a blank button that turns blue when clicked.

      — commented 5 years ago by Abraham Vivas
    • please try to put the pic in the same directory your js-code is located at. does this work?

      — commented 5 years ago by Christian Sigl
    • and of course remove the path in the backgroundImage-property

      — commented 5 years ago by Christian Sigl
    • Tried both backgroundImage: and image: to no avail. I get either a white button that changes color, or nothing at all when using backgroundImage. Yet the event listener fires events properly.

      — commented 5 years ago by Abraham Vivas
    • could you try to set the title-property to ''? i looked at my code a moment ago, and can't find any problem with yours. also try to put this properties into it. maybe the on/off state properties are needed for custom button images

      backgroundDisabledImage: 'images/bg_but_login_off.png',

      — commented 5 years ago by Christian Sigl
    • Here is my code now:

      backgroundDisabledImage: '../img/mail_off.png'

      and I still get nothing but this:


      — commented 5 years ago by Abraham Vivas
    • It could be that button has a bug where backgroundImage isn't respected when inside a table view. As Christian suggested, you might need to use an image view or a regular view with a background image to get the effect you're looking for. Have you been able to produce a simple test case where we could see this behavior in action ourselves?

      — commented 5 years ago by Kevin Whinnery
    • It could be that.
      Here is a test case so you can see the behavior in action. There is also a screenshot of the results in the zip file.

      Thanks for all your help.

      — commented 5 years ago by Abraham Vivas
    • I tried using an imageView….here is the code:

      var mailMe=Titanium.UI.createImageView({

      And when compiling i get this error:

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

      — commented 5 years ago by Abraham Vivas
    • Update #3

      The image from the test case (previous 2 comments) does work on Android, not on the iPhone.

      — commented 5 years ago by Abraham Vivas