SlideShare uma empresa Scribd logo
1 de 48
Baixar para ler offline
Hybrid App using WordPress
Haim Michael
June 9th
, 2016
All logos, trademarks and brand names used in this presentation, such as the logo of Google
or any of its products, belong to their respective owners. Haim Michael and LifeMichael
are independent and not related, affiliated or connected neither with Google, TinyURL, Facebook
or any of the companies and the technologies mentioned in this presentation.
LifeMichael.com
Table of Content
LifeMichael.com
● Haim Michael Introduction
● Hybrid Applications Overview
● The WebView Class
● JavaScript Libraries
● JavaScript Calling Java
● Java Calling JavaScript
● Handling The Back Button
● Handling External Links
● Chrome DevTools Debugging
● Other Platforms
● PhoneGap Framework
● Simple Solutions
● Learning Resources
● Questions & Answers
Haim Michael Introduction
● Snowboarding. Learning. Coding. Teaching. More than
18 years of Practical Experience.
LifeMichael.com
Haim Michael Introduction
● Professional Certifications
Zend Certified Engineer in PHP
Certified Java Professional
Certified Java EE Web Component Developer
OMG Certified UML Professional
● MBA (cum laude) from Tel-Aviv University
Information Systems Management
LifeMichael.com
Hybrid Applications Overview
● The hybrid applications include code written in a native
programming language and code written in various client
side web technologies, such as HTML, CSS and JS.
LifeMichael.com
Device Display
Web Browser Object
The Android WebView Class
● Instantiating WebView class we have when developing
for the android platform we will get an object that
functions as a web browser.
● WebView extends View. We can treat the object as any
other view.
● As of Android 4.4, WebView is based on the Chromium
open source project.
● The other mobile platforms have a similar class.
LifeMichael.com
The Android WebView Class
LifeMichael.com
public class SimpleHybridDemo extends Activity
{
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
WebView ob = new WebView(this);
WebView.setWebContentsDebuggingEnabled(true);
ob.getSettings().setJavaScriptEnabled(true);
ob.loadUrl("file:///android_asset/demo.html");
setContentView(ob);
}
}
MainActivity.java
SimpleHybridDemo
The Android WebView Class
LifeMichael.com
<form name="myform">
<br/>num 1: <input type="text" name="num_a"/>
<br/>num 2: <input type="text" name="num_b"/>
<br/><input type="button" onclick="calc()" value="+"/>
<br/>result: <input type="text" name="result"/>
</form>
<script>
function calc()
{
var a = parseInt(document.myform.num_a.value,10);
var b = parseInt(document.myform.num_b.value,10);
var sum = a+b;
document.myform.result.value = sum;
}
</script>
demo.html
The Android WebView Class
LifeMichael.com
The Android WebView Class
● Calling the getSettings() method on our WebView
object we will get a WebSettings object through which
we can configure the behavior of our WebView.
…
WebView ob;
…
WebSettings settings = ob.getSettings();
settings.setJavaScriptEnabled(true);
settings.setDatabaseEnabled(true);
…
LifeMichael.com
JavaScript Libraries
● There are many JavaScript libraries optimized for touch
screen devices we can use.
LifeMichael.com
JavaScript Libraries
● You can find samples for hybrid applications developed
using SenchaTouch at
http://dev.sencha.com/deploy/touch/examples/
● You can find samples for hybrid applications developed
using jQueryMobile at
http://www.jqmgallery.com
LifeMichael.com
JavaScript Libraries
● When displaying content in our web view we better add
the viewport meta element.
<meta name="viewport"
content="width=device-width, initial-scale=1.0" />
<meta name="viewport"
content="initial-scale=1.0, user-scalable=no" />
LifeMichael.com
JavaScript Calling Java
● Calling the addJavaScriptInterface() method on
the WebView object we can bind an object to the
JavaScript execution code allowing code in JavaScript to
call methods on that object.
LifeMichael.com
JavaScript Calling Java
● We should mark the methods defined in Java we want to
allow their execution from code written in JavaScript with
the @android.webkit.JavascriptInterface
annotation.
LifeMichael.com
class CalculateObject
{
@android.webkit.JavascriptInterface
public int calculateSum(int numA, int numB)
{
return numA + numB;
}
}
JavaScript Calling Java
LifeMichael.com
public class HybridActivity extends Activity
{
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
WebView ob = new WebView(this);
WebView.setWebContentsDebuggingEnabled(true);
ob.getSettings().setJavaScriptEnabled(true);
ob.addJavascriptInterface(new CalculateObject(),"ob");
ob.loadUrl(
"http://www.abelski.com/courses/android/simple.html");
setContentView(ob);
}
class CalculateObject
{
@android.webkit.JavascriptInterface
public int calculateSum(int numA, int numB)
{
return numA + numB;
}
}
}
HybridActivity
JavaScript Calling Java
LifeMichael.com
<form name="myform">
<br/>number 1: <input type="text" name="num_a"/>
<br/>number 2: <input type="text" name="num_b"/>
<br/><input type="button" onclick="calc()" value="+"/>
<br/>result: <input type="text" name="result"/>
</form>
<script>
function calc()
{
var a = parseInt(document.myform.num_a.value,10);
var b = parseInt(document.myform.num_b.value,10);
var sum = window.ob.calculateSum(a,b);
document.myform.result.value = sum;
}
</script>
simple.html
JavaScript Calling Java
LifeMichael.com
Java Calling JavaScript
● We can use the loadUrl method passing over a string
that starts with “javascript:” in order to invoke a specific
function in JavaScript.
webView.loadUrl("javascript:increment()");
LifeMichael.com
Java Calling JavaScript
LifeMichael.com
public class JavaCallingJavaScript extends Activity
{
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
LinearLayout layout = new LinearLayout(this);
final WebView webView = new WebView(this);
webView.getSettings().setJavaScriptEnabled(true);
webView.loadUrl("file:///android_asset/demo3.html");
Button bt = new Button(this);
bt.setText("count");
bt.setOnClickListener(new View.OnClickListener()
{
@Override
public void onClick(View v)
{
webView.loadUrl("javascript:increment()");
}
});
layout.addView(bt);
layout.addView(webView);
setContentView(layout);
}
}
Java Calling JavaScript
LifeMichael.com
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h3>Java Calling JavaScript</h3>
<div id="msg">0</div>
<script>
function increment()
{
var ob = document.getElementById("msg");
ob.innerText = parseInt(ob.innerText)+1;
}
</script>
</body>
</html>
demo.html
Java Calling JavaScript
LifeMichael.com
Handling The Back Button
LifeMichael.com
● When the user presses the device's back button he is taken to
the previous activity.
● We can override this normal behavior by overriding the
onBackPresses() function, that was defined in Activity.
…
public onBackPresses() {
webView.loadUrl(…);
}
Handling External Links
LifeMichael.com
● When the user presses a URL link displayed inside the web
view the user will be forwarded to the web browser.
● We can set a different behavior by setting our own
implementation for WebViewClient.
ob.setWebViewClient(new WebViewClient() {
public void shouldOverrideUrlLoading (
WebView view, String url) {
view.loadUrl(… );
}
});
Handling External Links
LifeMichael.com
public class HandlingExternalLinks extends Activity
{
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
String str = "";
str += "<br><a href="http://clock">get system time</a>";
str += "<br><a href="http://sdk">sdk version</a>";
str += "<br><a href="http://developer">developer name</a>";
WebView browser = (WebView) findViewById(R.id.webby);
browser.getSettings().setJavaScriptEnabled(true);
browser.setWebViewClient(new URLIntercepter());
browser.loadData(str, "text/html", "UTF-8");
}
}
HandlingExternalLinks.java
Handling External Links
LifeMichael.com
HandlingExternalLinks.java
public class URLIntercepter extends WebViewClient
{
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url)
{
if (url.contains("clock"))
{
String html = "<h2>" + new Date().toString() + "</h2>";
view.loadData(html, "text/html", "UTF-8");
return true;
}
else if(url.contains("sdk"))
{
String html = "<h2>The SDK version is " +
Build.VERSION.SDK_INT + "</h2>";
view.loadData(html, "text/html", "UTF-8");
return true;
}
Handling External Links
LifeMichael.com
else if(url.contains("developer"))
{
String html = "<h2>Developer name is Haim Michael</h2>";
view.loadData(html, "text/html", "UTF-8");
return true;
}
else
{
return false;
}
}
}
Handling External Links
LifeMichael.com
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<WebView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/webby"
android:layout_gravity="center_vertical"/>
</LinearLayout>
main.xml
Handling External Links
LifeMichael.com
Chrome DevTools Debugging
LifeMichael.com
● We can use the Chrome DevTools debugger for debugging
the code in JavaScript running inside the WebView.
● We should call the setWebContentDebuggingEnabled
static method (defined in WebView) passing over true in order
to enable the debugging.
WebView.setWebContentDebuggingEnabled(true);
● We should open Chrome web browser and browse at the
following URL address:
chrome://inspect/#devices
Chrome DevTools Debugging
LifeMichael.com
Chrome DevTools Debugging
LifeMichael.com
Other Platforms
LifeMichael.com
Chrome OS Windows 8+
Electron
electron.atom.io nwjs.ioelectron.atom.io
nwjs.io
qt.io
qt.io
The PhoneGap Framework
● The PhoneGap framework assists with the
development of hybrid applications for mobile
platforms.The PhoneGap framework includes two
parts. The JavaScript library that includes the
definition of functions that allow using the platform
native capabilities. The native code developed
specifically separately for each and every mobile
platform.
LifeMichael.com
The PhoneGap Framework
● The implementation of the JavaScript library is
different for each and every platform. It includes
invocation of functions that belong to the native part.
● You can find detailed documentation for PhoneGap
capabilities at http://docs.phonegap.com.
● The simplest way for using PhoneGap would be
using the http://build.phonegap.com website.
LifeMichael.com
The PhoneGap Framework
LifeMichael.com
package org.apache.cordova.example;
import android.app.Activity;
import android.os.Bundle;
import org.apache.cordova.*;
public class cordovaExample extends DroidGap
{
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
super.loadUrl("file:///android_asset/www/index.html");
}
}
The PhoneGap Framework
LifeMichael.com
<!DOCTYPE html>
<html>
<head>
...
<title>Hello World</title>
</head>
<body>
<div class="app">
<h1>Apache Cordova</h1>
...
</div>
<script type="text/javascript" src="cordova-2.3.0.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
</script>
</body>
</html>
index.html
Simpler Solutions
www.wiziapp.com
Simpler Solutions
www.mobiloud.com
Simpler Solutions
www.mobiloud.com
Simpler Solutions
www.reactorapps.io
Learning Resources
● The Android Platform main learning resource is the
http://developer.android.com website.
● You can find my free online course about software
development in my website at http://abelski.lifemichael.com
● Short video clips in hebrew together with short tutorials in
hebrew for learning Java can be found at
http://www.javabook.co.il
LifeMichael.com
Learning Resources
● Short video clips in hebrew together with short tutorials in
hebrew for learning PHP can be found at
http://www.phpbook.co.il
● Short video clips in hebrew together with short tutorials in
hebrew for learning Android development can be found at
http://www.androidbook.co.il
LifeMichael.com
My Coming Courses
Software Engineering in PHP7
http://tinyurl.com/lifemichaelphp
Starts in July 2016
My Coming Courses
HTML5 Cross Platform Mobile Applications
http://tinyurl.com/lifemichaelhtml5
Starts in July 2016
My Coming Courses
Applications Development for Android 7
http://tinyurl.com/lifemichaelandroid
Starts in September 2016
My Coming Courses
140 Academic Hours. 28 Weekly Meetings. Delivered
in Holon Institute of Technology. On Going Project.
Multiple Tiny Projects. All Meetings are Available on
Video. Attractive Price of 6700 Shekels.
tinyurl.com/lifemichaelhitcourses
Questions & Answers
If you enjoyed my seminar please leave me a comment
at http://speakerpedia.com/speakers/life-michael.
Thanks for your time!
Haim.

Mais conteúdo relacionado

Mais procurados

JAVA SCRIPT
JAVA SCRIPTJAVA SCRIPT
JAVA SCRIPTGo4Guru
 
Monster JavaScript Course - 50+ projects and applications
Monster JavaScript Course - 50+ projects and applicationsMonster JavaScript Course - 50+ projects and applications
Monster JavaScript Course - 50+ projects and applicationsLaurence Svekis ✔
 
JavaScript DOM - Dynamic interactive Code
JavaScript DOM - Dynamic interactive CodeJavaScript DOM - Dynamic interactive Code
JavaScript DOM - Dynamic interactive CodeLaurence Svekis ✔
 
WordPress Jump Start
WordPress Jump StartWordPress Jump Start
WordPress Jump StartHaim Michael
 
Javascript
JavascriptJavascript
JavascriptSushma M
 
Web components the future is here
Web components   the future is hereWeb components   the future is here
Web components the future is hereGil Fink
 
SFScon14: write java, run javascript: create enterprise html5 apps without “u...
SFScon14: write java, run javascript: create enterprise html5 apps without “u...SFScon14: write java, run javascript: create enterprise html5 apps without “u...
SFScon14: write java, run javascript: create enterprise html5 apps without “u...South Tyrol Free Software Conference
 
JavaScript Roadmap III - ECMAScript
JavaScript Roadmap III - ECMAScriptJavaScript Roadmap III - ECMAScript
JavaScript Roadmap III - ECMAScriptAswin Barath
 
Web development tool
Web development toolWeb development tool
Web development toolDeep Bhavsar
 
AngularJS for Beginners
AngularJS for BeginnersAngularJS for Beginners
AngularJS for BeginnersEdureka!
 
Multi modularized project setup with gulp, typescript and angular.js
Multi modularized project setup with gulp, typescript and angular.jsMulti modularized project setup with gulp, typescript and angular.js
Multi modularized project setup with gulp, typescript and angular.jsDavid Amend
 
Gradle enabled android project
Gradle enabled android projectGradle enabled android project
Gradle enabled android projectShaka Huang
 
WordCamp Greenville 2018 - Beware the Dark Side, or an Intro to Development
WordCamp Greenville 2018 - Beware the Dark Side, or an Intro to DevelopmentWordCamp Greenville 2018 - Beware the Dark Side, or an Intro to Development
WordCamp Greenville 2018 - Beware the Dark Side, or an Intro to DevelopmentEvan Mullins
 
Top 10 open source technologies for enterprise/Business web application devel...
Top 10 open source technologies for enterprise/Business web application devel...Top 10 open source technologies for enterprise/Business web application devel...
Top 10 open source technologies for enterprise/Business web application devel...Techcronus Business Solutions Pvt. Ltd.
 

Mais procurados (20)

JAVA SCRIPT
JAVA SCRIPTJAVA SCRIPT
JAVA SCRIPT
 
Monster JavaScript Course - 50+ projects and applications
Monster JavaScript Course - 50+ projects and applicationsMonster JavaScript Course - 50+ projects and applications
Monster JavaScript Course - 50+ projects and applications
 
JavaScript DOM - Dynamic interactive Code
JavaScript DOM - Dynamic interactive CodeJavaScript DOM - Dynamic interactive Code
JavaScript DOM - Dynamic interactive Code
 
WordPress Jump Start
WordPress Jump StartWordPress Jump Start
WordPress Jump Start
 
Javascript
JavascriptJavascript
Javascript
 
Web components the future is here
Web components   the future is hereWeb components   the future is here
Web components the future is here
 
SFScon14: write java, run javascript: create enterprise html5 apps without “u...
SFScon14: write java, run javascript: create enterprise html5 apps without “u...SFScon14: write java, run javascript: create enterprise html5 apps without “u...
SFScon14: write java, run javascript: create enterprise html5 apps without “u...
 
JavaScript Roadmap III - ECMAScript
JavaScript Roadmap III - ECMAScriptJavaScript Roadmap III - ECMAScript
JavaScript Roadmap III - ECMAScript
 
Web development tool
Web development toolWeb development tool
Web development tool
 
Top java script frameworks ppt
Top java script frameworks pptTop java script frameworks ppt
Top java script frameworks ppt
 
Java script session 3
Java script session 3Java script session 3
Java script session 3
 
AngularJS for Beginners
AngularJS for BeginnersAngularJS for Beginners
AngularJS for Beginners
 
Multi modularized project setup with gulp, typescript and angular.js
Multi modularized project setup with gulp, typescript and angular.jsMulti modularized project setup with gulp, typescript and angular.js
Multi modularized project setup with gulp, typescript and angular.js
 
Gradle enabled android project
Gradle enabled android projectGradle enabled android project
Gradle enabled android project
 
Introduction to Java Scripting
Introduction to Java ScriptingIntroduction to Java Scripting
Introduction to Java Scripting
 
WordCamp Greenville 2018 - Beware the Dark Side, or an Intro to Development
WordCamp Greenville 2018 - Beware the Dark Side, or an Intro to DevelopmentWordCamp Greenville 2018 - Beware the Dark Side, or an Intro to Development
WordCamp Greenville 2018 - Beware the Dark Side, or an Intro to Development
 
Introduction to Java Script
Introduction to Java ScriptIntroduction to Java Script
Introduction to Java Script
 
Code-Hub
Code-HubCode-Hub
Code-Hub
 
Top 10 open source technologies for enterprise/Business web application devel...
Top 10 open source technologies for enterprise/Business web application devel...Top 10 open source technologies for enterprise/Business web application devel...
Top 10 open source technologies for enterprise/Business web application devel...
 
Java script
Java scriptJava script
Java script
 

Semelhante a Hybrid App using WordPress

Gdg dev fest hybrid apps your own mini-cordova
Gdg dev fest hybrid apps  your own mini-cordovaGdg dev fest hybrid apps  your own mini-cordova
Gdg dev fest hybrid apps your own mini-cordovaAyman Mahfouz
 
Hybrid apps - Your own mini Cordova
Hybrid apps - Your own mini CordovaHybrid apps - Your own mini Cordova
Hybrid apps - Your own mini CordovaAyman Mahfouz
 
How to Webpack your Django!
How to Webpack your Django!How to Webpack your Django!
How to Webpack your Django!David Gibbons
 
Vaadin 7 CN
Vaadin 7 CNVaadin 7 CN
Vaadin 7 CNjojule
 
125 고성능 web view-deview 2013 발표 자료_공유용
125 고성능 web view-deview 2013 발표 자료_공유용125 고성능 web view-deview 2013 발표 자료_공유용
125 고성능 web view-deview 2013 발표 자료_공유용NAVER D2
 
20141002 delapsley-socalangularjs-final
20141002 delapsley-socalangularjs-final20141002 delapsley-socalangularjs-final
20141002 delapsley-socalangularjs-finalDavid Lapsley
 
Windows Store app using XAML and C#: Enterprise Product Development
Windows Store app using XAML and C#: Enterprise Product Development Windows Store app using XAML and C#: Enterprise Product Development
Windows Store app using XAML and C#: Enterprise Product Development Mahmoud Hamed Mahmoud
 
MeasureCamp IX (London) - 10 JavaScript Concepts for web analysts
MeasureCamp IX (London) - 10 JavaScript Concepts for web analystsMeasureCamp IX (London) - 10 JavaScript Concepts for web analysts
MeasureCamp IX (London) - 10 JavaScript Concepts for web analystsSimo Ahava
 
React Nativeはクロスプラットフォームモバイルアプリ開発の夢を見るか #DroidKaigi
React Nativeはクロスプラットフォームモバイルアプリ開発の夢を見るか #DroidKaigiReact Nativeはクロスプラットフォームモバイルアプリ開発の夢を見るか #DroidKaigi
React Nativeはクロスプラットフォームモバイルアプリ開発の夢を見るか #DroidKaigiYukiya Nakagawa
 
Java Web Programming on Google Cloud Platform [3/3] : Google Web Toolkit
Java Web Programming on Google Cloud Platform [3/3] : Google Web ToolkitJava Web Programming on Google Cloud Platform [3/3] : Google Web Toolkit
Java Web Programming on Google Cloud Platform [3/3] : Google Web ToolkitIMC Institute
 
Node.js and Selenium Webdriver, a journey from the Java side
Node.js and Selenium Webdriver, a journey from the Java sideNode.js and Selenium Webdriver, a journey from the Java side
Node.js and Selenium Webdriver, a journey from the Java sideMek Srunyu Stittri
 
Data binding в массы!
Data binding в массы!Data binding в массы!
Data binding в массы!Artjoker
 
Workshop: Building Vaadin add-ons
Workshop: Building Vaadin add-onsWorkshop: Building Vaadin add-ons
Workshop: Building Vaadin add-onsSami Ekblad
 

Semelhante a Hybrid App using WordPress (20)

Gdg dev fest hybrid apps your own mini-cordova
Gdg dev fest hybrid apps  your own mini-cordovaGdg dev fest hybrid apps  your own mini-cordova
Gdg dev fest hybrid apps your own mini-cordova
 
Hybrid apps - Your own mini Cordova
Hybrid apps - Your own mini CordovaHybrid apps - Your own mini Cordova
Hybrid apps - Your own mini Cordova
 
Android development
Android developmentAndroid development
Android development
 
How to Webpack your Django!
How to Webpack your Django!How to Webpack your Django!
How to Webpack your Django!
 
Vaadin 7 CN
Vaadin 7 CNVaadin 7 CN
Vaadin 7 CN
 
Hybrid app
Hybrid appHybrid app
Hybrid app
 
Javascript
JavascriptJavascript
Javascript
 
125 고성능 web view-deview 2013 발표 자료_공유용
125 고성능 web view-deview 2013 발표 자료_공유용125 고성능 web view-deview 2013 발표 자료_공유용
125 고성능 web view-deview 2013 발표 자료_공유용
 
React django
React djangoReact django
React django
 
20141002 delapsley-socalangularjs-final
20141002 delapsley-socalangularjs-final20141002 delapsley-socalangularjs-final
20141002 delapsley-socalangularjs-final
 
Windows Store app using XAML and C#: Enterprise Product Development
Windows Store app using XAML and C#: Enterprise Product Development Windows Store app using XAML and C#: Enterprise Product Development
Windows Store app using XAML and C#: Enterprise Product Development
 
Vaadin & Web Components
Vaadin & Web ComponentsVaadin & Web Components
Vaadin & Web Components
 
MeasureCamp IX (London) - 10 JavaScript Concepts for web analysts
MeasureCamp IX (London) - 10 JavaScript Concepts for web analystsMeasureCamp IX (London) - 10 JavaScript Concepts for web analysts
MeasureCamp IX (London) - 10 JavaScript Concepts for web analysts
 
React Nativeはクロスプラットフォームモバイルアプリ開発の夢を見るか #DroidKaigi
React Nativeはクロスプラットフォームモバイルアプリ開発の夢を見るか #DroidKaigiReact Nativeはクロスプラットフォームモバイルアプリ開発の夢を見るか #DroidKaigi
React Nativeはクロスプラットフォームモバイルアプリ開発の夢を見るか #DroidKaigi
 
Google Web Toolkit
Google Web ToolkitGoogle Web Toolkit
Google Web Toolkit
 
Java Web Programming on Google Cloud Platform [3/3] : Google Web Toolkit
Java Web Programming on Google Cloud Platform [3/3] : Google Web ToolkitJava Web Programming on Google Cloud Platform [3/3] : Google Web Toolkit
Java Web Programming on Google Cloud Platform [3/3] : Google Web Toolkit
 
JavaCro'14 - Building interactive web applications with Vaadin – Peter Lehto
JavaCro'14 - Building interactive web applications with Vaadin – Peter LehtoJavaCro'14 - Building interactive web applications with Vaadin – Peter Lehto
JavaCro'14 - Building interactive web applications with Vaadin – Peter Lehto
 
Node.js and Selenium Webdriver, a journey from the Java side
Node.js and Selenium Webdriver, a journey from the Java sideNode.js and Selenium Webdriver, a journey from the Java side
Node.js and Selenium Webdriver, a journey from the Java side
 
Data binding в массы!
Data binding в массы!Data binding в массы!
Data binding в массы!
 
Workshop: Building Vaadin add-ons
Workshop: Building Vaadin add-onsWorkshop: Building Vaadin add-ons
Workshop: Building Vaadin add-ons
 

Mais de Haim Michael

MongoDB Design Patterns
MongoDB Design PatternsMongoDB Design Patterns
MongoDB Design PatternsHaim Michael
 
Introduction to SQL Injections
Introduction to SQL InjectionsIntroduction to SQL Injections
Introduction to SQL InjectionsHaim Michael
 
Record Classes in Java
Record Classes in JavaRecord Classes in Java
Record Classes in JavaHaim Michael
 
Microservices Design Patterns
Microservices Design PatternsMicroservices Design Patterns
Microservices Design PatternsHaim Michael
 
Structural Pattern Matching in Python
Structural Pattern Matching in PythonStructural Pattern Matching in Python
Structural Pattern Matching in PythonHaim Michael
 
Unit Testing in Python
Unit Testing in PythonUnit Testing in Python
Unit Testing in PythonHaim Michael
 
OOP Best Practices in JavaScript
OOP Best Practices in JavaScriptOOP Best Practices in JavaScript
OOP Best Practices in JavaScriptHaim Michael
 
Bootstrap Jump Start
Bootstrap Jump StartBootstrap Jump Start
Bootstrap Jump StartHaim Michael
 
What is new in PHP
What is new in PHPWhat is new in PHP
What is new in PHPHaim Michael
 
What is new in Python 3.9
What is new in Python 3.9What is new in Python 3.9
What is new in Python 3.9Haim Michael
 
Programming in Python on Steroid
Programming in Python on SteroidProgramming in Python on Steroid
Programming in Python on SteroidHaim Michael
 
The matplotlib Library
The matplotlib LibraryThe matplotlib Library
The matplotlib LibraryHaim Michael
 
Pandas meetup 20200908
Pandas meetup 20200908Pandas meetup 20200908
Pandas meetup 20200908Haim Michael
 
The num py_library_20200818
The num py_library_20200818The num py_library_20200818
The num py_library_20200818Haim Michael
 
Jupyter notebook 20200728
Jupyter notebook 20200728Jupyter notebook 20200728
Jupyter notebook 20200728Haim Michael
 
The Power of Decorators in Python [Meetup]
The Power of Decorators in Python [Meetup]The Power of Decorators in Python [Meetup]
The Power of Decorators in Python [Meetup]Haim Michael
 
Asynchronous JavaScript Programming
Asynchronous JavaScript ProgrammingAsynchronous JavaScript Programming
Asynchronous JavaScript ProgrammingHaim Michael
 

Mais de Haim Michael (20)

Anti Patterns
Anti PatternsAnti Patterns
Anti Patterns
 
MongoDB Design Patterns
MongoDB Design PatternsMongoDB Design Patterns
MongoDB Design Patterns
 
Introduction to SQL Injections
Introduction to SQL InjectionsIntroduction to SQL Injections
Introduction to SQL Injections
 
Record Classes in Java
Record Classes in JavaRecord Classes in Java
Record Classes in Java
 
Microservices Design Patterns
Microservices Design PatternsMicroservices Design Patterns
Microservices Design Patterns
 
Structural Pattern Matching in Python
Structural Pattern Matching in PythonStructural Pattern Matching in Python
Structural Pattern Matching in Python
 
Unit Testing in Python
Unit Testing in PythonUnit Testing in Python
Unit Testing in Python
 
OOP Best Practices in JavaScript
OOP Best Practices in JavaScriptOOP Best Practices in JavaScript
OOP Best Practices in JavaScript
 
Java Jump Start
Java Jump StartJava Jump Start
Java Jump Start
 
Bootstrap Jump Start
Bootstrap Jump StartBootstrap Jump Start
Bootstrap Jump Start
 
What is new in PHP
What is new in PHPWhat is new in PHP
What is new in PHP
 
What is new in Python 3.9
What is new in Python 3.9What is new in Python 3.9
What is new in Python 3.9
 
Programming in Python on Steroid
Programming in Python on SteroidProgramming in Python on Steroid
Programming in Python on Steroid
 
The matplotlib Library
The matplotlib LibraryThe matplotlib Library
The matplotlib Library
 
Pandas meetup 20200908
Pandas meetup 20200908Pandas meetup 20200908
Pandas meetup 20200908
 
The num py_library_20200818
The num py_library_20200818The num py_library_20200818
The num py_library_20200818
 
Jupyter notebook 20200728
Jupyter notebook 20200728Jupyter notebook 20200728
Jupyter notebook 20200728
 
The Power of Decorators in Python [Meetup]
The Power of Decorators in Python [Meetup]The Power of Decorators in Python [Meetup]
The Power of Decorators in Python [Meetup]
 
Asynchronous JavaScript Programming
Asynchronous JavaScript ProgrammingAsynchronous JavaScript Programming
Asynchronous JavaScript Programming
 
Python Jump Start
Python Jump StartPython Jump Start
Python Jump Start
 

Último

Big Data Bellevue Meetup | Enhancing Python Data Loading in the Cloud for AI/ML
Big Data Bellevue Meetup | Enhancing Python Data Loading in the Cloud for AI/MLBig Data Bellevue Meetup | Enhancing Python Data Loading in the Cloud for AI/ML
Big Data Bellevue Meetup | Enhancing Python Data Loading in the Cloud for AI/MLAlluxio, Inc.
 
Transforming PMO Success with AI - Discover OnePlan Strategic Portfolio Work ...
Transforming PMO Success with AI - Discover OnePlan Strategic Portfolio Work ...Transforming PMO Success with AI - Discover OnePlan Strategic Portfolio Work ...
Transforming PMO Success with AI - Discover OnePlan Strategic Portfolio Work ...OnePlan Solutions
 
ARM Talk @ Rejekts - Will ARM be the new Mainstream in our Data Centers_.pdf
ARM Talk @ Rejekts - Will ARM be the new Mainstream in our Data Centers_.pdfARM Talk @ Rejekts - Will ARM be the new Mainstream in our Data Centers_.pdf
ARM Talk @ Rejekts - Will ARM be the new Mainstream in our Data Centers_.pdfTobias Schneck
 
Watermarking in Source Code: Applications and Security Challenges
Watermarking in Source Code: Applications and Security ChallengesWatermarking in Source Code: Applications and Security Challenges
Watermarking in Source Code: Applications and Security ChallengesShyamsundar Das
 
online pdf editor software solutions.pdf
online pdf editor software solutions.pdfonline pdf editor software solutions.pdf
online pdf editor software solutions.pdfMeon Technology
 
Webinar_050417_LeClair12345666777889.ppt
Webinar_050417_LeClair12345666777889.pptWebinar_050417_LeClair12345666777889.ppt
Webinar_050417_LeClair12345666777889.pptkinjal48
 
AI Embracing Every Shade of Human Beauty
AI Embracing Every Shade of Human BeautyAI Embracing Every Shade of Human Beauty
AI Embracing Every Shade of Human BeautyRaymond Okyere-Forson
 
Leveraging DxSherpa's Generative AI Services to Unlock Human-Machine Harmony
Leveraging DxSherpa's Generative AI Services to Unlock Human-Machine HarmonyLeveraging DxSherpa's Generative AI Services to Unlock Human-Machine Harmony
Leveraging DxSherpa's Generative AI Services to Unlock Human-Machine Harmonyelliciumsolutionspun
 
Growing Oxen: channel operators and retries
Growing Oxen: channel operators and retriesGrowing Oxen: channel operators and retries
Growing Oxen: channel operators and retriesSoftwareMill
 
Generative AI for Cybersecurity - EC-Council
Generative AI for Cybersecurity - EC-CouncilGenerative AI for Cybersecurity - EC-Council
Generative AI for Cybersecurity - EC-CouncilVICTOR MAESTRE RAMIREZ
 
Enterprise Document Management System - Qualityze Inc
Enterprise Document Management System - Qualityze IncEnterprise Document Management System - Qualityze Inc
Enterprise Document Management System - Qualityze Incrobinwilliams8624
 
Top Software Development Trends in 2024
Top Software Development Trends in  2024Top Software Development Trends in  2024
Top Software Development Trends in 2024Mind IT Systems
 
20240319 Car Simulator Plan.pptx . Plan for a JavaScript Car Driving Simulator.
20240319 Car Simulator Plan.pptx . Plan for a JavaScript Car Driving Simulator.20240319 Car Simulator Plan.pptx . Plan for a JavaScript Car Driving Simulator.
20240319 Car Simulator Plan.pptx . Plan for a JavaScript Car Driving Simulator.Sharon Liu
 
Why Choose Brain Inventory For Ecommerce Development.pdf
Why Choose Brain Inventory For Ecommerce Development.pdfWhy Choose Brain Inventory For Ecommerce Development.pdf
Why Choose Brain Inventory For Ecommerce Development.pdfBrain Inventory
 
Introduction-to-Software-Development-Outsourcing.pptx
Introduction-to-Software-Development-Outsourcing.pptxIntroduction-to-Software-Development-Outsourcing.pptx
Introduction-to-Software-Development-Outsourcing.pptxIntelliSource Technologies
 
Fields in Java and Kotlin and what to expect.pptx
Fields in Java and Kotlin and what to expect.pptxFields in Java and Kotlin and what to expect.pptx
Fields in Java and Kotlin and what to expect.pptxJoão Esperancinha
 
Kawika Technologies pvt ltd Software Development Company in Trivandrum
Kawika Technologies pvt ltd Software Development Company in TrivandrumKawika Technologies pvt ltd Software Development Company in Trivandrum
Kawika Technologies pvt ltd Software Development Company in TrivandrumKawika Technologies
 
Streamlining Your Application Builds with Cloud Native Buildpacks
Streamlining Your Application Builds  with Cloud Native BuildpacksStreamlining Your Application Builds  with Cloud Native Buildpacks
Streamlining Your Application Builds with Cloud Native BuildpacksVish Abrams
 
IA Generativa y Grafos de Neo4j: RAG time
IA Generativa y Grafos de Neo4j: RAG timeIA Generativa y Grafos de Neo4j: RAG time
IA Generativa y Grafos de Neo4j: RAG timeNeo4j
 

Último (20)

Big Data Bellevue Meetup | Enhancing Python Data Loading in the Cloud for AI/ML
Big Data Bellevue Meetup | Enhancing Python Data Loading in the Cloud for AI/MLBig Data Bellevue Meetup | Enhancing Python Data Loading in the Cloud for AI/ML
Big Data Bellevue Meetup | Enhancing Python Data Loading in the Cloud for AI/ML
 
Transforming PMO Success with AI - Discover OnePlan Strategic Portfolio Work ...
Transforming PMO Success with AI - Discover OnePlan Strategic Portfolio Work ...Transforming PMO Success with AI - Discover OnePlan Strategic Portfolio Work ...
Transforming PMO Success with AI - Discover OnePlan Strategic Portfolio Work ...
 
ARM Talk @ Rejekts - Will ARM be the new Mainstream in our Data Centers_.pdf
ARM Talk @ Rejekts - Will ARM be the new Mainstream in our Data Centers_.pdfARM Talk @ Rejekts - Will ARM be the new Mainstream in our Data Centers_.pdf
ARM Talk @ Rejekts - Will ARM be the new Mainstream in our Data Centers_.pdf
 
Watermarking in Source Code: Applications and Security Challenges
Watermarking in Source Code: Applications and Security ChallengesWatermarking in Source Code: Applications and Security Challenges
Watermarking in Source Code: Applications and Security Challenges
 
online pdf editor software solutions.pdf
online pdf editor software solutions.pdfonline pdf editor software solutions.pdf
online pdf editor software solutions.pdf
 
Webinar_050417_LeClair12345666777889.ppt
Webinar_050417_LeClair12345666777889.pptWebinar_050417_LeClair12345666777889.ppt
Webinar_050417_LeClair12345666777889.ppt
 
AI Embracing Every Shade of Human Beauty
AI Embracing Every Shade of Human BeautyAI Embracing Every Shade of Human Beauty
AI Embracing Every Shade of Human Beauty
 
Leveraging DxSherpa's Generative AI Services to Unlock Human-Machine Harmony
Leveraging DxSherpa's Generative AI Services to Unlock Human-Machine HarmonyLeveraging DxSherpa's Generative AI Services to Unlock Human-Machine Harmony
Leveraging DxSherpa's Generative AI Services to Unlock Human-Machine Harmony
 
Growing Oxen: channel operators and retries
Growing Oxen: channel operators and retriesGrowing Oxen: channel operators and retries
Growing Oxen: channel operators and retries
 
Salesforce AI Associate Certification.pptx
Salesforce AI Associate Certification.pptxSalesforce AI Associate Certification.pptx
Salesforce AI Associate Certification.pptx
 
Generative AI for Cybersecurity - EC-Council
Generative AI for Cybersecurity - EC-CouncilGenerative AI for Cybersecurity - EC-Council
Generative AI for Cybersecurity - EC-Council
 
Enterprise Document Management System - Qualityze Inc
Enterprise Document Management System - Qualityze IncEnterprise Document Management System - Qualityze Inc
Enterprise Document Management System - Qualityze Inc
 
Top Software Development Trends in 2024
Top Software Development Trends in  2024Top Software Development Trends in  2024
Top Software Development Trends in 2024
 
20240319 Car Simulator Plan.pptx . Plan for a JavaScript Car Driving Simulator.
20240319 Car Simulator Plan.pptx . Plan for a JavaScript Car Driving Simulator.20240319 Car Simulator Plan.pptx . Plan for a JavaScript Car Driving Simulator.
20240319 Car Simulator Plan.pptx . Plan for a JavaScript Car Driving Simulator.
 
Why Choose Brain Inventory For Ecommerce Development.pdf
Why Choose Brain Inventory For Ecommerce Development.pdfWhy Choose Brain Inventory For Ecommerce Development.pdf
Why Choose Brain Inventory For Ecommerce Development.pdf
 
Introduction-to-Software-Development-Outsourcing.pptx
Introduction-to-Software-Development-Outsourcing.pptxIntroduction-to-Software-Development-Outsourcing.pptx
Introduction-to-Software-Development-Outsourcing.pptx
 
Fields in Java and Kotlin and what to expect.pptx
Fields in Java and Kotlin and what to expect.pptxFields in Java and Kotlin and what to expect.pptx
Fields in Java and Kotlin and what to expect.pptx
 
Kawika Technologies pvt ltd Software Development Company in Trivandrum
Kawika Technologies pvt ltd Software Development Company in TrivandrumKawika Technologies pvt ltd Software Development Company in Trivandrum
Kawika Technologies pvt ltd Software Development Company in Trivandrum
 
Streamlining Your Application Builds with Cloud Native Buildpacks
Streamlining Your Application Builds  with Cloud Native BuildpacksStreamlining Your Application Builds  with Cloud Native Buildpacks
Streamlining Your Application Builds with Cloud Native Buildpacks
 
IA Generativa y Grafos de Neo4j: RAG time
IA Generativa y Grafos de Neo4j: RAG timeIA Generativa y Grafos de Neo4j: RAG time
IA Generativa y Grafos de Neo4j: RAG time
 

Hybrid App using WordPress

  • 1. Hybrid App using WordPress Haim Michael June 9th , 2016 All logos, trademarks and brand names used in this presentation, such as the logo of Google or any of its products, belong to their respective owners. Haim Michael and LifeMichael are independent and not related, affiliated or connected neither with Google, TinyURL, Facebook or any of the companies and the technologies mentioned in this presentation. LifeMichael.com
  • 2. Table of Content LifeMichael.com ● Haim Michael Introduction ● Hybrid Applications Overview ● The WebView Class ● JavaScript Libraries ● JavaScript Calling Java ● Java Calling JavaScript ● Handling The Back Button ● Handling External Links ● Chrome DevTools Debugging ● Other Platforms ● PhoneGap Framework ● Simple Solutions ● Learning Resources ● Questions & Answers
  • 3. Haim Michael Introduction ● Snowboarding. Learning. Coding. Teaching. More than 18 years of Practical Experience. LifeMichael.com
  • 4. Haim Michael Introduction ● Professional Certifications Zend Certified Engineer in PHP Certified Java Professional Certified Java EE Web Component Developer OMG Certified UML Professional ● MBA (cum laude) from Tel-Aviv University Information Systems Management LifeMichael.com
  • 5. Hybrid Applications Overview ● The hybrid applications include code written in a native programming language and code written in various client side web technologies, such as HTML, CSS and JS. LifeMichael.com Device Display Web Browser Object
  • 6. The Android WebView Class ● Instantiating WebView class we have when developing for the android platform we will get an object that functions as a web browser. ● WebView extends View. We can treat the object as any other view. ● As of Android 4.4, WebView is based on the Chromium open source project. ● The other mobile platforms have a similar class. LifeMichael.com
  • 7. The Android WebView Class LifeMichael.com public class SimpleHybridDemo extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); WebView ob = new WebView(this); WebView.setWebContentsDebuggingEnabled(true); ob.getSettings().setJavaScriptEnabled(true); ob.loadUrl("file:///android_asset/demo.html"); setContentView(ob); } } MainActivity.java SimpleHybridDemo
  • 8. The Android WebView Class LifeMichael.com <form name="myform"> <br/>num 1: <input type="text" name="num_a"/> <br/>num 2: <input type="text" name="num_b"/> <br/><input type="button" onclick="calc()" value="+"/> <br/>result: <input type="text" name="result"/> </form> <script> function calc() { var a = parseInt(document.myform.num_a.value,10); var b = parseInt(document.myform.num_b.value,10); var sum = a+b; document.myform.result.value = sum; } </script> demo.html
  • 9. The Android WebView Class LifeMichael.com
  • 10. The Android WebView Class ● Calling the getSettings() method on our WebView object we will get a WebSettings object through which we can configure the behavior of our WebView. … WebView ob; … WebSettings settings = ob.getSettings(); settings.setJavaScriptEnabled(true); settings.setDatabaseEnabled(true); … LifeMichael.com
  • 11. JavaScript Libraries ● There are many JavaScript libraries optimized for touch screen devices we can use. LifeMichael.com
  • 12. JavaScript Libraries ● You can find samples for hybrid applications developed using SenchaTouch at http://dev.sencha.com/deploy/touch/examples/ ● You can find samples for hybrid applications developed using jQueryMobile at http://www.jqmgallery.com LifeMichael.com
  • 13. JavaScript Libraries ● When displaying content in our web view we better add the viewport meta element. <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> LifeMichael.com
  • 14. JavaScript Calling Java ● Calling the addJavaScriptInterface() method on the WebView object we can bind an object to the JavaScript execution code allowing code in JavaScript to call methods on that object. LifeMichael.com
  • 15. JavaScript Calling Java ● We should mark the methods defined in Java we want to allow their execution from code written in JavaScript with the @android.webkit.JavascriptInterface annotation. LifeMichael.com class CalculateObject { @android.webkit.JavascriptInterface public int calculateSum(int numA, int numB) { return numA + numB; } }
  • 16. JavaScript Calling Java LifeMichael.com public class HybridActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); WebView ob = new WebView(this); WebView.setWebContentsDebuggingEnabled(true); ob.getSettings().setJavaScriptEnabled(true); ob.addJavascriptInterface(new CalculateObject(),"ob"); ob.loadUrl( "http://www.abelski.com/courses/android/simple.html"); setContentView(ob); } class CalculateObject { @android.webkit.JavascriptInterface public int calculateSum(int numA, int numB) { return numA + numB; } } } HybridActivity
  • 17. JavaScript Calling Java LifeMichael.com <form name="myform"> <br/>number 1: <input type="text" name="num_a"/> <br/>number 2: <input type="text" name="num_b"/> <br/><input type="button" onclick="calc()" value="+"/> <br/>result: <input type="text" name="result"/> </form> <script> function calc() { var a = parseInt(document.myform.num_a.value,10); var b = parseInt(document.myform.num_b.value,10); var sum = window.ob.calculateSum(a,b); document.myform.result.value = sum; } </script> simple.html
  • 19. Java Calling JavaScript ● We can use the loadUrl method passing over a string that starts with “javascript:” in order to invoke a specific function in JavaScript. webView.loadUrl("javascript:increment()"); LifeMichael.com
  • 20. Java Calling JavaScript LifeMichael.com public class JavaCallingJavaScript extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); LinearLayout layout = new LinearLayout(this); final WebView webView = new WebView(this); webView.getSettings().setJavaScriptEnabled(true); webView.loadUrl("file:///android_asset/demo3.html"); Button bt = new Button(this); bt.setText("count"); bt.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { webView.loadUrl("javascript:increment()"); } }); layout.addView(bt); layout.addView(webView); setContentView(layout); } }
  • 21. Java Calling JavaScript LifeMichael.com <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <h3>Java Calling JavaScript</h3> <div id="msg">0</div> <script> function increment() { var ob = document.getElementById("msg"); ob.innerText = parseInt(ob.innerText)+1; } </script> </body> </html> demo.html
  • 23. Handling The Back Button LifeMichael.com ● When the user presses the device's back button he is taken to the previous activity. ● We can override this normal behavior by overriding the onBackPresses() function, that was defined in Activity. … public onBackPresses() { webView.loadUrl(…); }
  • 24. Handling External Links LifeMichael.com ● When the user presses a URL link displayed inside the web view the user will be forwarded to the web browser. ● We can set a different behavior by setting our own implementation for WebViewClient. ob.setWebViewClient(new WebViewClient() { public void shouldOverrideUrlLoading ( WebView view, String url) { view.loadUrl(… ); } });
  • 25. Handling External Links LifeMichael.com public class HandlingExternalLinks extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); String str = ""; str += "<br><a href="http://clock">get system time</a>"; str += "<br><a href="http://sdk">sdk version</a>"; str += "<br><a href="http://developer">developer name</a>"; WebView browser = (WebView) findViewById(R.id.webby); browser.getSettings().setJavaScriptEnabled(true); browser.setWebViewClient(new URLIntercepter()); browser.loadData(str, "text/html", "UTF-8"); } } HandlingExternalLinks.java
  • 26. Handling External Links LifeMichael.com HandlingExternalLinks.java public class URLIntercepter extends WebViewClient { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { if (url.contains("clock")) { String html = "<h2>" + new Date().toString() + "</h2>"; view.loadData(html, "text/html", "UTF-8"); return true; } else if(url.contains("sdk")) { String html = "<h2>The SDK version is " + Build.VERSION.SDK_INT + "</h2>"; view.loadData(html, "text/html", "UTF-8"); return true; }
  • 27. Handling External Links LifeMichael.com else if(url.contains("developer")) { String html = "<h2>Developer name is Haim Michael</h2>"; view.loadData(html, "text/html", "UTF-8"); return true; } else { return false; } } }
  • 28. Handling External Links LifeMichael.com <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <WebView android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/webby" android:layout_gravity="center_vertical"/> </LinearLayout> main.xml
  • 30. Chrome DevTools Debugging LifeMichael.com ● We can use the Chrome DevTools debugger for debugging the code in JavaScript running inside the WebView. ● We should call the setWebContentDebuggingEnabled static method (defined in WebView) passing over true in order to enable the debugging. WebView.setWebContentDebuggingEnabled(true); ● We should open Chrome web browser and browse at the following URL address: chrome://inspect/#devices
  • 33. Other Platforms LifeMichael.com Chrome OS Windows 8+ Electron electron.atom.io nwjs.ioelectron.atom.io nwjs.io qt.io qt.io
  • 34. The PhoneGap Framework ● The PhoneGap framework assists with the development of hybrid applications for mobile platforms.The PhoneGap framework includes two parts. The JavaScript library that includes the definition of functions that allow using the platform native capabilities. The native code developed specifically separately for each and every mobile platform. LifeMichael.com
  • 35. The PhoneGap Framework ● The implementation of the JavaScript library is different for each and every platform. It includes invocation of functions that belong to the native part. ● You can find detailed documentation for PhoneGap capabilities at http://docs.phonegap.com. ● The simplest way for using PhoneGap would be using the http://build.phonegap.com website. LifeMichael.com
  • 36. The PhoneGap Framework LifeMichael.com package org.apache.cordova.example; import android.app.Activity; import android.os.Bundle; import org.apache.cordova.*; public class cordovaExample extends DroidGap { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); super.loadUrl("file:///android_asset/www/index.html"); } }
  • 37. The PhoneGap Framework LifeMichael.com <!DOCTYPE html> <html> <head> ... <title>Hello World</title> </head> <body> <div class="app"> <h1>Apache Cordova</h1> ... </div> <script type="text/javascript" src="cordova-2.3.0.js"></script> <script type="text/javascript" src="js/index.js"></script> <script type="text/javascript"> app.initialize(); </script> </body> </html> index.html
  • 42. Learning Resources ● The Android Platform main learning resource is the http://developer.android.com website. ● You can find my free online course about software development in my website at http://abelski.lifemichael.com ● Short video clips in hebrew together with short tutorials in hebrew for learning Java can be found at http://www.javabook.co.il LifeMichael.com
  • 43. Learning Resources ● Short video clips in hebrew together with short tutorials in hebrew for learning PHP can be found at http://www.phpbook.co.il ● Short video clips in hebrew together with short tutorials in hebrew for learning Android development can be found at http://www.androidbook.co.il LifeMichael.com
  • 44. My Coming Courses Software Engineering in PHP7 http://tinyurl.com/lifemichaelphp Starts in July 2016
  • 45. My Coming Courses HTML5 Cross Platform Mobile Applications http://tinyurl.com/lifemichaelhtml5 Starts in July 2016
  • 46. My Coming Courses Applications Development for Android 7 http://tinyurl.com/lifemichaelandroid Starts in September 2016
  • 47. My Coming Courses 140 Academic Hours. 28 Weekly Meetings. Delivered in Holon Institute of Technology. On Going Project. Multiple Tiny Projects. All Meetings are Available on Video. Attractive Price of 6700 Shekels. tinyurl.com/lifemichaelhitcourses
  • 48. Questions & Answers If you enjoyed my seminar please leave me a comment at http://speakerpedia.com/speakers/life-michael. Thanks for your time! Haim.