Designing cross-platform GUI apps with Fyne

Adding a Widget

In Fyne, an app can be created by drawing basic types (called CanvasObjects) to a position within the window. These items are available in the package. However, you can use a collection of pre-made widgets ( that provides several interactive widgets for the standard user controls and visual items found in most apps.

You can create a new label widget to display the text "TODO App" by simply calling widget.NewLabel("TODO App"). Then use the SetContent method to place this widget inside the previously created window. The line of code now becomes:

w.SetContent(widget.NewLabel("TODO App"))

Finally, you must show the window. Because GUI toolkits also have an event loop that manages how the app runs and listens for user input, you also need to run the app. Conveniently, Fyne has a method that simultaneously shows the window and runs the application:


That is all there is to creating your first graphical app.

Running the App

To run the app, you can use go run, or you could build it using go build and then later run the executable that was created. However, because you have added a new library, you should run go mod tidy first to ensure the project metadata is up-to-date. After this, you can run the app with:

> go mod tidy
go: finding module for package
go: found in v2.3.4
> go run .

Telling the Go compiler to run "." means it runs all the files in the current directory (main.go for your app). Your app should now look something like Figure 1. Depending on your desktop settings, the app may appear with a light or a dark theme.

Figure 1: The app is shown here using a light theme, but a dark theme is also possible depending on your desktop settings.

Building the User Interface

Before you start building more complex content for your app, I need to explain Container types. Containers are what allow multiple elements to be arranged in an area, and they do so according to a layout. There are many standard containers for common types of positioning in Fyne. You can also add your own layout code. (I won't cover that in this article, but you can find out more online [2].)

These container types include VBox and HBox (for packing child items into vertical or horizontal boxes), Split (to allow users to drag a split bar separating two child items), or Stack (to allow multiple items to be drawn on top of each other). The most popular, and flexible, container is Border, which you will use twice in the to-do list app. The Border container takes four required fields for items to be positioned along the top, bottom, left, and right edges, and an optional fifth parameter for the content that should fill the remaining (central) space.

The app is split into two main areas: the top bar (where you will position the "New item" entry widget) and the to-do list area, which fills the main area. In essence, the app's entire layout is captured as:

container.NewBorder(head, nil, nil, nil, list)

The app uses a new package called container, which is from

To make the top bar, you will use another Border container, which will have an Entry widget for the user input (Listing 3) and a new Button widget using an icon for adding content, which is available in the standard theme. (I will add code to respond to user input later.)

Listing 3

Input Widgets

01 input := widget.NewEntry()
02 input.SetPlaceHolder("New item")
03 add := widget.NewButtonWithIcon("",
04   theme.ContentAddIcon(), func() {
05   log.Println("new item tapped")
06 })
07 head := container.NewBorder(nil, nil, nil, add, input)

Listing 3 defines the app's user interface except for the to-do list in main area.

Buy this article as PDF

Express-Checkout as PDF
Price $2.95
(incl. VAT)

Buy Linux Magazine

Get it on Google Play

US / Canada

Get it on Google Play

UK / Australia

Related content

  • Wheat and Chaff

    If you want to keep only the good photos from your digital collection, you have to find and delete the fails. Mike Schilli writes a graphical application with Go and the Fyne framework to help you cull your photo library.

  • Treasure Hunt

    A geolocation guessing game based on the popular Wordle evaluates a player's guesses based on the distance from and direction to the target location. Mike Schilli turns this concept into a desktop game in Go using the photos from his private collection.

  • Chip Shot

    We all know that the Fyne framework for Go can be used to create GUIs for the desktop, but you can also write games with it. Mike Schilli takes on a classic from the soccer field.

  • Straight to the Point

    With the Fyne framework, Go offers an easy-to-use graphical interface for all popular platforms. As a sample application, Mike uses an algorithm to draw arrows onto images.

  • Magic Cargo

    To be able to power up and shut down his NAS and check the current status without getting out of his chair, Mike Schilli programs a graphical interface that sends a Magic Packet in this month's column.

comments powered by Disqus
Subscribe to our Linux Newsletters
Find Linux and Open Source Jobs
Subscribe to our ADMIN Newsletters

Support Our Work

Linux Magazine content is made possible with support from readers like you. Please consider contributing when you’ve found an article to be beneficial.

Learn More