Toolbar and menu

Adding menus and toolbars with the declarative API is very straightforward. The MainWindow struct has the Menu field (which is a slice of MenuItem) and the ToolBar field (which takes a ToolBar struct that contains an Items field for the MenuItem list). Each item in the list is either an Action, a Separator, or another Menu that mirrors the designs we created earlier.

Each Action in the declarative API expects a Text string that is used for the display in menus. Toolbars also use this content for tooltips, and for display if the style is set to ToolBarButtonTextOnly. An Image field allows you to set an icon for the toolbars if you want to reference installed images or icons distributed with your app. Most important is the OnTriggered field, which should be set to a func() that will be executed when the button or menu item is clicked.

The following code is used set up the menu on the MainWindow we created in the Layout section:

MenuItems: []MenuItem{
   Menu{
      Text: "File",
      Items: []MenuItem{
         Action{
            Text: "New",
         },
         Action{
            Text: "Reply",
         },
         Action{
            Text: "Reply All",
         },
         Separator{},
         Action{
            Text: "Delete",
         },
         Separator{},
         Action{
            Text: "Quit",
         },
      },
   },
   Menu{
      Text:  "Edit",
      Items: []MenuItem{
         Action{
            Text: "Cut",
         },
         Action{
            Text: "Copy",
         },
         Action{
            Text: "Paste",
         },
      },
   },
   Menu{
      Text: "Help",
   },
},

The code for the toolbar is almost identical and so the details have been omitted, but you can add it to the MainWindow using the ToolBar field, as follows:

ToolBar: ToolBar{
   Items: []MenuItem{
      Action{
         Text: "New",
      },

// full listing omitted but is available in the book's example code

   },
   ButtonStyle: ToolBarButtonTextOnly,
},

The result of the code added should be a window like that in the following screenshot:

Don't worry if the code for the new button didn't work for you—the completed application source code is available to download at https://github.com/PacktPublishing/Hands-On-GUI-Application-Development-in-Go. Before the user interface code is completed, we should add some code that will help us to navigate the app. The simplest is the quit item from the file menu. Just add the following code to the preceding Quit action:

OnTriggered: func() {
   walk.App().Exit(0)
},

The opening of our compose dialog is a little more complicated because a dialog needs to know which parent it's loading from. To do this, create a local variable, called window, of the *walk.MainWindow type and assign it to the MainWindow declarative API using the following line:

AssignTo:  &window,

This can then be referenced in your New action handler, where NewCompose is a function that creates the email compose window:

OnTriggered: func() {
   NewCompose().Run(window)
},

Finally, we should set up default behavior for the buttons on our compose dialog. To do this, we need to declare two *walk.PushButton variables that are assigned to the Cancel and Send buttons, respectively. By then passing these to the dialog definition using the CancelButton and DefaultButton fields, we get the appropriate behavior:

DefaultButton: &send,
CancelButton:  &cancel,

Now, let's set the cancel button to close the dialog—you will need to create a walk.Dialog variable to AssignTo the declarative API as with the main window. With these steps complete, either clicking the cancel button or pressing the Esc key should dismiss the compose window:

OnClicked: func() {
   dialog.Cancel()
},