Creates a linear gradient between 2 colors.
Properties
| Property | Default | Notes |
|---|---|---|
| x1 | 0 | |
| y1 | 0 | |
| x2 | 100 | |
| y2 | 0 | |
| color1 | 'black' | |
| color2 | 'white' | |
| cycle | false | |
| stretch | false | Scales the gradient to fit the Shape's bounds |
| fit | true | Scales the gradient retaining the aspect ratio |
Examples
4 rectangles, each one with a diagonal gradient
rect( x: 0, y: 0, width: 100, height: 100 ){
gradientPaint( x1: 0, y1: 0, x2: 50, y2: 50 )
}
rect( x: 100, y: 0, width: 100, height: 100 ){
gradientPaint( x1: 50, y1: 0, x2: 0, y2: 50 )
}
rect( x: 0, y: 100, width: 100, height: 100 ){
gradientPaint( x1: 0, y1: 50, x2: 50, y2: 0 )
}
rect( x: 100, y: 100, width: 100, height: 100 ){
gradientPaint( x1: 50, y1: 50, x2: 0, y2: 0 )
}
Different settings for fit, stretch and cycle
gradientPaint( id: 'g1', x1: 0, y1: 0, x2: 50, y2: 50 ) rect( x: 0, y: 0, width: 100, height: 100, fill: g1 ) circle( cx: 150, cy: 50, radius: 50, fill: g1 ) rect( x: 0, y: 100, width: 200, height: 100, fill: g1 )
 |
 |
 |
 |
