native touches to your hybrid mobile apps

20
Native Touches to your Hybrid Apps Lohith G N

Upload: lohith-gn

Post on 15-Jul-2015

123 views

Category:

Technology


6 download

TRANSCRIPT

Page 1: Native Touches to your Hybrid Mobile Apps

Native Touches to your Hybrid AppsLohith G N

Page 2: Native Touches to your Hybrid Mobile Apps

About Me

Technical Evangelist

Microsoft MVP (ASP.NET/IIS)

[email protected]

@kashyapa

http://www.kashyapas.com

http://www.telerikhelper.net

Lohith G N

http://www.telerik.com

Page 3: Native Touches to your Hybrid Mobile Apps

Agenda

• Hybrid Apps - Introduction

• Lap around Kendo UI Mobile

• Cordova Plugins for Native Features

• Demo

Page 4: Native Touches to your Hybrid Mobile Apps

Hybrid AppsWhat’s a Hybrid ?

Swiss Knife Image Courtesy: James Case

Page 5: Native Touches to your Hybrid Mobile Apps

Definition

Heterogeneous source

Written with technology used for websites & Mobile web implementations

Hosted/Runs in Native Container on device

Marriage of Web Technology + Native execution

Page 6: Native Touches to your Hybrid Mobile Apps

How ?

Web View Control (UIWebView - iOS, WebView - Android/Others)

Full Screen format - Native Browser rendering engine (WebKit)

Abstract layer, device capabilities as JS API (Apache Cordova)

Native wrapper compiled around HTML/CSS/JS – adds interop layer

Interop layer connects JS API with native API’s

Page 7: Native Touches to your Hybrid Mobile Apps

When ?

Target Multiple Mobile Platforms

Take advantage of device capabilities – GeoLocation, etc.

Offline usage

No need of advanced graphics performance

Page 8: Native Touches to your Hybrid Mobile Apps
Page 9: Native Touches to your Hybrid Mobile Apps

®

Page 10: Native Touches to your Hybrid Mobile Apps

Let's talk Mobile ...

Use Web skills to make Mobile Apps!

Page 11: Native Touches to your Hybrid Mobile Apps

Kendo UI MobileBuild Hybrid or Mobile Web apps

Completely Open Source & Free!

Bower install to any project

Has Angular Directives to render

Totally Cross-Platform

Page 12: Native Touches to your Hybrid Mobile Apps

Hybrid Mobile AppsKendo UI Mobile powered

Best with AppBuilder

Use Cordova Plugins for Native API

Respective App Store

presence

Page 13: Native Touches to your Hybrid Mobile Apps

Remember the UI WidgetsA complete application toolset for building hybrid and mobile web applications

ActionSheet

ButtonGroup

Drawer

Forms

ListView

MobileButton

ModalView

NavBar

PopOver

Scroller

ScrollView

SplitView

Switch

TabStrip

Page 14: Native Touches to your Hybrid Mobile Apps

Kendo UI MobileFlexibility for Developers

Plays well with others

Offline capabilities Flat Themes

OS Adaptive Rendering

Page 15: Native Touches to your Hybrid Mobile Apps

Something for everyone

Kendo UI CoreApplication Framework | Web | Mobile | Completely Free

Kendo UI ProfessionalEnterprise UI | Licensed per Developer | Support & Maintenance

Page 16: Native Touches to your Hybrid Mobile Apps

Native Touches

Page 17: Native Touches to your Hybrid Mobile Apps

Cordova Plugins

• Bridge between HTML & Native Layer

• Invoke Native things using Plugins

• Native Behaviors & Controls can be used in Hybrid Apps

Page 18: Native Touches to your Hybrid Mobile Apps

Plugins we will see today

• Notification

• ActionSheet

• Social Sharing

• Toast

Page 19: Native Touches to your Hybrid Mobile Apps

Demo