Suche senden
Hochladen
From Android to the Mobile Web
•
1 gefällt mir
•
695 views
C
CommonsWare
Folgen
from the January 2013 Mobile+Web DevCon
Weniger lesen
Mehr lesen
Technologie
Melden
Teilen
Melden
Teilen
1 von 53
Jetzt herunterladen
Downloaden Sie, um offline zu lesen
Empfohlen
App Integration (Revised and Updated)
App Integration (Revised and Updated)
CommonsWare
App integration: Strategies and Tactics
App integration: Strategies and Tactics
CommonsWare
Workshop Fo Wa
Workshop Fo Wa
Joschi -
The Action Bar: Front to Back
The Action Bar: Front to Back
CommonsWare
JavaME UI - JMDF 2007
JavaME UI - JMDF 2007
Edoardo Schepis
2013 04-02-server-side-backbone
2013 04-02-server-side-backbone
SC5.io
Cluster Computers
Cluster Computers
shopnil786
Android Development: The 20,000-Foot View
Android Development: The 20,000-Foot View
CommonsWare
Empfohlen
App Integration (Revised and Updated)
App Integration (Revised and Updated)
CommonsWare
App integration: Strategies and Tactics
App integration: Strategies and Tactics
CommonsWare
Workshop Fo Wa
Workshop Fo Wa
Joschi -
The Action Bar: Front to Back
The Action Bar: Front to Back
CommonsWare
JavaME UI - JMDF 2007
JavaME UI - JMDF 2007
Edoardo Schepis
2013 04-02-server-side-backbone
2013 04-02-server-side-backbone
SC5.io
Cluster Computers
Cluster Computers
shopnil786
Android Development: The 20,000-Foot View
Android Development: The 20,000-Foot View
CommonsWare
Backwards Compatibility: Strategies and Tactics
Backwards Compatibility: Strategies and Tactics
CommonsWare
Second-Screen Support in Android 4.2
Second-Screen Support in Android 4.2
CommonsWare
What's New in Jelly Bean
What's New in Jelly Bean
CommonsWare
Android by Swecha
Android by Swecha
Swecha | స్వేచ్ఛ
Mastering the Master Detail Pattern
Mastering the Master Detail Pattern
CommonsWare
Integrate Android Apps and Web Apps
Integrate Android Apps and Web Apps
CommonsWare
Introducing Honeycomb
Introducing Honeycomb
CommonsWare
Google I/O 2019 - what's new in Android Q and Jetpack
Google I/O 2019 - what's new in Android Q and Jetpack
Sunita Singh
X Means Y
X Means Y
CommonsWare
Compatibility Testing of Your Web Apps - Tips and Tricks for Debugging Locall...
Compatibility Testing of Your Web Apps - Tips and Tricks for Debugging Locall...
Coveros, Inc.
Compatibility Testing of Your Web Apps - Tips and Tricks for Debugging Locall...
Compatibility Testing of Your Web Apps - Tips and Tricks for Debugging Locall...
Sauce Labs
Android workshop material
Android workshop material
Reza Yogaswara
Android crash course
Android crash course
Showmax Engineering
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Dee Sadler
Android development - the basics, MFF UK, 2012
Android development - the basics, MFF UK, 2012
Tomáš Kypta
What’s new for Developers in IBM Domino & Domino Designer 9.0.1
What’s new for Developers in IBM Domino & Domino Designer 9.0.1
IBM Connections Developers
Android Security: Defending Your Users
Android Security: Defending Your Users
CommonsWare
The Action Bar: Front to Back
The Action Bar: Front to Back
CommonsWare
Gradle and Your Android Wearable Projects
Gradle and Your Android Wearable Projects
CommonsWare
Android Jump Start
Android Jump Start
ConFoo
Getting Android Developers for Your Wearables
Getting Android Developers for Your Wearables
CommonsWare
When Microwatts Are Precious: Battery Tips for Wearable Apps
When Microwatts Are Precious: Battery Tips for Wearable Apps
CommonsWare
Weitere ähnliche Inhalte
Ähnlich wie From Android to the Mobile Web
Backwards Compatibility: Strategies and Tactics
Backwards Compatibility: Strategies and Tactics
CommonsWare
Second-Screen Support in Android 4.2
Second-Screen Support in Android 4.2
CommonsWare
What's New in Jelly Bean
What's New in Jelly Bean
CommonsWare
Android by Swecha
Android by Swecha
Swecha | స్వేచ్ఛ
Mastering the Master Detail Pattern
Mastering the Master Detail Pattern
CommonsWare
Integrate Android Apps and Web Apps
Integrate Android Apps and Web Apps
CommonsWare
Introducing Honeycomb
Introducing Honeycomb
CommonsWare
Google I/O 2019 - what's new in Android Q and Jetpack
Google I/O 2019 - what's new in Android Q and Jetpack
Sunita Singh
X Means Y
X Means Y
CommonsWare
Compatibility Testing of Your Web Apps - Tips and Tricks for Debugging Locall...
Compatibility Testing of Your Web Apps - Tips and Tricks for Debugging Locall...
Coveros, Inc.
Compatibility Testing of Your Web Apps - Tips and Tricks for Debugging Locall...
Compatibility Testing of Your Web Apps - Tips and Tricks for Debugging Locall...
Sauce Labs
Android workshop material
Android workshop material
Reza Yogaswara
Android crash course
Android crash course
Showmax Engineering
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Dee Sadler
Android development - the basics, MFF UK, 2012
Android development - the basics, MFF UK, 2012
Tomáš Kypta
What’s new for Developers in IBM Domino & Domino Designer 9.0.1
What’s new for Developers in IBM Domino & Domino Designer 9.0.1
IBM Connections Developers
Android Security: Defending Your Users
Android Security: Defending Your Users
CommonsWare
The Action Bar: Front to Back
The Action Bar: Front to Back
CommonsWare
Gradle and Your Android Wearable Projects
Gradle and Your Android Wearable Projects
CommonsWare
Android Jump Start
Android Jump Start
ConFoo
Ähnlich wie From Android to the Mobile Web
(20)
Backwards Compatibility: Strategies and Tactics
Backwards Compatibility: Strategies and Tactics
Second-Screen Support in Android 4.2
Second-Screen Support in Android 4.2
What's New in Jelly Bean
What's New in Jelly Bean
Android by Swecha
Android by Swecha
Mastering the Master Detail Pattern
Mastering the Master Detail Pattern
Integrate Android Apps and Web Apps
Integrate Android Apps and Web Apps
Introducing Honeycomb
Introducing Honeycomb
Google I/O 2019 - what's new in Android Q and Jetpack
Google I/O 2019 - what's new in Android Q and Jetpack
X Means Y
X Means Y
Compatibility Testing of Your Web Apps - Tips and Tricks for Debugging Locall...
Compatibility Testing of Your Web Apps - Tips and Tricks for Debugging Locall...
Compatibility Testing of Your Web Apps - Tips and Tricks for Debugging Locall...
Compatibility Testing of Your Web Apps - Tips and Tricks for Debugging Locall...
Android workshop material
Android workshop material
Android crash course
Android crash course
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Dreamweaver CS6, jQuery, PhoneGap, mobile design
Android development - the basics, MFF UK, 2012
Android development - the basics, MFF UK, 2012
What’s new for Developers in IBM Domino & Domino Designer 9.0.1
What’s new for Developers in IBM Domino & Domino Designer 9.0.1
Android Security: Defending Your Users
Android Security: Defending Your Users
The Action Bar: Front to Back
The Action Bar: Front to Back
Gradle and Your Android Wearable Projects
Gradle and Your Android Wearable Projects
Android Jump Start
Android Jump Start
Mehr von CommonsWare
Getting Android Developers for Your Wearables
Getting Android Developers for Your Wearables
CommonsWare
When Microwatts Are Precious: Battery Tips for Wearable Apps
When Microwatts Are Precious: Battery Tips for Wearable Apps
CommonsWare
Secondary Screen Support Using DisplayManager
Secondary Screen Support Using DisplayManager
CommonsWare
Not Quite As Painful Threading
Not Quite As Painful Threading
CommonsWare
Maps V2... And You!
Maps V2... And You!
CommonsWare
A Deep Dive Into ViewPager
A Deep Dive Into ViewPager
CommonsWare
The Wonderful World of Wearables
The Wonderful World of Wearables
CommonsWare
Securing User Data with SQLCipher
Securing User Data with SQLCipher
CommonsWare
Beaming Data to Devices with NFC
Beaming Data to Devices with NFC
CommonsWare
Making Money at Mobile: 60 Business Models
Making Money at Mobile: 60 Business Models
CommonsWare
AppsWorld Keynote
AppsWorld Keynote
CommonsWare
Rich Text Editing and Beyond
Rich Text Editing and Beyond
CommonsWare
Android Hardware That's A Little Bit... Odd
Android Hardware That's A Little Bit... Odd
CommonsWare
Google TV For Fun
Google TV For Fun
CommonsWare
If I Were Starting Now
If I Were Starting Now
CommonsWare
Tuning Android Applications (Part Deux)
Tuning Android Applications (Part Deux)
CommonsWare
Tuning Android Applications (Part One)
Tuning Android Applications (Part One)
CommonsWare
Android Library Projects
Android Library Projects
CommonsWare
Mehr von CommonsWare
(18)
Getting Android Developers for Your Wearables
Getting Android Developers for Your Wearables
When Microwatts Are Precious: Battery Tips for Wearable Apps
When Microwatts Are Precious: Battery Tips for Wearable Apps
Secondary Screen Support Using DisplayManager
Secondary Screen Support Using DisplayManager
Not Quite As Painful Threading
Not Quite As Painful Threading
Maps V2... And You!
Maps V2... And You!
A Deep Dive Into ViewPager
A Deep Dive Into ViewPager
The Wonderful World of Wearables
The Wonderful World of Wearables
Securing User Data with SQLCipher
Securing User Data with SQLCipher
Beaming Data to Devices with NFC
Beaming Data to Devices with NFC
Making Money at Mobile: 60 Business Models
Making Money at Mobile: 60 Business Models
AppsWorld Keynote
AppsWorld Keynote
Rich Text Editing and Beyond
Rich Text Editing and Beyond
Android Hardware That's A Little Bit... Odd
Android Hardware That's A Little Bit... Odd
Google TV For Fun
Google TV For Fun
If I Were Starting Now
If I Were Starting Now
Tuning Android Applications (Part Deux)
Tuning Android Applications (Part Deux)
Tuning Android Applications (Part One)
Tuning Android Applications (Part One)
Android Library Projects
Android Library Projects
Kürzlich hochgeladen
SIEMENS: RAPUNZEL – A Tale About Knowledge Graph
SIEMENS: RAPUNZEL – A Tale About Knowledge Graph
Neo4j
Slack Application Development 101 Slides
Slack Application Development 101 Slides
praypatel2
Swan(sea) Song – personal research during my six years at Swansea ... and bey...
Swan(sea) Song – personal research during my six years at Swansea ... and bey...
Alan Dix
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
Michael W. Hawkins
How to Remove Document Management Hurdles with X-Docs?
How to Remove Document Management Hurdles with X-Docs?
XfilesPro
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
Gabriella Davis
Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101
Paola De la Torre
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
Delhi Call girls
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
Safe Software
AI as an Interface for Commercial Buildings
AI as an Interface for Commercial Buildings
Memoori
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
carlostorres15106
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
Rafal Los
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
HostedbyConfluent
Azure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & Application
AndikSusilo4
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
Delhi Call girls
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Patryk Bandurski
Benefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other Frameworks
Softradix Technologies
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR Systems
Mark Billinghurst
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC Architecture
Pixlogix Infotech
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
Puma Security, LLC
Kürzlich hochgeladen
(20)
SIEMENS: RAPUNZEL – A Tale About Knowledge Graph
SIEMENS: RAPUNZEL – A Tale About Knowledge Graph
Slack Application Development 101 Slides
Slack Application Development 101 Slides
Swan(sea) Song – personal research during my six years at Swansea ... and bey...
Swan(sea) Song – personal research during my six years at Swansea ... and bey...
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
How to Remove Document Management Hurdles with X-Docs?
How to Remove Document Management Hurdles with X-Docs?
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
AI as an Interface for Commercial Buildings
AI as an Interface for Commercial Buildings
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Transforming Data Streams with Kafka Connect: An Introduction to Single Messa...
Azure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & Application
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Benefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other Frameworks
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR Systems
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC Architecture
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
From Android to the Mobile Web
1.
From Android to the
Mobile Web Copyright © 2013 CommonsWare, LLC
2.
Who's the Target? ●
Mass Market – E.g., distribution on Play Store, App Store – Pursue maximum fidelity strategy, as UI quirks are more likely to be noticed ● Niche Market – Enterprise, small business, government, etc. – Pursue minimum maintenance strategy, as budgets preclude otherwise Copyright © 2013 CommonsWare, LLC
3.
Objectives... Of Developers ●
Maximum Fidelity Strategy – Native apps for major platforms – Mobile Web apps for secondary platforms ● Minimum Maintenance Strategy – Mobile Web apps for all platforms – Possibly augmented on some platforms Copyright © 2013 CommonsWare, LLC
4.
Objectives... Of This
Workshop ● Demonstrate Developing for the Mobile Web – Emphasis on installable apps (vs. HTML5 Web apps) ● Approach from an Android Mindset – E.g., widget library vs. low-level HTML – Seek analogous solutions to help with climbing the learning curve Copyright © 2013 CommonsWare, LLC
5.
Prerequisites ●
Experience in Android development ● Basic understanding of JavaScript ● At least a vague concept of the role of CSS ● ~3 hours Copyright © 2013 CommonsWare, LLC
6.
Ingredients ●
Widget Library: Enyo – Offshoot of WebOS – Pros ● Works on desktop (mouse-centric) and mobile (touch-centric) ● Apache license – Cons ● Relatively new Copyright © 2013 CommonsWare, LLC
7.
Ingredients ●
Widget Library Alternative: Sencha Touch – Pros ● Around longer, plus based on ExtJS (around longer still) – Cons ● Mobile-only (similar to, but not identical to, ExtJS) ● Licensing Copyright © 2013 CommonsWare, LLC
8.
Ingredients ●
Container: Apache Cordova/Adobe PhoneGap – Wrapper around Web assets for deployable app (e.g., APK) – JavaScript library for access to device-specific capabilities ● For things that are beyond the scope of current standards Copyright © 2013 CommonsWare, LLC
9.
Ingredients ●
Cordova/PhoneGap Platform Support – Android – iOS – Windows Phone – Blackberry (5.x+) – Symbian – Bada – More to come Copyright © 2013 CommonsWare, LLC
10.
Demo: HelloWorld Copyright
© 2013 CommonsWare, LLC
11.
Playing Around Here ●
Option #1: Build Android PhoneGap App – Set up for command-line build – Or import into Eclipse or other IDE ● Option #2: Web browser – Works for the first few samples – Eventual Limitations ● PhoneGap integration ● AJAX Copyright © 2013 CommonsWare, LLC
12.
Local Android PhoneGap
Build ● Copy desired Web content into assets/www/ of PhoneGap template project ● Modify other aspects of project manifest – Package name, label, icon, … ● Build and run – Eclipse – Command line Copyright © 2013 CommonsWare, LLC
13.
Enyo: Kinds and
Components ● JavaScript: OO, Not Class-Based – Prototype-based, a la Self ● Kinds: Enyo's Quasi-Class Structure – Functions ~= Java methods – Declared in object notation ● Components: Adds Property Management – ~= Java data members with accessors Copyright © 2013 CommonsWare, LLC
14.
Demo: EnyoHelloWorld
Copyright © 2013 CommonsWare, LLC
15.
Enyo: Controls ●
Android: Activities, Fragments, Widgets, and Containers – Loosely coupled constructs ● Enyo: Controls, All The Way Down – Activity = a control – Fragments = controls – Containers = controls – Widgets = controls Copyright © 2013 CommonsWare, LLC
16.
Enyo: Controls ●
Key Properties – name ~= Java class name – content = the HTML to start with ● Alternative: tag – classes = CSS classes to apply ● Alternative: style for inline CSS – components = child controls ● ~= ViewGroup ● Children rendered inside the control itself Copyright © 2013 CommonsWare, LLC
17.
Demo: EnyoHelloWorld,
Revisited Copyright © 2013 CommonsWare, LLC
18.
Activity → Top-Level
Control ● Contains the rest of the controls – Simply inline-defined in components array – First-class custom controls, instantiated via components array ● Contains top-level behaviors – Directly or by delegation to some sort of controller Copyright © 2013 CommonsWare, LLC
19.
Onyx ●
Partly, a Widget Library – Enyo has core controls – Onyx extends, refines, elaborates – Example: Button vs. ToggleButton ● Partly, a Theme – Applies a stock style to all widgets – You tailor via CSS Copyright © 2013 CommonsWare, LLC
20.
Common Enyo Controls ●
onyx.Button – ~= Button, ImageButton ● onyx.RadioButton – ~= RadioButton, ToggleButton ● onyx.ToggleButton – ~= Switch Copyright © 2013 CommonsWare, LLC
21.
Demo: Now
Copyright © 2013 CommonsWare, LLC
22.
Common Enyo Controls ●
onyx.Checkbox – ~= CheckBox ● onyx.Input, onyx.TextArea – ~= EditText ● onyx.RichText – ~= RichTextEdit ● onyx.DatePicker, onyx.TimePicker – ~= DatePicker, TimePicker Copyright © 2013 CommonsWare, LLC
23.
Enyo Containers ●
enyo.FittableColumns, enyo.FittableRows – ~= LinearLayout (horizontal, vertical) – fit:true on component has it fill space unused by rest (~= android:layout_weight=“1”) ● enyo.Scroller – ~= ScrollView Copyright © 2013 CommonsWare, LLC
24.
Enyo Containers ●
enyo.Panels – Organizes components according to an arranger – GridArranger: ~= GridLayout/FlowLayout – CollapsingArranger: ~= ViewPager ● Can also use for master-detail pattern based upon available space – CarouselArranger: ~= ViewPager in “infinite” mode – CardArranger: ~= ViewSwitcher Copyright © 2013 CommonsWare, LLC
25.
Lists in Enyo ●
enyo.List – ~= ListView – Components are duplicated for each row – onSetupItem property supplies function to be called to configure and populate the row ● ~= bindView() in a ListAdapter Copyright © 2013 CommonsWare, LLC
26.
Demo: CommonsBlog,
Native Copyright © 2013 CommonsWare, LLC
27.
Demo: CommonsBlog, Mobile Web
Part One Copyright © 2013 CommonsWare, LLC
28.
Displaying Web Content ●
Option #1: Control – Set allowHtml=true – Assign HTML to content – Pros: inline with the rest of your material – Cons: inline with the rest of your material ● Only use with stuff you reasonably trust Copyright © 2013 CommonsWare, LLC
29.
Displaying Web Content ●
Option #2: InAppBrowser – Feature supplied by PhoneGap – Options ● _self = replaces your app with content ● _blank = starts up separate Web container within your app for the content ● _system = launches the device default browser Copyright © 2013 CommonsWare, LLC
30.
Displaying Web Content ●
Option #2: InAppBrowser – Pros: isolates the external material from your app – Cons ● Only works on URLs, not HTML you might get from elsewhere (e.g., Web service call, Atom feed) ● Takes over the screen, not inline with your app Copyright © 2013 CommonsWare, LLC
31.
Demo: CommonsBlog, Mobile Web
Part Two Copyright © 2013 CommonsWare, LLC
32.
Multiple Screen Sizes ●
At It's Core, No Different Than Desktop – Web developers have had to deal with varying browser window sizes since the dawn of the Web – Techniques ● CSS media queries ● Detect size in JavaScript and run alternative branches (e.g., enyo.dom.getWindowWidth()) ● User agent/device model sniffing Copyright © 2013 CommonsWare, LLC
33.
Multiple Screen Sizes ●
Master-Detail in Enyo – Use enyo.CollapsingArranger with two panels ● Specify size for left-hand panel, right fills space... for larger sizes ● Automatically switches into one-panel-at-a-time mode at 800px (where px in CSS ~= dp in Android) ● Swiping to move between panels, plus can change active panel via JavaScript code Copyright © 2013 CommonsWare, LLC
34.
Multiple Screen Sizes ●
Want Behavior Change At Other Than 800px? – narrowFit=false on your Panels – Use CSS class with media query to determine actual cutoff – Optional: override isScreenNarrow() function ● Not used by framework, convenience for developers Copyright © 2013 CommonsWare, LLC
35.
Multiple Screen Densities ●
CSS Media Queries – min-device-pixel-ratio to determine density ● 1.5, 2.0, etc. – Apply changes ● Different icons ● Different font sizes (should automatically adjust, but your mileage may vary) Copyright © 2013 CommonsWare, LLC
36.
Navigation ●
Get Back to Where You Once Belonged – Android: BACK button – iOS: Back on-screen button in UI – Other platforms will have their own conventions – Challenge: supporting them all Copyright © 2013 CommonsWare, LLC
37.
Hooking the BACK
Button ● Step #1: Do Not Render Until PhoneGap Ready – PhoneGap sends deviceready event – We get control and render then ● Step #2: Tell Enyo to Route backbutton – PhoneGap sends backbutton event – Enyo can route through its standard event dispatching mechanism Copyright © 2013 CommonsWare, LLC
38.
Hooking the BACK
Button ● Step #3: Listen for Event in UI – Add an enyo.Signals component to activity or something – Define function for onbackbutton – Do something useful for navigation ● Back up a panel if first panel is not active ● Exit app via navigator.app.exitApp() Copyright © 2013 CommonsWare, LLC
39.
Demo: CommonsBlog, Mobile Web
Part Three Copyright © 2013 CommonsWare, LLC
40.
AJAX and Internet
Access ● What Enyo Provides – enyo.Async as base kind for asynchronous operations – enyo.Ajax for classic JS AJAX requests – enyo.JsonpRequest for JSONP ● Means in a Web app of getting past cross-origin restrictions inherent to AJAX Copyright © 2013 CommonsWare, LLC
41.
AJAX and Internet
Access ● What PhoneGap Provides – Whitelist for what domains can be bypassed for cross-origin restrictions ● For these domains, enyo.Ajax works directly ● Single domain, wildcards, etc. Copyright © 2013 CommonsWare, LLC
42.
AJAX and Internet
Access ● AJAX/JSONP Functions – Constructor: supply URL – go() to schedule the request – response() to attach a function to be invoked upon success, with results – error() to attach a function to be invoked when there is some HTTP error Copyright © 2013 CommonsWare, LLC
43.
Demo: CommonsBlog, Mobile Web
The End Copyright © 2013 CommonsWare, LLC
44.
PhoneGap Build ●
Hosted Build Service – Create config.xml describing the app and requirements (based on W3C widget spec) – Supply Web assets + config.xml to Build ● ZIP archive ● GitHub repo – Build automatically creates builds for each supported platform ● Minor complication with signing keys Copyright © 2013 CommonsWare, LLC
45.
Demo: CommonsBlog, Mobile
Web Beyond The End Copyright © 2013 CommonsWare, LLC
46.
PhoneGap API ●
Accelerometer ● Camera ● Capture ● Compass ● Connection – Determine if on WiFi or mobile data Copyright © 2013 CommonsWare, LLC
47.
PhoneGap API ●
Device – Make, model, OS version, etc. ● Events ● File ● Geolocation ● Globalization ● Media Copyright © 2013 CommonsWare, LLC
48.
PhoneGap API ●
Notification – Dialogs, beeps, vibrations ● Splashscreen ● Storage – Web SQL implementation, to fill in for platforms that lack it Copyright © 2013 CommonsWare, LLC
49.
PhoneGap Plugins ●
Extends PhoneGap Environment with New Native Capabilities – All aforementioned PhoneGap APIs moving to be plugins – You can define your own, for whatever platforms you are supporting – Many third-party plugins already available ● May not support all your platforms, though Copyright © 2013 CommonsWare, LLC
50.
PhoneGap Plugins ●
Step #1: Create JS objects/functions – Call cordova.exec() to pass control to native layer – Will need to arrange to load this JS ● Step #2: Implement Native Layer – E.g., Android create CordovaPlugin class ● Step #3: Augment config.xml For Plugin – Tells PhoneGap, PhoneGap Build to add your native layer Copyright © 2013 CommonsWare, LLC
51.
HTML5 Storage Options ●
Local Storage – Simple associative array, strings to strings ● IndexedDB – JSON database with developer-defined key property ● Deprecated: Web SQL – Still supported by PhoneGap Copyright © 2013 CommonsWare, LLC
52.
Summary ●
Mobile Web Development: New and Growing – Reminiscent of Android, circa 2009 ● Not Suitable for All Scenarios – Use where audience will accept it and provides development, maintenance savings ● Widget Frameworks, PhoneGap Ease Transition for Android Developers Copyright © 2013 CommonsWare, LLC
53.
Speaker Contact
Information SlideShare Copyright © 2013 CommonsWare, LLC
Jetzt herunterladen