Since 1.1

Gradient

The last canvas primitive type is Gradient, available as canvas.LinearGradient and canvas.RadialGradient which is used to draw a gradient from one colour to another in various patterns. You can create gradients using NewHorizontalGradient(), NewVerticalGradient() or NewRadialGradient().

To create a gradient you need a start and end colour - every colour in between is calculated by the canvas. In this example we use color.Transparent to show how a gradient (or any other type) could use an alpha value to be semi-transparent over the content behind.

That’s it for our tour of the canvas elements in Fyne. Next take some time to learn about the Layouts available to arrange interface elements.

Copy Example

Example Code

            
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
package main

import (
	"fyne.io/fyne"
	"fyne.io/fyne/app"
	"fyne.io/fyne/canvas"
	"image/color"
)

func main() {
	myApp := app.New()
	w := myApp.NewWindow("Gradient")

	gradient := canvas.NewHorizontalGradient(color.White, color.Transparent)
	//gradient := canvas.NewRadialGradient(color.White, color.Transparent)
	w.SetContent(gradient)

	w.Resize(fyne.NewSize(100, 100))
	w.ShowAndRun()
}