Developing advanced universal apps using html & js
-
Upload
senthamil-selvan -
Category
Technology
-
view
336 -
download
2
description
Transcript of Developing advanced universal apps using html & js
Developing Advanced Universal Apps Using HTML and JSCOMMUNITY CAMP, 17-21 NOV 2014
AgendaAbout Me
Introduction to Universal Apps◦ What is Universal App?
◦ Web App Vs Native App
Universal App Template◦ Project Structure
◦ Shared Project
◦ Demo
Background Tasks◦ Create Task
◦ Consume Task
Senthamil SelvanMicrosoft MVP (Windows Consumer Apps)
Working as Solution Architect at Xchanging Pte Ltd
Blog: http://altfo.wordpress.com
FB: www.facebook.com/altfo
My Page: https://www.facebook.com/pages/Math-Formulas-App/546631962132092
WPUG: https://www.facebook.com/groups/apolloexplorer/
Animal Taxonomy IUPAC Math Formulas Ultimate Player SG Parking SG Things To Do Mani Samayal Ultimate Cryptex SEASPC
Introduction to Universal AppsYou can build an app that targets to Windows and Windows Phone◦ Single Logic code sharing
◦ Share Images and Data
◦ Target multiple devices
◦ Common experience
◦ Shared authentication
◦ Shared data/profile
◦ Single app purchase
◦ Single IAP purchase
Web app versus native app
WEB APP NATIVE APP
DATA
LOGIC
UI
Universal App Project TemplateWindows Project Template
Windows Phone Project Template
Project StructureDEMO
Background TasksWhat is Background Task?
◦ Run the code even when the App is not running.◦ Schedule certain activities to be performed.
Features Available◦ Push Notifications◦ Audio Playback◦ File Transfer API◦ Share Contracts
Scenarios for Background task◦ Download Mail◦ Toast Notification◦ Update Service
Not applicable◦ Heavy downloads◦ User interaction like login / click button required…
How to Create Task◦ Create js Worker file
◦ Implement Task Behaviors
◦ Register
◦ Declare it in Manifest
task.js// this file runs in context of WorkerGlobalScope(function () {
// importScripts is method of WorkerGlobalScopeimportScripts( “//Microsoft.WinJS.1.0/js/base.js”,
“/js/app.js” );
// do work here, possibly using code from /js/app.js
// close is a method of WorkerGlobalScopeclose();
})();
WebUIBackgroundTaskInstance(function () {
// imports
// access background task via current property var currentTask = WebUIBackgroundTaskInstance.current;// instanceId, progress, succeeded // getDeferral for async calls within task// canceled event handler
// close})();
BackgroundTaskBuilder// create “namespace”var back = Windows.ApplicationModel.Background;
// create instance of BackgroundTaskBuildervar builder = back.BackgroundTaskBuilder();builder.name = “task name”;builder.taskEntryPoint = “js\\task.js”;builder.setTrigger(new back.TimeTrigger(15, false));
// register the taskbuilder.register();
package.appxmanifest - Declarations
Consume TasksHow Tasks Triggered
Conditional Tasks
Lock Screen Scenario
TasksDEMO