Add project as library – Titanium module (Android)

Native Android application can include other projects as library, when they need that particular SDK library functionalities – using Eclipse, right click project > Properties > Android > Library. However for Titanium module, there’s no option to add other projects as library. Instead, we need to include the whole project itself into the module project directory.

For example, I’m creating GooglePlayServices module, so I need to copy files from ANDROID_SDK_DIR/extras/google/google_play_services/libproject/google-play-services_lib/ into the module folder

export MODULE_DIR=~/Workspace/ti.googleplayservices/
cd $ANDROID_SDK_DIR
cp -r libs/*.jar $MODULE_DIR/lib
cp -r res/ $MODULE_DIR/platform/android/
cp -r src/ $MODULE_DIR/src/

Most of the time, the library that being included will be missing R.java and BuildConfig.java file. Depending on the library itself, create those files manually. For this GooglePlayServices module, the generated resource file (R.java) is located at com.google.android.gms namespace:

touch $MODULE_DIR/src/com/google/android/gms/R.java

(for Facebook SDK that I created sometime ago, it’s at com.facebook.android)

Now, again depending on the library we’re including, the content of R.java can be found either from the source code (like Facebook SDK) or from the documentation (GooglePlayServices).

Originally, R.java is generated by Android build tool when building APK file for a project, but since we’re building a Titanium module, R.java cannot be generated, since it’s value might clash with the actual project that use this module. Values inside R.java are generated from the XML resources (such as strings.xml, values.xml, layout.xml), or graphic files (icons / images files, also known as drawables).

The difference between this file and the generated one, is that we need to initialize it to populate its values. By using TiRHelper, we will get and assign all the values at runtime.

package com.google.android.gms;

import org.appcelerator.titanium.util.TiRHelper;
import org.appcelerator.titanium.util.TiRHelper.ResourceNotFoundException;

public class R {

    public static class attr {
        public static int adSize;
        public static int adUnitId;
        public static int allowShortcuts;
        // ... more ...
    }

    public static class color {
        // ...
    }

    public static class drawable {
        // ...
    }

    public static class id {
        // ...
    }

    public static class integer {
        // ...
    }

    public static class string {
        // ...
    }

    public static class styleable {
        // ...
        public static final int[] AdsAttrs = {
            styleable.AdsAttrs_adSize,
            styleable.AdsAttrs_adSizes,
            styleable.AdsAttrs_adUnitId,
        };
        // ... more ...
    }

    public static void initialize() {
        R.attr.adSize = getResource("attr.adSize");
        R.attr.adUnitId = getResource("attr.adUnitId");
        R.attr.allowShortcuts = getResource("attr.allowShortcuts");
        // ... more ...
    }

    private static int getResource(String path) {
        int id = 0;
        try {
            id = TiRHelper.getResource(path);
        } catch (ResourceNotFoundException e) {}
        return id;
    }
}

Then, in the main module class, don’t forget to call initialize() method on app creation.

@Kroll.onAppCreate
public static void onAppCreate(TiApplication app) {
    R.initialize();
}

Use view from custom module inside Titanium ListViewItem

Most example I found on how to create view inside ListViewItem are using Titanium views itself (those from Ti.UI namespace). This post shows how to use views from other modules. For example, I’m using canvas view module, TiAndroidCanvas (Android) and ti.canvas (iOS)

Updated:

In order for ListView to use the custom module, listview.js need to be able to access the JS variable pointing to the module, and invoke the create* method to create the view instance. So, instead of using try-and-error method as shown previously, just assign your require()-ed module to global scope

Android example:

global.CanvasModule = require('com.wwl.canvas');

// template
{
    type: 'CanvasModule.CanvasView'
}

(therefore, listview.js will invoke CanvasModule.createCanvasView() to create the view instance)

iOS example:

global.CanvasModule = require('ti.canvas');

// template
{
    type: 'CanvasModule.View'
}

(therefore, listview.js will invoke CanvasModule.createView() to create the view instance)

Android

Include the module into global variable, then in ListItemTemplate, assign using the view’s class name (in Java source code, the class that inherits TiViewProxy, without -Proxy suffix)

var Canvas = require('com.wwl.canvas');

// in template
{
    type: 'Canvas.CanvasView',
    properties: {},
    events: {}
}

iOS

No need to include the module, but in ListItemTemplate, assign using the actual view proxy class name in Objective-C code.

// in template
{
    type: 'TiCanvasView',
    properties: {},
    events: {}
}

Avidemux

avidemux_xn

Avidemux is a video editing software that I’ve been used before to encode the recorded videos from TV. When recorded from TV, the video is in uncompressed MPEG format, resulting in large size. Sometimes a video of an hour length is about 2GB.

The best encoding format I’ve been used before is using AVI container with x264 (single pass) video encoding format, and AC3 audio encoding

To get information about a video, in Windows you can use GSpot (it’s bundled together with Media Player Classic). For Linux or Mac, you can use mplayer or ffmpeg command

$ mplayer -ao dummy -vo dummy -identify video.mp4

// output:
==========================================================================
Opening audio decoder: [ffmpeg] FFmpeg/libavcodec audio decoders
libavcodec version 53.61.100 (external)
AUDIO: 48000 Hz, 2 ch, s16le, 192.0 kbit/12.50% (ratio: 24000->192000)
ID_AUDIO_BITRATE=192000
ID_AUDIO_RATE=48000
ID_AUDIO_NCH=2
Selected audio codec: [ffaac] afm: ffmpeg (FFmpeg AAC (MPEG-2/MPEG-4 Audio))
==========================================================================
$ ffmpeg -i video.mp4

// output:
Stream #0:0(und): Video: h264 (High) (avc1 / 0x31637661), yuv420p, 800x450 [SAR 1:1 DAR 16:9], 823 kb/s, 29.97 fps, 29.97 tbr, 30k tbn, 59.94 tbc
Stream #0:1(und): Audio: aac (mp4a / 0x6134706D), 48000 Hz, stereo, s16, 192 kb/s