O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating Mobile Apps with Appcelerator Titanium

Book Description

There’s no better way to learn Titanium than by using the platform to create apps for iPhone, iPad, and Android, and this tutorial lets you do exactly that. It’s a truly hands-on approach that covers all the essential bases.

  • Walk through the development of ten different mobile applications by leveraging your existing knowledge of JavaScript
  • Allows anyone familiar with some Object-oriented Programming (OOP), reusable components, AJAX closures take their ideas and heighten their knowledge of mobile development
  • Full of examples, illustrations, and tips with an easy-to-follow and fun style to make app development fun and easy
  • Get empowered to build your own apps from the knowledge gained from this book

In Detail

Smartphones and tablets have really changed the technological landscape over the last 3-4 years. Much like the web did in the last decade, these powerful tools have changed the way people communicate and access information. Such a wide market creates opportunities for developers who have the skills to develop mobile applications.

"Creating Mobile Apps with Appcelerator Titanium" is a practical, step-by-step guide to building iPhone, iPad, and Android applications using JavaScript. This book will give you a solid grounding of the dos and don'ts of mobile development and also covers a lot of the functionalities offered by the Titanium platform.

This book begins with a look at what the Titanium platform has to offer. By taking you through clear tutorials on developing each application step-by-step, it helps you to apply your newly acquired knowledge afterwards. The difficulty level gradually increases along the course of the book.

Each application from this book covers different aspects of mobile development. Every chapter starts by defining the application’s features as well as the user interface structure. Every single code section is then explained and put into context allowing you to gain a clear understanding of their purpose and functionality. The book takes a “small milestone” approach, allowing you to actually run the application and see the progression. Every step is accompanied by many screenshots so you can see the expected result on screen.

You will learn everything you need to know to develop your very own mobile applications. The book takes a laid-back approach to Titanium development and provides information in a way designed to never overwhelm the reader with information and also uses clear diagrams, screenshots, and tips throughout.

Table of Contents

  1. Creating Mobile Apps with Appcelerator Titanium
    1. Table of Contents
    2. Creating Mobile Apps with Appcelerator Titanium
    3. Credits
    4. About the Author
    5. About the Reviewers
    6. www.PacktPub.com
      1. Support files, eBooks, discount offers and more
        1. Why Subscribe?
        2. Free Access for Packt account holders
    7. Preface
      1. Titanium core
        1. Titanium Mobile SDK
        2. Titanium studio
        3. Appcelerator analytics
        4. Appcelerator Cloud Services
      2. What if this is not enough for my needs?
      3. What are the goals of this book?
      4. What this book covers
      5. What you need for this book
      6. Who this book is for
      7. Conventions
      8. Reader feedback
      9. Customer support
        1. Downloading the example code
        2. Downloading the color images of this book
        3. Errata
        4. Piracy
        5. Questions
    8. 1. Stopwatch (with Lap Counter)
      1. Creating our project
        1. What have we here?
      2. The UI structure
        1. Why do we use views?
      3. Now on to the code
        1. It all starts with a window
        2. Displaying the current time with big numbers
          1. We can now do our first run
        3. Starting and stopping the stopwatch
          1. We see the buttons, but they don't do much yet!
          2. Stopwatch is not defined, but it's okay
        4. Keeping up with lap times
          1. Capturing lap times
          2. Showing lap times in a scrollable list
        5. Resetting the timer
      4. Summary
    9. 2. Sili, the assistant that just listens
      1. Creating our project
      2. The user interface structure
      3. Coding the application
        1. Let's do some scaffolding
          1. Let's see how this looks
        2. Recording with a click on a single button
          1. What good is a buffer if we're not using it?
        3. Listing stored recordings
          1. Be sure to call it!
        4. Listening to a recording
        5. Deleting old recordings
      4. Summary
    10. 3. The To-do List
      1. Creating our project
      2. The user interface structure
      3. Let's get this show on the road
        1. The database
          1. Defining the structure
          2. Implementing our model
        2. The user interface
          1. The header view
          2. The tasklist
          3. The button bar
          4. Let's have a look
            1. Developing a better switch for iOS
        3. Adding a new task
        4. Listing all the existing tasks
          1. Before executing the code
        5. Marking a task as completed
        6. Filtering out completed tasks
          1. Activating the filter
        7. Deleting the completed tasks
        8. Close the door, you're letting the heat out
      4. Summary
    11. 4. Interactive E-book for iPad
      1. The user interface structure
      2. Before writing any code
        1. A native module
        2. Where do I get it?
      3. Creating our project
        1. Adding the module to our project
      4. Now we can code
        1. The user interface
          1. Importing the PageFlip module
          2. Adding some colorful views
          3. Making sure the pages actually turn
          4. Orientation
            1. Why not just LANDSCAPE?
        2. The rich HTML page
        3. The map view
        4. The video player
        5. Final assembly
      5. Summary
    12. 5. You've Got to Know When to Hold 'em
      1. Creating our project
      2. The application structure
      3. The main application window
        1. Moving on to the code
          1. Coding the user interface
          2. Sparing our fingers
          3. Preparing for our first run
      4. The portfolio management window
        1. Coding what we have designed
          1. The form at the top
          2. The stock list
      5. Navigating between the two windows
        1. Let's see if it works
      6. Moving stocks around
        1. Saving our portfolio
        2. Keeping up on our objective
        3. Portfolio management
          1. Saving
          2. Retrieving
          3. Updating a particular stock
          4. How much is our portfolio worth?
      7. Wiring the preference service to the UI
        1. Adding a new stock to the list
        2. Creating a custom look for our table rows
          1. One more thing before we can test
        3. Saving all that
        4. What if there are stocks already?
      8. Retrieving the stock values from the Internet
        1. Knowing where to get it
          1. Let's see what we get from it
        2. Retrieving one stock
          1. Creating an HTTPClient object
          2. Opening the HTTPClient object
          3. Sending the request itself
        3. Retrieving all stocks in a single call
        4. Calling the web service
      9. Handling when stocks are updated
      10. Making the whole thing more fluid
        1. Updating stocks when the portfolio has changed
        2. Updating stocks as the application starts
      11. Summary
    13. 6. JRPG – Second to Last Fantasy
      1. Creating our project
      2. The game's basic design
      3. We need an engine!
        1. Where can we get it?
        2. Installing our module
      4. The map (before we code a single line)
        1. The right tool for the right job
        2. Creating the map
        3. Tilesets
          1. Using the tileset
        4. Using layers
          1. Why layers?
        5. Speaking the same language
      5. Let's turn this map into a game
        1. The scaffolding
        2. Loading an external asset
        3. Loading the game
        4. Let's fire it up!
        5. Hum! Somehow it looked like a better map editor
          1. Let's see our map now
      6. We need a hero
        1. Hold that code, will you?
          1. How does a SpriteSheet actually work?
        2. Bringing our hero into the scene
          1. Let's keep it modular
          2. Putting our hero on the map
          3. Hey! Don't stay in the corner
      7. Venture around the map
        1. No directional pad, but that's okay
          1. Creating our V-Pad
          2. Is someone touching the V-Pad?
            1. Giving some visual feedback to the user
            2. Aren't we forgetting something?
          3. Moving our hero around
            1. Seeing the future
            2. Living the future
          4. Is it a game yet?
      8. Our hero moves, but he's still pretty stiff
        1. Make sure he walks in the right direction
        2. Make sure he stops in the right direction
      9. Putting the finishing touch
        1. The user is touching the V-Pad, but where exactly?
        2. Be sure nothing overlaps
        3. Cleaning up after ourselves
      10. Summary
    14. 7. JRPG – Second to Last Fantasy Online
      1. Creating our project
        1. Recycling saves our time
      2. Before we get our hands dirty
        1. Some things to be considered
          1. WebSockets
      3. Setting up things
        1. The server side
          1. Enter Node.js
            1. Installation
          2. Creating our server project
          3. socket.io
            1. Installing a JavaScript module on our server sounds complicated
          4. Making sure everything is in place
        2. The client side
          1. The Web Socket module
            1. Downloading the module
            2. Installing the module
            3. This will work, but at the same time, it won't
      4. Coding our game server
        1. Creating a web server in less than 10 lines of code
          1. Taking our server for a spin
        2. Keeping tabs on our players
        3. Creating our socket.io connection
        4. Game interactions
          1. A player joins the game
          2. A player quits the game
          3. JavaScript arrays don't have a contains function?
        5. Player interactions
          1. A player moved around the map
          2. A player used the chat feature
        6. Sparing network traffic
        7. Make sure everything runs smoothly
      5. Let's bring this game online!
        1. Connecting to the server
        2. Every player is different
          1. Designing the hero selection window
          2. Gathering new assets
          3. To the code!
          4. Changing the hero's appearance
            1. The hero has no clothes
          5. Making this work
            1. Before we go any further
        3. Making our hero speak
          1. Back to the drawing board
            1. How to reach the window
          2. Wiring it up
          3. Displaying what the hero is saying
        4. Interacting with the game server
          1. When our hero moves
        5. This looks familiar
          1. Someone joined
          2. Someone quit
          3. Someone moved
          4. Someone spoke
          5. Where is everybody?
          6. Be sure to hang up that connection
      6. Game on!
      7. Summary
    15. 8. Social Networks
      1. Creating our project
      2. One window to rule them all
      3. Code while it is hot!
        1. The top section
          1. Staying within the limits
          2. Setting up our Post button
        2. The bottom section
        3. What if the user rotates the device?
        4. See it in action
        5. Polishing it up a little
      4. Facebook Integration
        1. Creating our application
        2. Retrieving our Facebook app ID
        3. There is a module for that
          1. Instantiating our module
        4. Linking our mobile app to our Facebook app
          1. Allowing our user to log in and log out at the click of a button
          2. Handling responses from Facebook
            1. Authorizing our application
          3. Posting our message on Facebook
      5. Twitter integration
        1. Creating our application
          1. Retrieving our consumer key and secret
        2. No module, but a good,old fashioned JavaScript library
          1. Instantiating the library
        3. Linking with our Twitter application
          1. Toggling the state of the Twitter connection
          2. Authorizing our application
        4. Posting our message on Twitter
      6. Settings
        1. Before we touch anything
        2. Settings for iOS
          1. Now to see if this works
        3. Settings for Android
          1. Where are those settings?
            1. Android menus
            2. Let's give it a run!
        4. The settings are changed, then what?
        5. It goes both ways
      7. Summary
    16. 9. Marvels of the World around Us
      1. Creating our project
      2. The main window
        1. Let's dig in the right way
          1. The header
        2. The ListView component
          1. The template
          2. Creating our ListView object
        3. Wrapping it up
        4. Calling our main window
        5. Testing our work so far
      3. Getting the device's location
        1. How does that translate into code?
        2. How can we test this?
          1. Using the iOS simulator
          2. Using the Android emulator
          3. Validating our test
      4. Photos from the Web to our application
        1. There is a web service for that...
          1. Getting our API key
          2. Remembering that key
          3. Defining the call
          4. Making the call
          5. Handling the response
        2. Having a second look at our main window
      5. The photo viewer window
        1. On with the code
          1. Returning to our main window
      6. Connecting the wires
        1. Selecting a photo
        2. The Refresh button
        3. Testing out the navigation
      7. Photo gallery integration
        1. Android photo gallery integration
        2. iOS photo gallery integration
        3. One final run
      8. Summary
    17. 10. Worldwide Marco Polo
      1. We know the drill
      2. Let's see what we got here
      3. Our tabbed user interface
        1. Getting this show on the road
          1. The chicken and the egg
          2. Using those windows
        2. Running our application for the first time
      4. Appcelerator Cloud services
        1. Creating a user
        2. Our development sandbox
        3. Connecting to the cloud
          1. Don't forget to call it
            1. Just to make sure
      5. The Polo window
        1. The user interface
          1. One more thing
        2. Determining the player's location
          1. A better Geolocation service
        3. Pushing our location to the Cloud
          1. This is our very first time
          2. We already played this game before
        4. Testing our Polo feature
      6. The Marco window
        1. Creating a dedicated map module
        2. We have CommonJS modules, let's use them
        3. Getting player locations from the cloud
      7. Let's play!
      8. What about Android?
        1. It's good that maps are their own thing
        2. Testing this new map module
      9. Summary
    18. A. References
      1. The source code for this book
      2. The Page Flip Module
      3. The cURL utility
      4. The Stock quote API
      5. The tiled map editor
      6. Sprite sheets and tilesets
      7. The QuickTiGame2d game engine
      8. Node.js
        1. NPM
        2. Socket.IO
      9. The TiWS module
      10. The Facebook Graph API
      11. The social_plus library
      12. The Flickr API
      13. Appcelerator Cloud Services
      14. The MaxMind GeoIP service
      15. Google Maps v2
    19. Index