mirror of
https://github.com/zhigang1992/react-native.git
synced 2026-02-06 22:44:22 +08:00
ac5b7548d2
Summary: Decouple processStyle from the main reconciliation. It is now a process extension to the style attribute `transform`. This effectively decouples a large portion of special cases and helper dependencies from the reconciler. The transform attribute becomes translated into the transformMatrix attribute on the native side so this becomes a little weird in that I have to special case it. I don't think it is worth while having a general solution for this so I intend to rename the native attribute to `transform` and just have it accept the resolved transform. Then I can remove the special cases. The next step is generalizing the flattenStyle function and optimizing it. @public Reviewed By: @vjeux Differential Revision: D2460465 fb-gh-sync-id: 243e7fd77d282b401bc2c028aec8d57f24522a8e
51 lines
1.9 KiB
JavaScript
51 lines
1.9 KiB
JavaScript
/**
|
|
* Copyright (c) 2015-present, Facebook, Inc.
|
|
* All rights reserved.
|
|
*
|
|
* This source code is licensed under the BSD-style license found in the
|
|
* LICENSE file in the root directory of this source tree. An additional grant
|
|
* of patent rights can be found in the PATENTS file in the same directory.
|
|
*
|
|
* @providesModule ReactNativeStyleAttributes
|
|
* @flow
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
var ImageStylePropTypes = require('ImageStylePropTypes');
|
|
var TextStylePropTypes = require('TextStylePropTypes');
|
|
var ViewStylePropTypes = require('ViewStylePropTypes');
|
|
|
|
var keyMirror = require('keyMirror');
|
|
var matricesDiffer = require('matricesDiffer');
|
|
var processColor = require('processColor');
|
|
var processTransform = require('processTransform');
|
|
var sizesDiffer = require('sizesDiffer');
|
|
|
|
var ReactNativeStyleAttributes = {
|
|
...keyMirror(ViewStylePropTypes),
|
|
...keyMirror(TextStylePropTypes),
|
|
...keyMirror(ImageStylePropTypes),
|
|
};
|
|
|
|
ReactNativeStyleAttributes.transform = { process: processTransform };
|
|
ReactNativeStyleAttributes.transformMatrix = { diff: matricesDiffer };
|
|
ReactNativeStyleAttributes.shadowOffset = { diff: sizesDiffer };
|
|
|
|
// Do not rely on this attribute.
|
|
ReactNativeStyleAttributes.decomposedMatrix = 'decomposedMatrix';
|
|
|
|
var colorAttributes = { process: processColor };
|
|
ReactNativeStyleAttributes.backgroundColor = colorAttributes;
|
|
ReactNativeStyleAttributes.borderBottomColor = colorAttributes;
|
|
ReactNativeStyleAttributes.borderColor = colorAttributes;
|
|
ReactNativeStyleAttributes.borderLeftColor = colorAttributes;
|
|
ReactNativeStyleAttributes.borderRightColor = colorAttributes;
|
|
ReactNativeStyleAttributes.borderTopColor = colorAttributes;
|
|
ReactNativeStyleAttributes.color = colorAttributes;
|
|
ReactNativeStyleAttributes.shadowColor = colorAttributes;
|
|
ReactNativeStyleAttributes.textDecorationColor = colorAttributes;
|
|
ReactNativeStyleAttributes.tintColor = colorAttributes;
|
|
|
|
module.exports = ReactNativeStyleAttributes;
|