Multiple dynamic template children

dynamic_templates.js

// views

var templates = {};

// Up to 5 dynamic elements
var maxDynamicImages = 5;

// get an array in the form [ 0, 1, 2, ... n ]
range(maxDynamicImages)
// number -> template
.map(getDynamicTemplate)
// associating "myTemplateName<N>"
.forEach(function (obj, n) {
  templates[ obj.name ] = obj;
});

var listSection = Ti.UI.createListSection({
  items: [
    parseDynamicTemplate({
      images: [ '/an/image.png' ]
    }),
    parseDynamicTemplate({
      images: [ '/an/image.png', '/another/one.png' ]
    }),
    parseDynamicTemplate({
      images: [ '/an/image.png', '/another/one.png', '/a/third.png' ]
    })
});

var listView = Ti.UI.createListView({
  templates: templates
});

// utilities and templates

function range(n) {
  var arr = [];
  for (var i = 0; i < n; ++i) arr[i] = i;
  return arr;
}

function getDynamicTemplate(n) {
  var imageWidth = Math.floor(100 / n);
  return {
    name: 'myTemplateName' + n,
    childViews: [
      range(n).map(function (i) {
        return {
          type: 'Ti.UI.ImageView',
          bindId: 'image' + i,
          width: imageWidth + '%',
          height: 100,
          left: imageWidth * i
        };
      })
    ]
  };
}

function parseDynamicTemplate(data) {
  var itemData = {
    template: 'myTemplateName' + Math.min(5, data.images.length)
  };

  data.images.forEach(function (image, i) {
    itemData[ 'image' + i ] = {
      image: image
    };
  });

  return data;
}