mirror of
https://github.com/status-im/react-native-linear-gradient.git
synced 2025-02-10 06:43:30 +00:00
Refactor LinearGradient as functional component
This commit is contained in:
parent
b780d9df2e
commit
366239e441
@ -1,17 +1,15 @@
|
||||
import React, { PropTypes } from 'react';
|
||||
import { processColor, requireNativeComponent, StyleSheet, View } from 'react-native';
|
||||
|
||||
var LinearGradient = React.createClass({
|
||||
propTypes: {
|
||||
start: PropTypes.arrayOf(PropTypes.number),
|
||||
end: PropTypes.arrayOf(PropTypes.number),
|
||||
colors: PropTypes.arrayOf(PropTypes.string).isRequired,
|
||||
locations: PropTypes.arrayOf(PropTypes.number),
|
||||
...View.propTypes,
|
||||
},
|
||||
|
||||
render: function() {
|
||||
var { style, children, colors, locations, start, end, ...otherProps } = this.props;
|
||||
export default function LinearGradient({
|
||||
children,
|
||||
colors,
|
||||
end,
|
||||
locations,
|
||||
start,
|
||||
style,
|
||||
...otherProps
|
||||
}) {
|
||||
|
||||
if ((colors && locations) && (colors.length !== locations.length)) {
|
||||
console.warn('LinearGradient colors and locations props should be arrays of the same length');
|
||||
@ -19,12 +17,12 @@ var LinearGradient = React.createClass({
|
||||
|
||||
// inherit container borderRadius until this issue is resolved:
|
||||
// https://github.com/facebook/react-native/issues/3198
|
||||
var flatStyle = StyleSheet.flatten(style) || {};
|
||||
var borderRadius = flatStyle.borderRadius || 0;
|
||||
const flatStyle = StyleSheet.flatten(style) || {};
|
||||
const borderRadius = flatStyle.borderRadius || 0;
|
||||
|
||||
// this is the format taken by:
|
||||
// http://developer.android.com/reference/android/graphics/Path.html#addRoundRect(android.graphics.RectF, float[], android.graphics.Path.Direction)
|
||||
var borderRadiiPerCorner = [
|
||||
const borderRadiiPerCorner = [
|
||||
flatStyle.borderTopLeftRadius || borderRadius,
|
||||
flatStyle.borderTopLeftRadius || borderRadius,
|
||||
flatStyle.borderTopRightRadius || borderRadius,
|
||||
@ -48,9 +46,14 @@ var LinearGradient = React.createClass({
|
||||
{ children }
|
||||
</View>
|
||||
);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
var NativeLinearGradient = requireNativeComponent('BVLinearGradient', null);
|
||||
LinearGradient.propTypes = {
|
||||
start: PropTypes.arrayOf(PropTypes.number),
|
||||
end: PropTypes.arrayOf(PropTypes.number),
|
||||
colors: PropTypes.arrayOf(PropTypes.string).isRequired,
|
||||
locations: PropTypes.arrayOf(PropTypes.number),
|
||||
...View.propTypes,
|
||||
};
|
||||
|
||||
module.exports = LinearGradient;
|
||||
const NativeLinearGradient = requireNativeComponent('BVLinearGradient', null);
|
||||
|
31
index.ios.js
31
index.ios.js
@ -2,22 +2,14 @@
|
||||
* @providesModule LinearGradient
|
||||
* @flow
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
import React, { PropTypes } from 'react';
|
||||
import { processColor, requireNativeComponent, View } from 'react-native';
|
||||
|
||||
var LinearGradient = React.createClass({
|
||||
propTypes: {
|
||||
start: PropTypes.arrayOf(PropTypes.number),
|
||||
end: PropTypes.arrayOf(PropTypes.number),
|
||||
colors: PropTypes.arrayOf(PropTypes.string).isRequired,
|
||||
locations: PropTypes.arrayOf(PropTypes.number),
|
||||
...View.propTypes,
|
||||
},
|
||||
|
||||
render: function() {
|
||||
var { colors, locations, ...otherProps } = this.props;
|
||||
export default function LinearGradient({
|
||||
colors,
|
||||
locations,
|
||||
...otherProps
|
||||
}) {
|
||||
|
||||
if ((colors && locations) && (colors.length !== locations.length)) {
|
||||
console.warn('LinearGradient colors and locations props should be arrays of the same length');
|
||||
@ -30,9 +22,14 @@ var LinearGradient = React.createClass({
|
||||
locations={locations ? locations.slice(0, colors.length) : null}
|
||||
/>
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var NativeLinearGradient = requireNativeComponent('BVLinearGradient', null);
|
||||
LinearGradient.propTypes = {
|
||||
start: PropTypes.arrayOf(PropTypes.number),
|
||||
end: PropTypes.arrayOf(PropTypes.number),
|
||||
colors: PropTypes.arrayOf(PropTypes.string).isRequired,
|
||||
locations: PropTypes.arrayOf(PropTypes.number),
|
||||
...View.propTypes,
|
||||
};
|
||||
|
||||
module.exports = LinearGradient;
|
||||
const NativeLinearGradient = requireNativeComponent('BVLinearGradient', null);
|
||||
|
Loading…
x
Reference in New Issue
Block a user