getting started with appcelerator alloy - cross platform mobile development - howard u class day_11
TRANSCRIPT
Housekeeping
• Email Project Concepts by midnight tonight
• Set-up Appcelerator Cloud Service Accounts and take a screenshot of your Account page. Turn it in on thursday as an assignment
• Read chapter on Appcelerator Cloud Services to Thursday’s class, there might be a quiz
Next Assignment
• Provide an overview of you final project/application
• You can work in teams
• Choose your team wisely since the team will get a grade
DUE Feburary 24th
Assignment Information UPDATED
• 10 - IonicFramework/Kinvey Assignment
• 10 - Final Project Overview, see documentation provided in class folder on what is expected [Team] - DUE TODAY
• 10 - Screen shot of configured Appcelerator Cloud Services- See Chapter 2 in Book
• 10 - Sample Application that takes a picture from camera or photo gallery and displays it in a view
• 10 - Sample Application that shows picture location on a map
• 15 - Appcelerator Application matching functionality demonstrated in Ionic Framework App. Saving content in Appcelerator Cloud Services
• 15 - Wireframes for final project [Team]
• 10 - Attendance, Class Participation, Basic Interest in what is going on in class
• 50 - Final project [Team]
Appcelerator Overview• Continue to read Chapters in Book - if you do not
have book you will lose points on all Appcelerator assignments
• Review Backbone documentation on Models & Collection - http://backbonejs.org/#Collection
• Review Appcelerator Fugitive Application
https://github.com/aaronksaunders/alloy_fugitive
About Alloy
Alloy is the application framework by Appcelerator for Titanium. It provides a nice MVC framework for
developers that are building Titanium apps.
!http://docs.appcelerator.com/titanium/3.0/#!/guide/
Alloy_Best_Practices_and_Recommendations
Reviewing Models & Collections
• Collection is array of models
• Models are encapsulation of data
• Both are based off of BackboneJS
• Alloy has integrated this library as basis of persistence in Appcelerator Apps
• Interaction is controlled through Sync Adapters, equivalent to Services created in Ionic/Angular
SyncAdapters Support HTTP Verbs
http://docs.appcelerator.com/titanium/3.0/#!/guide/Alloy_Sync_Adapters_and_Migrations
SyncAdapter in Action
http://docs.appcelerato.com/titanium/3.0/#!/guide/Alloy_Sync_Adaprters_and_Migrations
Using Master Detail UI with Models & Collections
• Master/Detail is common UI/UX where list presented on one page, when user clicks row, a more detailed page is rendered
• List is constructed from the “Collection” and the detail is the specific item in the collection or the “Model”
Collection Databinding in TableView
• MVC In Action
• Specify the instance of the Collection, in this case it is a collection of “device” models.
• The “fetch” will trigger the TableView to update itself t reflect the change in the “device” collection
• The data-binding is in the “index.xml” view!
• The “fetch” is executed in the “index.js” controller
Alloy.Globals
• Best to define them in “alloy.js” file; more of a recommendation than a requirement
• A Global Namespace that is available though out your whole application
• Functions, variables and objects can all be associated with Alloy.Globals.
Sample Code https://github.com/aaronksaunders/scs-‐backbonetest1