mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
11 lines
3.0 KiB
Markdown
11 lines
3.0 KiB
Markdown
---
|
|
id: version-0.49-transforms
|
|
original_id: transforms
|
|
title: transforms
|
|
---
|
|
<a id="content"></a><h1><a class="anchor" name="transforms"></a>Transforms <a class="hash-link" href="docs/transforms.html#transforms">#</a></h1><div><noscript></noscript><h3><a class="anchor" name="props"></a>Props <a class="hash-link" href="docs/transforms.html#props">#</a></h3><div class="props"><div class="prop"><h4 class="propTitle"><a class="anchor" name="decomposedmatrix"></a>decomposedMatrix?: <span class="propType">DecomposedMatrixPropType</span> <a class="hash-link" href="docs/transforms.html#decomposedmatrix">#</a></h4><div><p>Deprecated. Use the transform prop instead.</p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="transform"></a>transform?: <span class="propType"><span>[<span><span><span>{<span><span>perspective: number</span></span>}</span>, </span><span><span>{<span><span>rotate: string</span></span>}</span>, </span><span><span>{<span><span>rotateX: string</span></span>}</span>, </span><span><span>{<span><span>rotateY: string</span></span>}</span>, </span><span><span>{<span><span>rotateZ: string</span></span>}</span>, </span><span><span>{<span><span>scale: number</span></span>}</span>, </span><span><span>{<span><span>scaleX: number</span></span>}</span>, </span><span><span>{<span><span>scaleY: number</span></span>}</span>, </span><span><span>{<span><span>translateX: number</span></span>}</span>, </span><span><span>{<span><span>translateY: number</span></span>}</span>, </span><span><span>{<span><span>skewX: string</span></span>}</span>, </span><span>{<span><span>skewY: string</span></span>}</span></span>]</span></span> <a class="hash-link" href="docs/transforms.html#transform">#</a></h4><div><p><code>transform</code> accepts an array of transformation objects. Each object specifies
|
|
the property that will be transformed as the key, and the value to use in the
|
|
transformation. Objects should not be combined. Use a single key/value pair
|
|
per object.</p><p>The rotate transformations require a string so that the transform may be
|
|
expressed in degrees (deg) or radians (rad). For example:</p><p><code>transform([{ rotateX: '45deg' }, { rotateZ: '0.785398rad' }])</code></p><p>The skew transformations require a string so that the transform may be
|
|
expressed in degrees (deg). For example:</p><p><code>transform([{ skewX: '45deg' }])</code></p></div></div><div class="prop"><h4 class="propTitle"><a class="anchor" name="transformmatrix"></a>transformMatrix?: <span class="propType">TransformMatrixPropType</span> <a class="hash-link" href="docs/transforms.html#transformmatrix">#</a></h4><div><p>Deprecated. Use the transform prop instead.</p></div></div></div></div><p class="edit-page-block"><a target="_blank" href="https://github.com/facebook/react-native/blob/master/Libraries/StyleSheet/TransformPropTypes.js">Improve this page</a> by sending a pull request!</p><div class="docs-prevnext"><a class="docs-prev" href="docs/layout-props.html#content">← Prev</a><a class="docs-next" href="docs/shadow-props.html#content">Next →</a></div> |