Designing Better BlackBerry PlayBook Apps - PowerPoint PPT Presentation

Designing better blackberry playbook apps l.jpg
Download
1 / 32

Designing Better BlackBerry PlayBook Apps. Characteristics of the BlackBerry PlayBook. Seven inch screen size Multi touch interface Landscape or portrait display Virtual keyboard. Make a touch centric app. On screen interactions. Notifications and Indicators.

I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.

Download Presentation

Designing Better BlackBerry PlayBook Apps

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Designing better blackberry playbook apps l.jpg

Designing Better BlackBerry PlayBook Apps


Characteristics of the blackberry playbook l.jpg

Characteristics of the BlackBerry PlayBook

  • Seven inch screen size

  • Multi touch interface

  • Landscape or portrait display

  • Virtual keyboard


Make a touch centric app l.jpg

Make a touch centric app


On screen interactions l.jpg

On screen interactions


Notifications and indicators l.jpg

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


Api s to build great apps l.jpg

API’s to build great apps


Slide7 l.jpg

Adding a swipe gesture


Slide8 l.jpg

Adding a swipe gesture


Slide9 l.jpg

Device Information


Slide10 l.jpg

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


Slide11 l.jpg

Activity Indicator

  • provide visual progress feedback to the user during time-consuming operations


Slide12 l.jpg

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


Slide13 l.jpg

Battery Level and Events


Database l.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

PlayBook AIR Application

File


Air sqlite apis l.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


Shared object l.jpg

Shared Object


Air file apis l.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


Slide18 l.jpg

Alert Dialog


Slide19 l.jpg

Skinning QNX UI Components


Skinning basics l.jpg

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


Playbook themes l.jpg

PlayBook Themes

  • PlayBook comes with 2 Themes: White (default) & Black


Playbook themes example 2 l.jpg

PlayBook Themes Example 2


Themesglobal l.jpg

ThemesGlobal


Skin states l.jpg

Skin States

  • SkinStates.DISABLED

  • SkinStates.DISABLED_SELECTED

  • SkinStates.DOWN

  • SkinStates.DOWN_SELECTED

  • SkinStates.FOCUS

  • SkinStates.SELECTED

  • SkinStates.UP

  • SkinStates.UP_ODD


Component skin parts l.jpg

Component Skin Parts

  • DropDown

    • setBackgroundSkin()

    • setButtonSkin()

    • setListSkin()

  • ToggleSwitch

    • setFillSkin()

    • setThumbSkin()

    • setTrackSkin()

  • Button

    • setSkin()

  • TextInput

    • setSkin()


Setting a skin l.jpg

Setting a Skin

  • Set skin method typically takes these types:

    • Class reference

    • String of qualified class name

    • DisplayObject instance


Bitmaps with slice 9 scaling l.jpg

Bitmaps with Slice 9 Scaling

  • Use Case: Custom TextInput image that scales

Up/Down skin image

Focus skin image


Skin code l.jpg

Skin Code:

OddShapeSkin.png

OddShapeSkinFocus.png


Drawing api l.jpg

Drawing API

  • Use Case: Custom TextInput with drawing API

    • Need to update any time the width/height changes


Skin code30 l.jpg

Skin Code:


Skin code31 l.jpg

Skin Code:


Slide32 l.jpg

Q&A

Thank You!


  • Login