updated

Author: bradmartin

demo/app/app.css

@@ -1,5 +1,5 @@
 .title {
-    font-size: 16;
+    font-size: 26;
     horizontal-align: center;
     margin: 20;
 }

demo/app/main-page.js

@@ -1,17 +1,38 @@
 var observable = require("data/observable").Observable;
 var app = require("application");
+var platformModule = require("platform");
 var color = require("color");
+var frame = require("ui/frame");
 
 var data = new observable({});
 
 function pageLoaded(args) {
-    var page = args.object;
+    var page = args.object; 
     page.bindingContext = data;
+    // Change statusbar color on Lollipop
+    if (platformModule.device.sdkVersion >= "21") {
+        var window = app.android.startActivity.getWindow(); 
+        window.setStatusBarColor(new color.Color("#0288D1").android);
+    }
 }
 exports.pageLoaded = pageLoaded;
 
+function padLoaded(args) {
+    console.log(args.object);
+    console.log('native pad: ' + args.object.android);
+}
+exports.padLoaded = padLoaded;
+
 
 function getDrawing(args) {
-    console.log(args.object);
+    var pad = frame.topmost().currentPage.getViewById("drawingPad");
+    var pic = pad.drawing;
+    console.log(pic);
+}
+exports.getDrawing = getDrawing;
+
+function clearDrawing(args) {
+    var pad = frame.topmost().currentPage.getViewById("drawingPad");
+    pad.clear();
 }
-exports.getDrawing = getDrawing;
+exports.clearDrawing = clearDrawing;

demo/app/main-page.xml

@@ -1,13 +1,24 @@
 <Page xmlns="http://schemas.nativescript.org/tns.xsd"
-      xmlns:SignaturePad="nativescript-signaturepad">
+      xmlns:SignaturePad="nativescript-signaturepad" loaded="pageLoaded">
+    <Page.actionBar>
+    <ActionBar title="NativeScript-SignaturePad" color="#fff" backgroundColor="#03A9F4" />
+  </Page.actionBar>
     <ScrollView>
-        <StackLayout>
-            <label text="&lt;SignaturePad:SignaturePad id='sketchPad' &gt;" class="title" textWrap="true" />
+        <StackLayout> 
 
-            <SignaturePad:SignaturePad id="drawingPad" penColor="#3489db" penWidth="5" />
-            <Button text="Get Drawing" />
-            
+            <label text="Example XML markup:" textWrap="true" class="title" />
+            <label backgroundColor="#333" color="#00ff00" 
+                   text="&lt;SignaturePad:SignaturePad id='drawingPad' height='180' penColor='#3489db' penWidth='5' /&gt;" 
+                   class="message" textWrap="true" />
+
+            <SignaturePad:SignaturePad
+                height="270"
+                id="drawingPad"     
+                penColor="#ff4081" 
+                penWidth="3" />   
 
+            <Button text="Get Drawing" tap="getDrawing" />
+            <!--<button text="Clear Drawing" tap="clearDrawing" />-->
         </StackLayout>
     </ScrollView>
 </Page>

demo/app/videos/big_buck_bunny.mp4

@@ -1,11 +1,11 @@
 {
 	"nativescript": {
 		"id": "org.nativescript.signaturepad",
-		"tns-android": {
-			"version": "1.5.1"
-		},
 		"tns-ios": {
 			"version": "1.5.2"
+		},
+		"tns-android": {
+			"version": "1.5.1"
 		}
 	},
 	"dependencies": {