Mobile Platform Development w/Titanium

looneyvillestaticΛογισμικό & κατασκευή λογ/κού

15 Αυγ 2012 (πριν από 5 χρόνια και 7 μέρες)

292 εμφανίσεις

David Riggleman

Nathan Brown

Dane Baldwin


1


Cross Platform Mobile Development

With Titanium and Titanium Studio


Overview:

Titanium is a cross platform mobile development tool. Titanium applications are written using
HTML,
CSS and JavaScript
, but they are compiled into native applications specific to the mobile device and then
the applications run as standalone applications. These applications use an API that allows them to access
native

features on the devices. This tool powers over 1,000 di
fferent native applications per month.
Titanium is a powerful tool that is growing very fast
and is allowing for more and more functionality.

The main programming language is JavaScript. So as a user
,

he or she will be using JavaScript to make
the initial

program and then compiles it to native code for the use on different mobile devices.

An entire integrated development environment (IDE) called Titanium Studio was built using Eclipse as
the underlying framework and provides easy access to all the actions
important when developing a
mobile application. These features include d
ebugging support
, which

was implemented in June of this
year
, and code completion
. Th
e

debugging tool allows a fully functional debugging option.

There are some problems and glitches
that come with this tool
, such as the failure to exclude subversion
files
. There are updates that will eventually
be released to resolve these issues
. The emulators that are
used are a third party

and

integrated easily

in
to Titanium. There is an internal S
DK that the IDE u
ses. As
of right now Titanium’s
cross platform
support includes the

iOS
,

Black Berry, and Android

platforms
.

One
helpful source of information was

found was the
developers’

blog that is posted on the
Appcelerator’s web site (
http://developer.appcelerator.com/blog/
). There are many useful people and
answers on this site that others have found. This base of people is also very large and there are many
answers to questions along with man
y good tips.

Resources

Online Installation tutorial:
http://wiki.appcelerator.org/display/guides/Installing+on+Windows+7

Debugging introduction:
http://developer.appcelerator.com/blog/2011/07/page/2#debugging

Debugging Details:
http://wiki.appcelerator.org/display/tis/About+the+Debug+perspective

Installing Subversion Plugin:
http://wiki.appcelerator.org/display/tis/Subversion

Compatibility ta
ble:
http://wiki.appcelerator.org/display/guides/Titanium+Compatibility+Matrix



2


Dependencies

Titan
ium Studio relies on several programs to support Android mobile development. Several of these
dependencies are further dependent on each other, so the user must install a suite of programs


in the
correct sequence


and set several environment variables b
efore Titanium Studio will install without
unexpected error messages. The most recent Titanium SDK does provide a decent “safety net” for users
who refuse to install these dependencies, but relying on this detection is not recommended.

1.

Install Python (
http://www.python.org/download
/

).

Python is required to run SCons (see below) and the Java SDK Update 6 (1.0.6.xx). Specifically,
the 32
-
bit version later than 2.6

is required to properly support all dependencies. Installation
involves following the wizard without significant modification. Common storage convention
dictates installation into C:
\
Program Files
\
Python[nn:version]

(in which nn represents the first
two d
igits of the version number) is common practice to make setting environmental variables
easier.


2.

Install Git (
http
://
git
-
scm
.com/download
).

Git provides native version control for Titanium Studio. Various plugins exist for other popular
systems, such as Subversion, but program updates are also distributed via Git, so installation is
recommended even if Git will not be the prima
ry repository. The installation is straightforward,
once again involving little modification. Windows explorer integration can be avoided, but the
user is strongly recommended to select Run Git from Command Prompt and Checkout as
-
is
during installation (sc
reenshots can be found at the cited installation guide).


3.

Install SCons (
http://
www.scons.org/download.php

).

SCons

is a build tool used to compile certain Titanium projects. The program exists as a Python
script and will be installed into the %Python[nn:version]%
\
Scripts folder. The installer should
automatically detect your python installation.


4.

Install Java (
http://
www.oracle.com/technetwork/java/javase/downloads/index.html

).

The current supported JDK i
s 1.0.6_xx. JDK 1.0.7 is currently unsupported. Additionally, the 32
-
bit version is required for proper Android support. Note that both the JDK and JRE are required.


5.

Install the Android SDK (
http
://
developer.android.com/sdk/index.html

).

The android installer/updater must be installed prior to installing or updating any SDK. Either
download and extract the .zip file or run the .exe file f
or a full installer. Due to a bug in the
current Android version (revision 12), spaces are not permitted in the SDK path. The path
C:
\
Program_Files
\
android
-
sdk
-
windows is recommended until this bug is resolved. The user can
also revert to revision 11. Once

installed, launch the SDK manager from …
\
android
-
sdk
-
windows
\
SDK Manager. Use the interface to download all available Android packages and some
3
rd

party SDKs. Check the compatibility table cited above for updated support information.



3



6.

Configure environm
ent variables.

All these programs must be added to the Path variable. Python should link to the

\
Python[nn:version] folder. Git should link to the
\
bin folder inside the
\
Git directory. SCons
should be linked into %Python%
\
Scripts, Java into the
\
bin fold
er inside the
\
jdk1.0.6.xx
directory. Titanium relies on the Android adb utility for emulation, which has been moved from
\
tools to
\
platform
-
tools under the
\
android
-
sdk
-
windows directory. Additionally, the
JAVA_HOME variable should be created, linking to

the
\
jdk1.0.6.xx directory and the
ANDROID_SDK, linking to
\
android
-
sdk
-
windows. With the exception of Android’s path
modification, the correct variables can be found in the installation guide cited above.

Titanium Studio

Once all the dependencies have be
en satisfied, installing Titanium Studio amounts to a simple wizard
walkthrough. On the first startup, the program will request the user’s Appcelerator account username
and password. To create a new project, select File > New > Titanium Mobile Project. The

configuration
screens for the project will allow the user to point Titanium to the Android SDK and select a
development environment. Projects are saved to the user’s workspace and can be emulated using the
boxed arrow inside the App Explorer.

Troubleshoot
ing

Common errors include incorrect environmental variables, spaces in the Android SDK path name, and
improper emulator setup. If Titanium refuses to locate an existing Android SDK, ensure that the Path
variable is set to
\
android
-
sdk
-
windows
\
platform
-
tool
s. Also ensure that the SDK is not installed in the
\
Program Files directory, as the filename will contain a space.
If the emulator is not working, open the
SDK manager, ensure the correct packages are installed (under “Installed packages”), delete any vir
tual
devices
, and restart Titanium.

Subversion Integration

1.

Open the download/update configuration via Window > Preferences > Install/Update >
Available Software Sites.

2.

Add Eclipse to the list via the Add… button. The link must be
http://download.eclipse.org/releases/helios

3.

Press OK and select Help > Install New Software

4.

Select Eclipse in the Works With: combo box.

5.

Select Collaboration and filter by SVN in the primary table.

6.

Select Team SVN and inst
all.

7.

Restart Titanium.

8.

Select Window > Open Perspective and the SVN Repository Exploring option.

9.

Select an SVN configuration that is compatible with your Subversion version.


4


10.

Restart Titanium.

11.

Access your repository with the New Repository Location button above the interface
file
tree
.


Debugging with Titanium

Titanium supports the standard debugging options. Users of Firebug, Netbeans, or Eclipse will be very
comfortable setting both static and

dynamic breakpoints. The software also supports variable and call
stack tracing, as well as dynamic variable editing. In some cases, the debugger may not start properly on
an Android emulator. If this occurs, restart Titanium.

Hello World: From PC to Andr
oid

The following steps apply to installing a sample application on an HTC Evo 4G Android Smartphone. The
instructions may vary slightly for other Android devices

1.

Download HTC Sync
from
http://www.htc.com/us/support/evo
-
sprint/downloads/


2.

I
nstall the application using the default settings

3.

Open Titanium Studio

4.

Select File


New


Titanium Mobile Project

5.

Enter the project information

a.

Enter the name of the project

(ex: “Hello World”)

b.

Enter t
he location where to save the project

c.

Enter an app id (ex:

“com.
cedarville
.
helloworld
”)

d.

Enter a website URL if desired (
ex: “http://cedarville.edu”
)

e.

Enter the desired SDK version

(currently 1.7.2)

f.

Enter the deployment targets (
ensure the Android checkbox i
s checked
)

6.

Click Finish

7.

Expand the Resources folder in either the App Explorer

view and
open the file app.js

8.

Change the “text” property for “label1” to “Hello World from Window 1”

9.

Change the “text” property for “label2” to “Hello World from Window 2”

10.

Save

all changes to the modified file

11.

First test the application on the Android Emulator

a.

Right click
anywhere

in the App Explorer
view
and click Run As


Android Emulator

b.

Wait until the emulator completely starts up and installs the application, which will
be
indicated by no more new output printing to the console (this may take up to a
few minutes)

c.

Unlock the
“phone” on the Android Emulator and the application should
automatically launch

12.

One the program is verified to be working, close the Emulator

13.

Connect the

Android device to the computer via the USB cable


5


14.

On the device, e
nsure the Default Connection Type (under Settings


Connect to PC) is set
to HTC Sync

15.

On the PC, u
se either of the following options

a.

Option 1 (Manually Install through HTC Sync)
: most reliab
le method

i.

Launch HTC Sync (applies to installing applications on HTC Android
Smartphones
)

ii.

In HTC Sync, select
Application i
nstaller

iii.

Select the application package file (.apk), which is located in
WORKSPACE/Hello World/build/android/bin/app.apk

iv.

Click “Insta
ll”

b.

Option 2 (Manual Install from within Titanium Studio): reliable method

i.

If the android platform tools are in your PATH, go to the terminal and run
the following command: “adb install “WORKSPACE/Hello
World/build/android/bin/app.apk”

ii.

If the android tools

are not in your path, either add it to your path, or run a
similar command depending on the location of the android sdk:
“C:
\
proj
\
Android
\
android
-
sdk
\
platform
-
tools
\
adb.exe” install
“WORKSPACE/Hello World/build/android/bin/app.apk”

c.

Option 3

(
Easy
Install

from within Titanium Studio)
: doesn’t always work for various
reasons

i.

Ensure the device is connected to the Internet

ii.

Right click again on the project name and this time click “Install to Android
Device)

16.

The application should now be installed on the mobil
e device