Scaling SVG
Hi,
I'm trying to to scale a vector graphic in SVG format and display it in a table row. I can scale the SVG by using a WebView, but fail to display it properly. Here's what I do:
// create row...
var row = Ti.UI.createTableViewRow();
row.height = 75;
// scale SVG using WebView... works...
var scale = Ti.UI.create2DMatrix().scale(0.2);
var p = Ti.UI.createWebView({ url:'./images/test.svg', size:{ width:50, height:50 }, transform:scale });
// doesn't display anything where the image should appear in the row...
var photo = Ti.UI.createImageView({
image:p.toImage(),
top:5, left:10
});
row.add(photo);
You might say I can drop the call to createImageView
entirely, and instead add top
and left
to the WebView, but then the image does appear close to the center of the corresponding row, not on the left. Here's what I mean:
// same as above...
var p = Ti.UI.createWebView({ url:'./images/test.svg', size:{ width:50, height:50 }, transform:scale, top:5, left:10});
row.add(p);
Any help appreciated.
-tom
1 Answer
-
The Webview takes some time to load the HTML.
Adding a timeout before calling toImage solved it (~10000 ms)..