[fix] support for Animated transform styles

Animated uses 'setNativeProps' to update styles. This mutates the DOM
without using React. But the code path was not adding 'px' units to
transform values and browsers were ignoring the style.

Fix #129
This commit is contained in:
Nicolas Gallagher
2016-07-06 17:10:27 -07:00
parent c44da41497
commit 9efa7e94bd
2 changed files with 6 additions and 3 deletions

View File

@@ -14,7 +14,7 @@ suite('apis/StyleSheet/processTransform', () => {
assert.deepEqual(
processTransform(style),
{ transform: 'scaleX(20) rotate(20deg)' }
{ transform: 'scaleX(20px) rotate(20deg)' }
)
})

View File

@@ -1,7 +1,10 @@
import normalizeValue from './normalizeValue'
// { scale: 2 } => 'scale(2)'
const mapTransform = (transform) => {
var key = Object.keys(transform)[0]
return `${key}(${transform[key]})`
const type = Object.keys(transform)[0]
const value = normalizeValue('transform', transform[type])
return `${type}(${value})`
}
// [1,2,3,4,5,6] => 'matrix3d(1,2,3,4,5,6)'