mirror of
https://github.com/zoriya/react-native-svg.git
synced 2026-05-24 19:48:46 +00:00
@@ -23,10 +23,12 @@ class GExample extends Component{
|
||||
stroke="pink"
|
||||
strokeWidth="3"
|
||||
>
|
||||
<Circle
|
||||
cx="25"
|
||||
cy="25"
|
||||
/>
|
||||
<G>
|
||||
<Circle
|
||||
cx="25"
|
||||
cy="25"
|
||||
/>
|
||||
</G>
|
||||
<Circle
|
||||
cx="25"
|
||||
cy="75"
|
||||
|
||||
@@ -10,7 +10,8 @@ import Svg, {
|
||||
Ellipse,
|
||||
Circle,
|
||||
Text,
|
||||
Rect
|
||||
Rect,
|
||||
G
|
||||
} from 'react-native-svg';
|
||||
|
||||
class LinearGradientHorizontal extends Component{
|
||||
@@ -32,7 +33,7 @@ class LinearGradientHorizontal extends Component{
|
||||
}
|
||||
|
||||
class LinearGradientVertical extends Component{
|
||||
static title = 'Define an ellipse with a horizontal linear gradient from yellow to red';
|
||||
static title = 'Define an ellipse with a vertical linear gradient from yellow to red';
|
||||
render() {
|
||||
return <Svg
|
||||
height="150"
|
||||
@@ -44,7 +45,11 @@ class LinearGradientVertical extends Component{
|
||||
<Stop offset="100%" stopColor="red" stopOpacity="1" />
|
||||
</LinearGradient>
|
||||
</Defs>
|
||||
<Ellipse cx="150" cy="75" rx="85" ry="55" fill="url(#grad)" />
|
||||
<G>
|
||||
<G>
|
||||
<Ellipse cx="150" cy="75" rx="85" ry="55" fill="url(#grad)" />
|
||||
</G>
|
||||
</G>
|
||||
</Svg>;
|
||||
}
|
||||
}
|
||||
|
||||
+11
-3
@@ -10,6 +10,11 @@ import extractProps from '../lib/extract/extractProps';
|
||||
class G extends Component{
|
||||
static displayName = 'G';
|
||||
|
||||
static contextTypes = {
|
||||
svgId: numberProp,
|
||||
...contextProps
|
||||
};
|
||||
|
||||
static childContextTypes = {
|
||||
svgId: numberProp,
|
||||
isInGroup: PropTypes.bool,
|
||||
@@ -17,13 +22,16 @@ class G extends Component{
|
||||
};
|
||||
|
||||
getChildContext = () => {
|
||||
return _.reduce(contextProps, (props, value, key) => {
|
||||
props[key] = this.props[key];
|
||||
let context = _.reduce(contextProps, (props, value, key) => {
|
||||
if (!_.isNil(this.props[key])) {
|
||||
props[key] = this.props[key];
|
||||
}
|
||||
return props;
|
||||
}, {
|
||||
svgId: this.props.svgId,
|
||||
svgId: this.props.svgId || this.context.svgId,
|
||||
isInGroup: true
|
||||
});
|
||||
return _.defaults({}, this.context, context);
|
||||
};
|
||||
|
||||
render() {
|
||||
|
||||
Reference in New Issue
Block a user