zoriya/react-native-svg
1
0
Fork 0
mirror of https://github.com/zoriya/react-native-svg.git synced 2026-06-03 23:16:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve coordinate system calculations for font-size, letter-spacing etc.

Browse Source 
Fix parsing of transform to account for single parameter scale and translate correctly.
Fix skewX, had opposite of intended effect.
https://www.w3.org/TR/SVG/coords.html
https://www.w3.org/TR/SVG2/coords.html
https://www.w3.org/TR/SVGTiny12/coords.html
https://www.w3.org/TR/SVG/coords.html#TransformAttribute
https://www.w3.org/TR/SVG/coords.html#SkewXDefined
This commit is contained in:
Mikael Sand
2017-06-27 20:45:04 +03:00
parent f7f1909249
commit c7039588f6
6 changed files with 65 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/extract/extractProps.js
+18 -1
View File
@@ -1,6 +1,6 @@
import extractFill from './extractFill';
import extractStroke from './extractStroke';
import extractTransform from './extractTransform';
import extractTransform, {props2transform, tp} from './extractTransform';
import extractClipPath from './extractClipPath';
import extractResponder from './extractResponder';
import extractOpacity from './extractOpacity';
@@ -26,6 +26,23 @@ export default function(props, ref) {
extractedProps.matrix = extractTransform(props);
Object.assign(extractedProps, props2transform(props));
let transform = props.transform;
if (transform) {
if (typeof transform === 'string') {
var transformParsed = tp.parse(transform);
if (transformParsed.matrix) {
// TODO: Extract scaling values for coordinate system
// Especially scaleY for calculating scaling of fontSize
} else {
let trans = props2transform(transformParsed);
if (typeof trans === 'object') {
Object.assign(extractedProps, trans);
}
}
}
}
Object.assign(extractedProps, extractResponder(props, ref));
return extractedProps;
lib/extract/extractTransform.js
+4 -4
View File
@@ -50,11 +50,11 @@ class TransformParser {
break;
case 'translate':
retval.translateX = transLst[i + 1];
retval.translateY = (i + 2 <= transLst.length) ? transLst[i + 2] : 0;
retval.translateY = (3 === transLst.length) ? transLst[i + 2] : 0;
break;
case 'scale':
retval.scaleX = transLst[i + 1];
retval.scaleY = (i + 2 <= transLst.length) ? transLst[i + 2] : retval.scaleX;
retval.scaleY = (3 === transLst.length) ? transLst[i + 2] : retval.scaleX;
break;
case 'rotate':
retval.rotation = transLst[i + 1];
@@ -85,7 +85,7 @@ class TransformParser {
}
}
const tp = new TransformParser();
export const tp = new TransformParser();
function appendTransform(transform) {
@@ -147,7 +147,7 @@ function universal2axis(universal, axisX, axisY, defaultValue) {
return [x || defaultValue || 0, y || defaultValue || 0];
}
function props2transform(props) {
export function props2transform(props) {
if (props && (typeof props === 'string')) {
return props;
}