4 Answers

• The blend modes work great in the latest version of Titanium, though they are still undocumented, you can find some light examples in the Kitchen Sink.

  Here is a bit of example code that will create an image that advances through the modes each time you click it:

  var modes = [
     Titanium.UI.BLEND_MODE_CLEAR,
     Titanium.UI.BLEND_MODE_COLOR,
     Titanium.UI.BLEND_MODE_COLOR_BURN,
     Titanium.UI.BLEND_MODE_COLOR_DODGE,
     Titanium.UI.BLEND_MODE_COPY,
     Titanium.UI.BLEND_MODE_DARKEN,
     Titanium.UI.BLEND_MODE_DESTINATION_ATOP,
     Titanium.UI.BLEND_MODE_DESTINATION_IN,
     Titanium.UI.BLEND_MODE_DESTINATION_OUT,
     Titanium.UI.BLEND_MODE_DESTINATION_OVER,
     Titanium.UI.BLEND_MODE_DIFFERENCE,
     Titanium.UI.BLEND_MODE_EXCLUSION,
     Titanium.UI.BLEND_MODE_HARD_LIGHT,
     Titanium.UI.BLEND_MODE_HUE,
     Titanium.UI.BLEND_MODE_LIGHTEN,
     Titanium.UI.BLEND_MODE_LUMINOSITY,
     Titanium.UI.BLEND_MODE_MULTIPLY,
     Titanium.UI.BLEND_MODE_NORMAL,
     Titanium.UI.BLEND_MODE_OVERLAY,
     Titanium.UI.BLEND_MODE_PLUS_DARKER,
     Titanium.UI.BLEND_MODE_PLUS_LIGHTER,
     Titanium.UI.BLEND_MODE_SATURATION,
     Titanium.UI.BLEND_MODE_SCREEN,
     Titanium.UI.BLEND_MODE_SOFT_LIGHT,
     Titanium.UI.BLEND_MODE_SOURCE_ATOP,
     Titanium.UI.BLEND_MODE_SOURCE_IN,
     Titanium.UI.BLEND_MODE_SOURCE_OUT,
     Titanium.UI.BLEND_MODE_XOR
  ];
  var modeCtr = 0;
  
  var image = Titanium.UI.createMaskedImage({
     image:'img/star.png',
     tint: '#FF0000',
     mode: Titanium.UI.BLEND_MODE_SOURCE_IN
  });
  image.addEventListener('click', function(e) {
     image.mode = modes[modeCtr];
     Ti.API.info('Mode: ' + modes[modeCtr]);
     modeCtr++;
  });
  

  Add the image to something with a blue or green background and watch how it works.

• I love the potential of this undocumented feature, it just doesn't feel ripe yet. It's exactly what I need to animate a hue color change, but no matter now much I tinkered, I couldn't get it to work. Trying to use MaskedImage mode with an all black image and an all empty image, played with tint, and no matter what I did, it would immediately force close on android. Just from the clues I found, here's some of what I tried:

  var mask = Titanium.UI.createMaskedImage({
      image:'images/empty-black.png',
      tint: 'yellow',
      mode: Titanium.UI.BLEND_MODE_HUE
  });
  // I also tried without the tints, and different images. No go.
  var image = Titanium.UI.createMaskedImage({
      image:'images/BG.png',
      tint: 'black',
      mode: Titanium.UI.BLEND_MODE_HUE //BLEND_MODE_SOURCE_IN
  });
  // Then I tried this from the example someone gave
  var BG = Titanium.UI.createMaskedImage({
      mask:'images/empty-blk.png', //optional: background Image (d)
      image:'images/BG-Love.png', //foreground Image (s)
      tint:'blue', //optional: colorize
      mode: Titanium.UI.BLEND_MODE_HUE
  });
  Ti.API.info(Titanium.UI.BLEND_MODE_HUE); //just to check
  win.add(mask);
  win.add(image);
  //win.add(BG);
  

  So I'm confused. I spent a couple hours trying variations, other blends, trying the mode: on an ImageView since it was listed as a UI property, it should be universal across any of the inheritances. I also would have expected an amount: property to set the blend level.. I was thinking I might need to change the tint rgb to set the amount, but I haven't been able to get any part of it to work. I've been spoiled with Flash, and all the scripted tweening that can be done on anything with any blend mode, and I'd love to see Appcelerator mature to do all that and better.
  Has anyone got this implemented right? I have a killer feature in my app that is waiting for this to work, then I want to cycle animate it…. Any insight from those developer geniuses out there would be appreciated.

• I too would love to see some documentation of this.

  Experimentation is great for learning, but this really does need some sort of guidance beyond the KitchenSink 'man in underpants' demo.

• Alas, what documentation there is states that createMaskedImage() is iOS only :-(