Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development...
Transcript of Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development...
![Page 1: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/1.jpg)
1Feb 24, 2011
Adobe AIR Development for the BlackBerry PlayBook
![Page 2: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/2.jpg)
2
Agenda• Screen interactions
• Device APIs to make great apps
• Device integration
• Offline storage
• Event listeners
• Skinning UI components
• Themes
• Skinstates
• Methods of skinning
• Resources and support
![Page 3: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/3.jpg)
![Page 4: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/4.jpg)
4
Characteristics of the BlackBerry PlayBook
• Seven inch screen size
• Multi touch interface
• Landscape or portrait display
• Virtual keyboard
![Page 5: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/5.jpg)
5
Make a touch centric appUser Action Result Type Color
Drag or swipe from the top of the screen
This action displays the menu
application-specific Red
Drag or swipe from the bottom of the screen
This action displays the navigator
system-wide Purple
Drag or swipe from the left or right side of the
screen
This action switches applications
system-wide Blue
![Page 6: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/6.jpg)
6
On screen interactionsUser Action Result
Tap the screen Initiates an action in the app
Drag or swipe across the screen
This action moves the content on the screen in the direction of the drag
or swipe and at the corresponding rate of speed
Touch and hold a finger on an item.This action highlights a sequence of characters, a word, a link, or an itemsuch as an email message or picture.
Pinch open or pinch close.These actions zoom in to and out from an
item
![Page 7: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/7.jpg)
7
Notifications and Indicators• Application notifies appear in the top left corner of the screen
• Inform users about app-specific events such as new mail messages
• Status indicators appear in the top right corner of the screen
• Display system status information such as battery power and wireless connection
![Page 8: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/8.jpg)
ActionScript SWFBlackBerry PlayBook
Application (.bar)
AIR SDK Tablet OS SDK
Adobe Runtimes – Flash Player & AIR
![Page 9: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/9.jpg)
PlayBook AIR SDK Capabilities
• Hardware acceleration
• Web View to display HTML and Flash content
• UI components built specifically for the touch screen
• APIs for front and rear facing cameras, accelerometer, in-app payments and more
• Application notifications
9
![Page 10: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/10.jpg)
PlayBook AIR SDK Capabilities
• Extend Adobe AIR applications to use native C++ extensions
• Porting existing Adobe AIR and Flash applications quickly and easily
10
![Page 11: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/11.jpg)
Bring existing AIR apps to the BlackBerry PlayBook
ActionScript SWFBlackBerry PlayBook
Application (.bar)
• Create the proper directory structure
• Create the app.xml file
• Package the SWF and app.xml file through the command line tool
• Deploy to your BlackBerry PlayBook!
![Page 12: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/12.jpg)
12
APIs to build great apps
![Page 13: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/13.jpg)
13
Adding a swipe gesture
![Page 14: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/14.jpg)
14
Adding a swipe gesture
![Page 15: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/15.jpg)
15
Device Information
![Page 16: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/16.jpg)
16
Device Information• Battery level
• Battery state
• Hardware ID
• Device OS
• Device PIN
• Platform Version
• Vendor ID
• Capture battery events for app lifecycle
• Identify your users based on PIN
• Identify the Device OS for functionality
![Page 17: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/17.jpg)
17
Battery Level and Events
• Monitor battery levels for power consumption in your app
• Customize your app to provide the user experience
• Display battery and charging information from your app
![Page 18: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/18.jpg)
18
Battery Level and Events
![Page 19: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/19.jpg)
Database
• SQLite is a in-process library that implements a self-contained, serverless, zero-configuration, transactional SQL database engine.
• Data is stored in a file on the system, typical the developer stores it in File.applicationStorageDirectory.
DB
FilePlayBook AIR Application
![Page 20: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/20.jpg)
AIR SQLite APIs
• SQLConnection
• open() – Synchronous
• openAsync() – Asynchronous
• loadSchema() – Database schema
• Can Encrypt data on disk.
• SQLStatement
• text – SQL commands
• execute()
• SQLError
• details/detailsID – SQL error message
• operation – SQL command causing error
![Page 21: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/21.jpg)
Shared Object
![Page 22: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/22.jpg)
AIR File APIs
• File
• File.applicationStorageDirectory - a storage directory unique to each installed AIR application
• File.applicationDirectory - the read-only directory where the application is installed (along with any installed assets)
• File.desktopDirectory, File.documentsDirectory, File.userDirectory
• Properties: exists, isDirectory, nativePath, extension, name, …
• Methods: browseForOpen, browseForSave, getDirectoryListing(), …
• FileStream
• writeObject() – Uses AMF to write binary serialization of object.
• open() – Synchronous
• openAsync() – Asynchronous
![Page 23: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/23.jpg)
23
Activity Indicator
• Provide visual progress
feedback to the user
during time-consuming operations
![Page 24: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/24.jpg)
Event Listeners
![Page 25: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/25.jpg)
25
Skinning QNX UI Components
![Page 26: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/26.jpg)
26
Skinning Basics
• Skin options
• Global themes
• Set specific component skins parts
• Skin states
• Methods of creating Skins
• Bitmaps with or without scale grid
• Display objects using graphics API
• QNX skin assets available for reuse
![Page 27: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/27.jpg)
27
PlayBook Themes• PlayBook comes with 2 Themes: White (default) & Black
![Page 28: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/28.jpg)
28
PlayBook Themes Example 2
![Page 29: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/29.jpg)
29
ThemesGlobal
![Page 30: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/30.jpg)
30
Skin States
• SkinStates.DISABLED
• SkinStates.DISABLED_SELECTED
• SkinStates.DOWN
• SkinStates.DOWN_SELECTED
• SkinStates.FOCUS
• SkinStates.SELECTED
• SkinStates.UP
• SkinStates.UP_ODD
![Page 31: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/31.jpg)
31
Component Skin Parts
• ToggleSwitch
• setFillSkin()
• setThumbSkin()
• setTrackSkin()
• Button
• setSkin()
• DropDown
• setBackgroundSkin()
• setButtonSkin()
• setListSkin()
• TextInput
• setSkin()
![Page 32: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/32.jpg)
32
Setting a Skin
• Set skin method typically takes these types:
• Class reference
• String of qualified class name
• DisplayObject instance
![Page 33: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/33.jpg)
33
Bitmaps with Slice 9 Scaling
• Use Case: Custom TextInput image that scales
Up/Down skin image Focus skin image
![Page 34: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/34.jpg)
34
Skin Code:
OddShapeSkin.png
OddShapeSkinFocus.png
![Page 35: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/35.jpg)
35
Drawing API
• Use Case: Custom TextInput with drawing API
• Need to update any time the width/height changes
![Page 36: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/36.jpg)
36
Skin Code:
![Page 37: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/37.jpg)
37
Skin Code:
![Page 38: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/38.jpg)
38
Resources & Support
![Page 39: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/39.jpg)
• BlackBerry Developer website
• http://us.blackberry.com/developers/tablet/devresources.jsp
• Webcast Series
• Docs
• BlackBerry Developer Forum
• http://supportforums.blackberry.com/t5/Tablet-OS-SDK-for-Adobe-AIR/bd-p/tablet
• BlackBerry Developer Blog
• http://devblog.blackberry.com/
• Adobe Labs
• http://labs.adobe.com/technologies/flash/blackberrytabos/
39
Resources & Support
![Page 40: Adobe AIR Development for the BlackBerry PlayBookdev.salesnow.com/share1/Rex/Adobe AIR Development for the... · • Porting existing Adobe AIR and Flash applications quickly and](https://reader034.fdocuments.in/reader034/viewer/2022051801/5adc92827f8b9ae1408bbaf5/html5/thumbnails/40.jpg)
40Feb 24, 2011
Q&A
Thank You!