Hybrid app

  • 1,386 views
Uploaded on

아꿈사 HTML5 스

아꿈사 HTML5 스

More in: Technology , Design
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
1,386
On Slideshare
0
From Embeds
0
Number of Embeds
9

Actions

Shares
Downloads
0
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Hybrid App 아키텍트를 꿈꾸는 사람들 cafe.naver.com/architect1 현수명 soomong.net #soomong
  • 2. Native App Hybrid App Web App
  • 3. Native App Platform API 사용가능 - 막강함 - 지식 필요 Cross-Platform Porting - 새로 개발이나 마찬가지
  • 4. Platform API 사용 불가능Cross-Platform Porting - 원래 가능 - HTML + CSS + JavaScript Web App
  • 5. Platform API 사용가능 Hybrid App Cross-Platform Porting
  • 6. HTML5 + CSS + JavaScript Cross-Platform Porting
  • 7. Platform API 사용가능 - PhoneGap - Appcelerator Titanium - Appspresso
  • 8. public class WebViewDemo extends Activity { @Override public void onCreate(Bundle icicle) { super.onCreate(icicle); setContentView(R.layout.main); mWebView = (WebView) findViewById(R.id.webview); mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo"); mWebView.loadUrl("file:///android_asset/demo.html"); } final class DemoJavaScriptInterface { public String clickOnAndroid() { return "Hello Web App World"; } }} Web App
  • 9. <html> <head> <script language="javascript"> function wave() { document.getElementById("hello").innerHTML= demo.clickOnAndroid(); } </script> </head> <body> <b id="hello"> Hello </b><br> <a onClick="window.demo.clickOnAndroid()“> Click me! </a> </body></html> Web App
  • 10. public class App extend DroidGap { public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); super.loadUrl("file:///android/asset/www/index.html"); }}<!DOCTYPE HTML><html><head><title>PhoneGap</title><script type="text/javascript" charset="utf-8" src="phonegap.js"></script></head><body><h1>Hello World</h1></body></html> Hybrid App
  • 11. Web UI -> Touch UI- JQuery Mobile- JQTouch- Sencha Touch
  • 12. 감사합니다