zoriya/react-native-svg
1
0
Fork 0
mirror of https://github.com/zoriya/react-native-svg.git synced 2025-12-19 21:45:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor LinearGradient and RadialGradient

Browse Source 
refactor LinearGradient and RadialGradient
and add fillOpacity support for LinearGradient and RadialGradient
This commit is contained in:
Horcrux
2016-01-28 18:12:59 +08:00
parent bda7b1fa5c
commit 3c56ad3dd7
7 changed files with 149 additions and 114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
Example/examples/Gradients.js
View File

@@ -146,6 +146,32 @@ class RadialGradientPercent extends Component{
}
}
class FillGradientWithOpacity extends Component{
static title = 'Fill a radial gradient with fillOpacity prop';
render() {
return <Svg
height="150"
width="300"
>
<Defs>
<RadialGradient id="grad" cx="50%" cy="50%" rx="50%" ry="50%" fx="50%" fy="50%">
<Stop
offset="0%"
stopColor="#fff"
stopOpacity="1"
/>
<Stop
offset="100%"
stopColor="#00f"
stopOpacity="1"
/>
</RadialGradient>
</Defs>
<Ellipse cx="150" cy="75" rx="85" ry="55" fill="url(#grad)" fillOpacity="0.2" />
</Svg>;
}
}
const icon = <Svg
height="20"
width="20"
@@ -160,7 +186,7 @@ const icon = <Svg
</Svg>;
const samples = [LinearGradientHorizontal, LinearGradientVertical, LinearGradientPercent, RadialGradientExample, RadialGradientPercent, RadialGradientPart];
const samples = [LinearGradientHorizontal, LinearGradientVertical, LinearGradientPercent, RadialGradientExample, RadialGradientPercent, RadialGradientPart, FillGradientWithOpacity];
export {
icon,