4 Answers

• Yes, create an app level event listener that contains the code that is common for your app. Then, within the eventlistener for each picker, fire that event with the necessary data to your custom event listener.

  Ti.App.addEventListener('custom_event', function(e) {
    // Common app code
  });
  
  // You picker listener
  somepicker.addEventListener('change', function(e) {
    Ti.App.fireEvent('custom_event', {custom_data:e});
  });
  

• Although app-level events solve some issues related with the usage of common code, they introduce other problems. If not used carefully, they can create memory leaks, here is simple example:

  Ti.App.addEventListener('update_label', function(e) {
      label1.text = e.text;
  });
  

  As you can see, label's reference is present in app-level event listener function. That listener will never be released (because it's app-level) and therefore, label will not be released from memory.

  And what about function generalization? What if you want to make it work for any label? Well, you could pass label's reference via fire event function and you would even solve memory issue, but then you would have a (OOP) design problem since that functionality is related to all labels and not in general for all elements - therefore, it should be present in all label instances (well, if you want to reuse it).

  Now, I'm not sure have I understood your problem well, but it seems to me that you want to add same event listener to every label. You can do that in several way, one simple is to create non-anonymous function and add it to all labels as event listener:

  var onClick = function(e) {
      Ti.API.debug(this); //should be label instance
  };
  
  label1.addEventListener('click', onClick);
  label2.addEventListener('click', onClick);
  label3.addEventListener('click', onClick);
  

  Even better - you can create function factory that creates labels with particular functionality:

  function LabelWithClick(options) {
      var label = Ti.UI.createLabel(options);
      label3.addEventListener('click', function(e) {
          //do something
      });
      return label;
  }
  

  If you want this function to be globally available, create global namespace object. Let me know if you need help with that, or if you're using multi-context windows.

  The advantage of this approach is - the label created with this way will be garbage collected and it's event listener also. Now you have functionality related to the labels at right place and you could also separate your code:

  function MyLabel(options) {
      var label = Ti.UI.createLabel(options);
      return label;
  }
  
  function MyLabelWithClick(label) {
      label3.addEventListener('click', function(e) {
          //do something
      });
      return label;
  }
  

  Put that two functions in separate files and you have basic VC approach (MVC without a model :D )

  If I missed the point, please correct me. :)

• Thanks for the quick answer. I'm not sure how/where to implement the app level EventListener, presumably in app.js ? But is this a problem if the various variables in the common app code are defined in a different .js file?

  I tried putting the app level code at the head of the .js file that contains my common app code, but it didn't work.

  I'll keep experimenting over the next couple of days.

• Try not to answer you own questions unless you are providing an answer. Use the comment system when responding to a posted answer.

  It doesn't matter where you create your app level events because you are attaching the event to Ti.App, so anywhere that has access to Ti.App will have access to your event listener.

  Check the custom events section of the Kitchen Sink demo for more on implementing them in your code.