Getting Started

• 1: Hello World
• 2: Increment

1 - Hello World

Create a new Go project

1. Navigate back to your home directory by running cd
2. Create a new directory called myapp by running mkdir myapp
3. Navigate to your newly created directory by running cd myapp
4. Create a new Go module by running go mod init myapp
5. Create a new Go file by running touch main.go
6. Open main.go using an editor of your choice

Make a simple app

1. Add the following code to your editor:

   package main
   
   import (
     "github.com/goki/gi/gi"
     "github.com/goki/gi/gimain"
   )
   
   func main() {
     // Run the window event loop function as the main function
     gimain.Main(func() {
       mainrun()
     })
   }
   
   func mainrun() {
     // Create a window called My App Window with width 512 and height 384
     win := gi.NewMainWindow("myapp", "My App Window", 512, 384)
     // Get the viewport within the window
     vp := win.WinViewport2D()
     // Start a protect update on the viewport
     updt := vp.UpdateStart()
     // Create a standard frame within the window and make it the main widget
     mfr := win.SetMainFrame()
   
     // Add a label to the main frame with the text "Hello, World!"
     label := gi.AddNewLabel(mfr, "label", "Hello, World!")
     // Make the font size of the label large
     label.SetProp("font-size", "large")
   
     // End the protected update on the viewport without a signal.
     // Update signals cause things to be redrawn, which is unnecessary at the start
     // because it is already drawing everything new.
     vp.UpdateEndNoSig(updt)
     // Start the event loop that keeps the window rendering.
     // This is a blocking call, and it will not return until
     // the user quits the app or gi.Quit() is called
     win.StartEventLoop()
   }
   

2. Update your dependencies by running go mod tidy

3. Build the code by running go build

4. Run the app by running ./myapp if you are on MacOS or Linux and ./myapp.exe if you are on Windows. This should create a window with text that says “Hello, World,” similar to the screenshot below:

2 - Increment

In the last section, you built a simple app that says, “Hello, World!” In this section, you will add to that app by creating a button that increments a label. To do that, you need to add the following code after the “Hello, World!” label:

	// Add a new label to the main frame with the text "0"
	// This label will track the number of times the button has been clicked
	numLabel := gi.AddNewLabel(mfr, "numLabel", "0")
	// Make the label redrawable so that it can be updated when the
	// number of times the button has been clicked changes
	numLabel.Redrawable = true
	// Add a new button to the main frame
	button := gi.AddNewButton(mfr, "button")
	// Set the text of the button to "Increment"
	button.Text = "Increment"
	// Keep track of the number of times that the button has been clicked
	numClicked := 0
	// The OnClicked function is called every time the button is clicked
	button.OnClicked(func() {
		// In it, we increment the number of times the button has been clicked
		numClicked++
		// Then, we set the text of the number label to the number of the times
		// the button has been clicked. strconv.Itoa converts integers to strings.
		numLabel.SetText(strconv.Itoa(numClicked))
	})

Then, run go build and ./myapp if you are on MacOS or Linux and ./myapp.exe if you are on Windows. This should create a window similar to the last one, except with a new label and button. Each time you click the Increment button, the number in the new label should increase by 1. If you click the button 7 times, the app should look like this: