Hybrid application development with XamarinANURAJ P

@ANURAJ

WWW.DOTNETTHOUGHTS.NET

What is hybrid apps A hybrid app is one that is written with the same technology used for websites and mobile web implementations, and that is hosted or runs inside a native container on a mobile device. It is the marriage of web technology and native execution.

Hybrid apps implements an abstraction layer that exposes the device capabilities to JavaScript. Apache Cordova (formerly PhoneGap) is an example of a JavaScript abstraction layer over native APIs

Why hybrid apps Use the skills you know and have today - If you’re already an accomplished web developer, building a

hybrid app requires a short and easy-to-achieve learning curve, and there are no new languages to learn. Distribution through native app stores - Because hybrid apps use the native SDK to wrap the web app,

they can be distributed through the native app store, making discovery and distribution easier for users. Access to native APIs - The web-to-native abstraction layer provided by hybrid frameworks provides

JavaScript access native APIs and capabilities that are not available to mobile web apps. Runs locally on the device, and works when offline - Hybrid apps can package the required HTML, CSS

and JavaScript within the app that’s installed through the app store, which means they run locally on the device and do not depend on a network connection to function.

Uses a shared code base across multiple platforms - Using HTML, CSS and JavaScript to build a hybrid app makes it easy to share the majority of code between different platforms. While there may be some differences between the rendering, it is no different than having to support multiple browsers.

Fast development time - If you already have an existing web app, or code base that is built on the web platform, building a hybrid app is typically faster than writing an app using the native SDK, and because of the ability to share code between platforms, significant time is saved through code reuse.

Displaying HTML content in native apps

Hybrid apps use a web view control (UIWebView on iOS, WebView on Android and others) to present the HTML and JavaScript files in a full-screen format, using the native browser rendering engine (not the browser itself). WebKit is the browser rendering engine that is used on iOS, Android, Blackberry and others. That means that the HTML and JavaScript used to construct a hybrid app is rendered/processed by the WebKit rendering engine.

An HTML View can be a highly effective tool for displaying rich content in native applications.

With responsive design techniques (CSS 3 media queries) content can be made to seamlessly adapt to different screen sizes and orientations.

Razor templating engine can be used in native applications to generate HTML content that incorporates relevant data.

Razor templating engine.

Using Xamarin Studio, developers can use the Razor templating engine and C# to easily combine data with HTML, JavaScript and CSS without the hassle of manually building HTML strings in code.

Hybrid communications techniques

When an html page is loaded into a web view, it treats the links and forms as it would if the page was loaded from a server. This means that if the user clicks a link or submits a form the web view will attempt to navigate to the specified target.

Both iOS and Android provide a mechanism for application code to intercept these navigation events so that app code can respond (if required). This feature is crucial to building hybrid apps because it lets native code interact with the web view.

On Android simply subclass WebViewClient and then implement code to respond to the navigation request.public class RazorWebViewClient : WebViewClient{    public override bool ShouldOverrideUrlLoading (WebView view, string url)    {    }}

Questions?

Thank you