All about - Canvas in action in Windows Store Apps.

1. Canvas in action in
Windows Store Apps
By
Nir mal Hot a

2. Nirmal Hota
http://twitter.com/nirmalhota
http://www.facebook.com/nirmal.hota.14
http://in.linkedin.com/in/nirmalhota
Blogs
http://mindfiremobile.wordpress.com
http://nirmalhota.blogspot.in/

3. Canvas in action in Windows Store Apps
Canvas capabilities
Canvas in action with WinJS
Ink data capture
Demo

4. Canvas Capabilities
Runtime script rendering
Renders 2D objects/Shapes
Renders bitmaps

5. Canvas in action with WinJS
Drawing line object
var canvas=document.getElementById("myCanvas");
var context=canvas.getContext("2d");
context.moveTo(0,0);
context.lineTo(200,100);
context.stroke();

6. Canvas in action with WinJS
Drawing circle object
var canvas=document.getElementById("myCanvas");
var context=canvas.getContext("2d");
context.beginPath();
context.arc(90,50, 20,0,2*Math.PI);
context.stroke();
var canvas=document.getElementById("myCanvas");
var context=canvas.getContext("2d");
context.beginPath();
context.arc(90,50, 20,0,2*Math.PI);
context.fill();

7. Canvas in action with WinJS
Drawing text object
var canvas=document.getElementById("myCanvas");
var context=canvas.getContext("2d");
context.font="30px Arial";
context.strokeText("Mindfire",10,50);
var canvas=document.getElementById("myCanvas");
var context=canvas.getContext("2d");
context.font="30px Arial";
context.fillText("Mindfire",10,50);

8. Canvas in action with WinJS
Drawing Image object
var canvas=document.getElementById("myCanvas");
var context=canvas.getContext("2d");
var img=document.getElementById("myImage");
context.drawImage(img,0,0);

9. Canvas in action with WinJS

10. Ink data capture : Small Intro
Uses Windows.UI.Input.Inking
Saves hand writing data
Recognizes the characters
Converts ink to text
Select-Copy-Paste flexibility
Changes writing the Ink color

11. Ink data capture : Small Intro

12. Questions & Answer Session

13. Certainly this seminar is just a small step
towards a big concept.
Let's keep exploring and we may come up
with more seminars in more details