Titanium Module Guides and Tricks : 

TiModule.h' file not found: 

you need to edit your titanium.xcconfig TITANIUM_SDK to reflect your path...
most commonly the needed change is from the defaul:

TITANIUM_SDK = /Library/Application Support/Titanium/mobilesdk/osx
               /$(TITANIUM_SDK_VERSION)

to:

TITANIUM_SDK = ~/Library/Application Support/Titanium/mobilesdk/osx
                /$(TITANIUM_SDK_VERSION)

Adding Special Compiler Directives in module.xcconfig :  

If your module needs a special Framework or other system library or special compiler directives, you can use the module's xcconfig file to define them. Titanium automatically creates a file named module.xcconfig and one named titanium.xcconfig. The titanium.xcconfig is used when compiling your module for packaging. However, module.xcconfig is used by the application compiler when the application is built and your module is referenced. This allows you to control the compiler directives used during this process, too.

First, we'll need to add the Framework in Xcode. In this example, we'll simply add GameKit. Select Frameworks in your project folder, right click "Add -> Existing Frameworks" and select the menu item And choose "GameKit.framework" and click the "Add" button. You should now see the new Framework reference under the Frameworks folder:

If you compile your project, you should now have no errors.

Now that we've added the Framework to the project, we still need to set it up so that the application compiler can also import this Framework during compile. To do that, edit the module.xcconfig and add the following line at the bottom:

OTHER_LDFLAGS=$(inherited) -framework GameKit

If we have number of Frmework in the module then you can edit the module.xcconfig and add the following way :

OTHER_LDFLAGS=$(inherited) -framework AddressBook -framework AddressBookUI -framework UIKit -framework Foundation -framework CoreGraphics

 

Adding Library in module.xcconfig :  

Framework Can be added by above way in module.xcconfig file , but what I really wanted to know was how to set path subproject library file such as "xxxx.a" and header "xxx.h". First i built it as one project, but it was hard to set path header when i package it by "builder.py". Now I solved this problem. I changed like the following. :

I built subprojects each and then get the header and lib(.a)file each.
Then just added those titanium module project in XCODE. Then, set path Header search path in XCODE's Building Setting.

I built subprojects each and then get the header and lib(.a)file each. Then just added those titanium module project in XCODE. Then, set path Header search path in XCODE's Building Setting.

Also added path such as .dylib in module.xconfig like this.  :

other_ldflags = $(inherited) -framework CFNetwork /usr/lib/libiconv.dylib

eg) CFNetwork is framework, libiconv.dylib is usr/lib libarary file.

 

Adding fireEvent in Module and Catch in Titanium: 

 

 testModule.m

#pragma Public APIs

-(id)example:(id)args

{

    if([self _hasListeners:@"addProgress"]){

        NSLog(@"[INFO] firing from iOS method ==> -(id)example:(id)args");

        [self fireEvent:@"addProgress"];

    } else {

        NSLog(@"[INFO] Not firing..1");

    }

    // example method

    return @"hello world.....";

}

index.js from Titanium

// TODO: write your module tests here
var test = require('com.test');
Ti.API.info("module is => " + test);


test.addEventListener("addProgress", function(e) {
    Ti.API.info("addProgress from Titanium");
    alert("Event Fired!");
}); 

You can refer below links for module :

1. http://www.slideshare.net/omorandi/ticonf
2. http://developer.appcelerator.com/question/51751/how-to-fire-an-event-in-a-module-and-catch-it-in-js

 

 

 

 

TextFileld Mask :

Ti.include("mask.js");

var win = Ti.UI.createWindow({
    top : "20",
    backgroundColor : "#a8a8a8"
});

var Postcode = Ti.UI.createTextField({
    hintText: "Postcode",
    left: 20,
    right: 20,
    top: 100,
    height : "40dp",
    borderColor : "black",
    paddingLeft : "5dp"
});
win.add(Postcode);

var Phone = Ti.UI.createTextField({
    hintText: "phone",
    left: 20,
    right: 20,
    top: 150,
    height : "40dp",
    borderColor : "black",
    paddingLeft : "5dp"
});
win.add(Phone);

var LimitCharacter = Ti.UI.createTextField({
    hintText: "Limit Character (5)",
    left: 20,
    right: 20,
    top: 200,
    height : "40dp",
    borderColor : "black",
    paddingLeft : "5dp"
});
win.add(LimitCharacter);

Phone.addEventListener("change", function(e) {
    Mask.mask(Phone, Mask.phone);
});

Postcode.addEventListener("change", function(e) {
    Mask.mask(Postcode, Mask.postcode);
});

LimitCharacter.addEventListener("change", function(e) {
    e.source.value = e.source.value.slice(0,5);
});

win.open();

mask.js

Mask = {
     mask : function(_field, _function) {
          _field.value = _function(_field.value);
      },

      postcode : function(v) {
            v = v.replace(/D/g, "");
            v = v.replace(/^(\d{5})(\d)/, "$1-$2");
            return v.slice(0, 9);
      },

      phone : function(v) {
            v = v.replace(/\D/g, "");
            v = v.replace(/^(\d\d)(\d)/g, "($1) $2");
            v = v.replace(/(\d{4})(\d)/, "$1-$2");
            return v.slice(0, 14);
      }
};

Output : 

Contact Like Tableview Titanium :

var win = Ti.UI.createWindow();

var table = Ti.UI.createTableView({});

var contacts = ["Adam","Andrew","Boris","Claus","Debby","Jigar", "Karan", "Manoj"];

var sectionArr = [];

for (var i = 0,lastL,l,currSection,ilen = contacts.length;i<ilen;i++) {
     l = contacts[i].substr(0,1);
     if(lastL != l) {
          currSection = Ti.UI.createTableViewSection({
               headerTitle:l
          });
          sectionArr.push(currSection);
    }
    currSection.add(Ti.UI.createTableViewRow({
          title:contacts[i]
    }));
   
    lastL = l;
}
table.setData(sectionArr);

win.add(table);
win.open();

Output :

Titanium System Buttons

 

var win = Titanium.UI.currentWindow;

// used to evenly distribute items on the toolbar
var flexSpace = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.FLEXIBLE_SPACE
});

// used to create a fixed amount of space between two items on the toolbar
var fixedSpace = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.FIXED_SPACE,
    width:50
});

// system buttons
var action = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.ACTION
});
action.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
            {title:'System Button', message:'ACTION'}
    ).show();
});

var camera = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.CAMERA
});
camera.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
        {title:'System Button', message:'CAMERA'}
    ).show();
});

var compose = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.COMPOSE
});
compose.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
        {title:'System Button', message:'COMPOSE'}
    ).show();
});

var bookmarks = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.BOOKMARKS
});
bookmarks.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
         {title:'System Button', message:'BOOKMARKS'}
    ).show();
});

var search = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.SEARCH
});
search.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
          {title:'System Button', message:'SEARCH'}
    ).show();
});

var add = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.ADD
});
add.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
         {title:'System Button', message:'ADD'}
    ).show();
});

var trash = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.TRASH
});
trash.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
        {title:'System Button', message:'TRASH'}
    ).show();
});

var reply = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.REPLY
});
reply.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
      {title:'System Button', message:'REPLY'}
    ).show();
});

var stop = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.STOP
});
stop.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
         {title:'System Button', message:'STOP'}
    ).show();
});

var refresh = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.REFRESH
});
refresh.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
         {title:'System Button', message:'REFRESH'}
    ).show();
});

var play = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.PLAY
});
play.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
       {title:'System Button', message:'PLAY'}
    ).show();
});

var pause = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.PAUSE
});
pause.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
       {title:'System Button', message:'PAUSE'}
    ).show();
});

var fastforward = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.FAST_FORWARD
});
fastforward.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
           {title:'System Button', message:'FAST_FORWARD'}
    ).show();
});

var rewind = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.REWIND
});
rewind.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
         {title:'System Button', message:'REWIND'}
    ).show();
});

var edit = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.EDIT
});
edit.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
        {title:'System Button', message:'EDIT'}
    ).show();
});

var cancel = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.CANCEL
});
cancel.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
        {title:'System Button', message:'CANCEL'}
    ).show();
});

var save = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.SAVE
});
save.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
         {title:'System Button', message:'SAVE'}
    ).show();
});

var organize = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.ORGANIZE
});
organize.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
        {title:'System Button', message:'ORGANIZE'}
    ).show();
});

var done = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.DONE
});
done.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
          {title:'System Button', message:'DONE'}
    ).show();
});

var disclosure = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.DISCLOSURE
});
disclosure.addEventListener('click', function()
{
    Ti.API.info('FOO');
    Titanium.UI.createAlertDialog(
          {title:'System Button', message:'DISCLOSURE'}
    ).show();
});

var contactadd = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.CONTACT_ADD
});
contactadd.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
          {title:'System Button', message:'CONTACT_ADD'}
    ).show();
});

var nativespinner = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.SPINNER
});
nativespinner.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
         {title:'System Button', message:'SPINNER'}
    ).show();
});

var infolight = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.INFO_LIGHT
});
infolight.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
          {title:'System Button', message:'INFO_LIGHT'}
    ).show();
});

var infodark = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.INFO_DARK
});
infodark.addEventListener('click', function()
{
    Titanium.UI.createAlertDialog(
        {title:'System Button', message:'INFO_DARK'}
    ).show();
});

//
// CREATE BUTTONS TO CHANGE VIEW
//
var b = Titanium.UI.createButton({
    title:'Set Button Group 1',
    width:200,
    height:40,
    top:10
});

b.addEventListener('click', function()
{
    win.rightNavButton = camera;
    win.toolbar = [action,flexSpace,compose,fixedSpace,bookmarks,flexSpace,search];
});
win.add(b);

var b2 = Titanium.UI.createButton({
    title:'Set Button Group 2',
    width:200,
    height:40,
    top:60
});

b2.addEventListener('click', function()
{
    win.rightNavButton = add;
    win.toolbar = [trash,flexSpace,reply,fixedSpace,stop,flexSpace,refresh];
});
win.add(b2);

var b3 = Titanium.UI.createButton({
    title:'Set Button Group 3',
    width:200,
    height:40,
    top:110
});

b3.addEventListener('click', function()
{
    win.rightNavButton = play;
    win.toolbar = [pause,flexSpace,fastforward,fixedSpace,rewind,flexSpace,edit];
});
win.add(b3);

var b4 = Titanium.UI.createButton({
    title:'Set Button Group 4',
    width:200,
    height:40,
    top:160
});

b4.addEventListener('click', function()
{
    win.rightNavButton = cancel;
    win.toolbar = [save,flexSpace,organize,fixedSpace,done,flexSpace,disclosure];
});
win.add(b4);

var b5 = Titanium.UI.createButton({
    title:'Set Button Group 5',
    width:200,
    height:40,
    top:210
});

b5.addEventListener('click', function()
{
    win.rightNavButton = contactadd;
    win.toolbar = [nativespinner,flexSpace,infolight,flexSpace,infodark];
});
win.add(b5);

 

Load more TableView Row when user scrolls "near" bottom of TableView : 

/*In this demo, we simply show how you could dynamically scroll with a 
continuous amount of data in the tableview by detecting when the user's 
scroll position gets near the end of the table and start a background 
fetch of new data and seamlessly append the new data to the 
table automatically..*/


var win = Ti.UI.createWindow();

var data = [];
var numberOfRows = 575 + 1;
var showRows = 50;
var rowNumer = 1;
for (var c = 0; c < showRows; c++) {
     data[c] = {
          title : "Row " + (rowNumer)
     };
     rowNumer++;
}

var tableView = Ti.UI.createTableView({
    data : data
});

win.add(tableView);

var navActInd = Titanium.UI.createActivityIndicator();

var updating = false;
var loadingRow = Ti.UI.createTableViewRow({
    title : "Loading..."
});

function beginUpdate() {
     updating = true;
     navActInd.show();

     tableView.appendRow(loadingRow);

     // just mock out the reload
     setTimeout(endUpdate, 2000);
}

function endUpdate() {
     updating = false;

     tableView.deleteRow(showRows, {});

     // simulate loading
     for (var c = 0; c < showRows; c++) {
          if (rowNumer == numberOfRows) {
              return;
          }
          tableView.appendRow({
               title : "Row " + (rowNumer)
          }, {});
          rowNumer++;
     }
     showRows = showRows * 2;
 
   // numberOfRows = (numberOfRows - showRows);
   // just scroll down a bit to the new rows to bring them into view

}

var lastDistance = 0;

// calculate location to determine direction

tableView.addEventListener('scroll', function(e) {
     if (rowNumer != numberOfRows) {
          if (Ti.Platform.osname == 'iphone') {
              var offset = e.contentOffset.y;
              var height = e.size.height;
              var total = offset + height;
              var theEnd = e.contentSize.height;
              var distance = theEnd - total;

              // going down is the only time we dynamically load,
              // going up we can safely ignore -- note here that
              // the values will be negative so we do the opposite
              if (distance < lastDistance) {
                  // adjust the % of rows scrolled before 
                  //we decide to start fetching 

                  var nearEnd = theEnd * .75;

                  if (!updating && (total >= nearEnd)) {
                      beginUpdate();
                  }
              }
              lastDistance = distance;
     }
     if (Ti.Platform.osname == 'android') {
         if ((e.firstVisibleItem + e.visibleItemCount) == e.totalItemCount) {
              for (var c = 0; c < showRows; c++) {
                  if (rowNumer == numberOfRows) {
                       return;
                  }
             tableView.appendRow({
                    title : "Row " + (rowNumer)
             }, {});
             rowNumer++;
          }
      }
   }
 }

});
win.open(); 

You can Download the Demo Project From Here. 

 

Titanium TableView Expand Zoom TableView HeaderView

//app.js

'use strict';

var win = Ti.UI.createWindow({
      backgroundColor : 'white'
});

//Generate some sample rows
var rows = [];
for (var i = 0; i < 60; i++) {
   rows.push({
        title : 'Row #'+ i 
   });
}

//Create our TableView, nothing special
var tableView = Ti.UI.createTableView({
    width : Ti.UI.FILL,
    height : Ti.UI.FILL,
    data : rows
});

//Create a ImageView for the TableView HeaderView
var imgView = Ti.UI.createImageView({
    width : Ti.UI.FILL,
    height : 150,
    image : "sample.png"
});

//Set our ImageView as the headerView
tableView.headerView = imgView;
win.add(tableView);

//Need to capture a few session variables
//The most important one is to grab the origional height of the TableView HeaderView
var _scollTimer = null, 
    _origionHeight = tableView.headerView.height;

//Most of what we need happens in the scroll event
tableView.addEventListener('scroll', function(e) {
       //Clear our timer each time
      if (_scollTimer !== null) {
        clearInterval(_scollTimer);
   }

      //If the user has scrolled past the header, reset the origional height
      if (e.contentOffset.y > _origionHeight) {
        if (tableView.headerView.height !== _origionHeight) {
            tableView.headerView.height = _origionHeight;
        }
    } else {
               //Calculate our zoom or expand height
               var zoomOffSet = ((e.contentOffset.y < 0) ? -1 : 1);
      var zoomHeight = (tableView.headerView.height+((zoomOffSet * -1)*((zoomOffSet*e.contentOffset.y)/3)));
     zoomHeight = ((zoomHeight > _origionHeight) ? zoomHeight : _origionHeight);

       if (tableView.headerView.height !== zoomHeight) {
            tableView.headerView.height = zoomHeight;
       }
    }

      //Timer is needed since scrollend doesn't always fire
      //so just in case we set a timer to set the origional height
      if (e.contentOffset.y === 0) {
         _scollTimer = setTimeout(function() {
             tableView.headerView.height = _origionHeight;
         }, 250);
     }
  });

  //If the user end scrolls something other then the HeaderView check if we need to reset
  tableView.addEventListener('scrollend', function(e) {
      if (_scollTimer != null) {
           clearInterval(_scollTimer);
      }
      if (tableView.headerView.height !== _origionHeight) {
          tableView.headerView.height = _origionHeight;
      }
  });

win.open(); 


You can also check the blog of this post.
Ben Bahrenburg created an snippet that lets you create a TableView Header Zoom like the Foursquare and Tapbots.

Download Sample Here...

 

Status Bar ios7 in Titanium : 

 

TiAlloy fix for windows being positioned under the status bar on #iOS7 : 

alloy.js
//For iOS only, set the Windows top to 20 so they start under the status bar.
Alloy.Globals.windowsTop = (OS_IOS && parseInt(Ti.Platform.version[0], 10) >= 7 ) ? 20 : 0;


app.tss
//Set Window Propert for iOS
"Window[platform=ios]" : {
      top : Alloy.Globals.windowsTop
}


iOS 7 also introduces a new light content status bar style that is exposed as the Titanium.UI.iPhone.StatusBar.LIGHT_CONTENT constant in the Titanium SDK. Use this constant to specify a status bar for use with a dark background. If you want the entire application to use this style, add the following key to your tiapp.xml file:

tiapp.xml
<ti:app>
          <ios>
               <plist>
                    <dict>
                         <key> UIStatusBarStyle </key>
                         <string> UIStatusBarStyleLightContent </string>
                     </dict>
                </plist>
          </ios>

</ti:app>