Android: Ti 9.x/10.0.x

README.md

@@ -7,24 +7,53 @@ This module simply create a view from an svg file by exposing the androidsvg-1.2
 ## Quick Start
 
 ### Get it [![gitTio](http://gitt.io/badge.png)](http://gitt.io/component/com.geraudbourdin.svgview)
+
 Download the latest distribution ZIP-file and consult the [Titanium Documentation](http://docs.appcelerator.com/titanium/latest/#!/guide/Using_a_Module) on how install it, or simply use the [gitTio CLI](http://gitt.io/cli):
 
 `$ gittio install com.geraudbourdin.svgview`
 
 ## Usage :
 
 ```javascript
+var win = Ti.UI.createWindow({
+	backgroundColor: "#fff"
+});
+
 var svgView = require('com.geraudbourdin.svgview');
-var svg = svgView.createView({
-	image: "0.svg",
-	width: '350',
-	height: '350',
+var svg1 = svgView.createView({
+	image: "/test.svg",
+	width: 350,
+	height: 350,
 	top: 0,
-	left: 0,
-	backgroundColor:'pink'
+	left: 0
 });
 
-$.container.add(svg);
+if (OS_ANDROID) {
+    var svg2 = svgView.createView({
+    	image: '<svg width="30" height="30" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="ICON/c-select-gb" fill-rule="nonzero"><g id="united-kingdom"><circle id="Oval" fill="#f0f0f0" cx="15" cy="15" r="15"/><g id="Group" transform="translate(0.468750, 0.468750)" fill="#0052b4"><path d="M2.63203125 5.39894531C1.45376953 6.93193359.5653125 8.69882812.0479882813 10.6183008H7.85138672L2.63203125 5.39894531z" id="Shape"/><path d="M29.0145117 10.6183008C28.4971875 8.69888672 27.6086719 6.93199219 26.4304687 5.39900391L21.2112305 10.6183008H29.0145117z" id="Shape"/><path d="M.0479882813 18.444375C.565371094 20.3637891 1.45382812 22.1306836 2.63203125 23.6636133L7.85121094 18.444375H.0479882813z" id="Shape"/><path d="M23.6635547 2.63208984C22.1305664 1.45382812 20.3637305.565371094 18.4442578.0479882813V7.85132812l5.2192969-5.21923828z" id="Shape"/><path d="M5.39894531 26.4304102C6.93193359 27.6086719 8.69882813 28.4971289 10.6182422 29.0145117V21.2112305L5.39894531 26.4304102z" id="Shape"/><path d="M10.6181836.0479882813C8.69876953.565371094 6.931875 1.45382812 5.39894531 2.63203125L10.6181836 7.85126953V.0479882813z" id="Shape"/><path d="M18.4443164 29.0145117C20.3637305 28.4971289 22.130625 27.6086719 23.6635547 26.4304687L18.4443164 21.2112305V29.0145117z" id="Shape"/><path d="M21.2112305 18.444375 26.4304687 23.6636719C27.6086719 22.1307422 28.4971875 20.3637891 29.0145117 18.444375H21.2112305z" id="Shape"/></g><g id="Group" fill="#d80027"><path d="M29.8730273 13.0434961H16.9566211 16.9565625V.126972656C16.3160742.04359375 15.6631055.0 15 0 14.3367773.0 13.6839258.04359375 13.0434961.126972656V13.0433789 13.0434375H.126972656C.04359375 13.6839258.0 14.3368945.0 15 0 15.6632227.04359375 16.3160742.126972656 16.9565039H13.0433789 13.0434375V29.8730273C13.6839258 29.9564062 14.3367773 30 15 30 15.6631055 30 16.3160742 29.9564648 16.9565039 29.8730273V16.9566211 16.9565625H29.8730273C29.9564062 16.3160742 30 15.6632227 30 15 30 14.3368945 29.9564062 13.6839258 29.8730273 13.0434961z" id="Shape"/><path d="M18.9130664 18.9130664 25.606582 25.6066406C25.9144336 25.2989063 26.2081055 24.977168 26.4883008 24.6436523L20.7577148 18.9130664H18.9130664z" id="Shape"/><path d="M11.0869336 18.913125H11.0868164L4.39335938 25.606582C4.70109375 25.9144336 5.02283203 26.2081055 5.35634766 26.4883008L11.0869336 20.7575977V18.913125z" id="Shape"/><path d="M11.0869336 11.0870508V11.0869336L4.39341797 4.39335938C4.08556641 4.70109375 3.79189453 5.02283203 3.51169922 5.35634766L9.24234375 11.0869922 11.0869336 11.0870508z" id="Shape"/><path d="M18.9130664 11.0870508 25.6066406 4.39341797C25.2989063 4.08556641 24.977168 3.79189453 24.6436523 3.51175781L18.9130664 9.24240234V11.0870508z" id="Shape"/></g></g></g></g></svg>',
+    	width: 100,
+    	height: 100,
+    	top: 360,
+    	left: 0
+    });
+    win.add(svg2);
+
+    var img = Ti.UI.createImageView({
+    	width: 100,
+    	height: 100,
+    	top: 360,
+    	right: 0
+    });
+    var blob = svgView.toBlob("/test.svg");
+    img.image = blob;
+    win.add(img);
+
+		var blob2 = svgView.toBlob('<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="266.893px" height="266.895px" viewBox="0 0 266.893 266.895" enable-background="new 0 0 266.893 266.895" xml:space="preserve"><path id="Blue_1_" fill="#3C5A99" d="M248.082,262.307c7.854,0,14.223-6.369,14.223-14.225V18.812  c0-7.857-6.368-14.224-14.223-14.224H18.812c-7.857,0-14.224,6.367-14.224,14.224v229.27c0,7.855,6.366,14.225,14.224,14.225  H248.082z"/><path id="f" fill="#FFFFFF" d="M182.409,262.307v-99.803h33.499l5.016-38.895h-38.515V98.777c0-11.261,3.127-18.935,19.275-18.935  l20.596-0.009V45.045c-3.562-0.474-15.788-1.533-30.012-1.533c-29.695,0-50.025,18.126-50.025,51.413v28.684h-33.585v38.895h33.585  v99.803H182.409z"/></svg>');
+		console.log(blob2.width + " " + blob2.height);
+}
+
+win.add(svg1);
+win.open();
 ```
 
 You can change your file dynamically with the setImage(path) function.
@@ -34,7 +63,6 @@ var image = 'android.svg';
 svg.setImage(image);
 ```
 
-
 Or simply use it to set an image to a button :
 
 ```javascript
@@ -51,19 +79,23 @@ var svgImage = svg.toImage().media;
 $.buttonSvg.setImage(svgImage);
 ```
 
-## Building module
-Before importing to the Appcelerator Studio or/and building module you must
-create this files from corresponding examples and fill their contents to your
-environment paths:
+## Properties:
+
+-   image (String): URL of a file. Android supports inline SVGs too (has to start with `<`)
 
- * `android/build.properties`
- * `.classpath`
+## Methods:
 
- Copy/paste and remove `.example` from file name.
+-   toBlob (String, returns TiBlob): URL of a file/SVG string. Converts SVG to a blob (Android only).
 
+## Building module
+
+Go into `android/` or `ios/` and run:
 
+    ti build -p android --build-only
+    ti build -p ios --build-only
 
 ## License
+
 The MIT License (MIT)
 
 Copyright © 2015 Géraud Bourdin

android/build.gradle

@@ -0,0 +1,6 @@
+repositories {
+	mavenCentral()
+}
+dependencies {
+	implementation 'com.caverock:androidsvg-aar:1.4'
+}

android/manifest

@@ -2,9 +2,9 @@
 # this is your module manifest and used by Titanium
 # during compilation, packaging, distribution, etc.
 #
-version: 2.0.0
-apiversion: 3
-architectures: armeabi-v7a x86
+version: 3.0.1
+apiversion: 4
+architectures: arm64-v8a armeabi-v7a x86 x86_64
 description: svgview
 author: Géraud Bourdin
 license: MIT
@@ -15,4 +15,4 @@ name: svgview
 moduleid: com.geraudbourdin.svgview
 guid: d2065fa0-388f-4bf7-95b8-bd52fbdb6e74
 platform: android
-minsdk: 6.0.0.GA
+minsdk: 9.0.0

android/src/com/geraudbourdin/svgview/SvgViewModule.java

@@ -8,35 +8,82 @@
  */
 package com.geraudbourdin.svgview;
 
+import android.graphics.Bitmap;
+import android.graphics.Canvas;
+import android.graphics.drawable.PictureDrawable;
+
+import com.caverock.androidsvg.SVG;
+import com.caverock.androidsvg.SVGParseException;
+
 import org.appcelerator.kroll.KrollModule;
 import org.appcelerator.kroll.annotations.Kroll;
-
-import org.appcelerator.titanium.TiApplication;
+import org.appcelerator.kroll.common.Log;
 import org.appcelerator.kroll.common.TiConfig;
+import org.appcelerator.titanium.TiApplication;
+import org.appcelerator.titanium.TiBlob;
+import org.appcelerator.titanium.io.TiBaseFile;
+import org.appcelerator.titanium.io.TiFileFactory;
 
+import java.io.IOException;
+import java.io.InputStream;
 
-@Kroll.module(name="SvgView", id="com.geraudbourdin.svgview")
-public class SvgViewModule extends KrollModule
-{
+@Kroll.module(name = "SvgView", id = "com.geraudbourdin.svgview")
+public class SvgViewModule extends KrollModule {
 
-	// Standard Debugging variables
-	private static final String LCAT = "SvgViewModule";
-	private static final boolean DBG = TiConfig.LOGD;
+  // Standard Debugging variables
+  private static final String LCAT = "SvgViewModule";
+  private static final boolean DBG = TiConfig.LOGD;
 
-	// You can define constants with @Kroll.constant, for example:
-	// @Kroll.constant public static final String EXTERNAL_NAME = value;
+  // You can define constants with @Kroll.constant, for example:
+  // @Kroll.constant public static final String EXTERNAL_NAME = value;
 
-	public SvgViewModule()
-	{
-		super();
-	}
+  public SvgViewModule() { super(); }
 
-	@Kroll.onAppCreate
-	public static void onAppCreate(TiApplication app)
-	{
-		//Log.d(LCAT, "inside onAppCreate");
-		// put module init code that needs to run when the application is created
-	}
+  @Kroll.onAppCreate
+  public static void onAppCreate(TiApplication app) {
+    // Log.d(LCAT, "inside onAppCreate");
+    // put module init code that needs to run when the application is created
+  }
 
-}
+  @Kroll.method
+  public TiBlob toBlob(String image) {
+    InputStream contentFile = null;
+    SVG svgImage = null;
+
+    if (image.charAt(0) == '<') {
+      // Load string
+      try {
+        svgImage = SVG.getFromString(image);
+      } catch (SVGParseException e) {
+        Log.d(LCAT, "Failed to set svg from input stream.");
+      }
+    } else {
+      // Load file
+      String url = resolveUrl(null, image);
+      TiBaseFile file =
+              TiFileFactory.createTitaniumFile(new String[] {url}, false);
+      try {
+        contentFile = file.getInputStream();
+      } catch (IOException e) {
+        Log.d(LCAT, "Failed to get input stream.");
+      }
 
+      try {
+        svgImage = SVG.getFromInputStream(contentFile);
+      } catch (SVGParseException e) {
+        Log.d(LCAT, "Failed to set svg from input stream.");
+      }
+    }
+
+    if (svgImage != null && svgImage.getDocumentWidth() != -1) {
+        Bitmap  newBM = Bitmap.createBitmap((int) Math.ceil(svgImage.getDocumentWidth()),
+                (int) Math.ceil(svgImage.getDocumentHeight()),
+                Bitmap.Config.ARGB_8888);
+        Canvas bmcanvas = new Canvas(newBM);
+        svgImage.renderToCanvas(bmcanvas);
+        return TiBlob.blobFromImage(newBM);
+    } else {
+      return null;
+    }
+  }
+}