To start our compose window layout, we create a new drawComposeLayout() function that (for testing) we can call instead of drawLayout() from the draw() function. Before we can add the text edit widgets that the email compose UI will use, we need to create buffers to manage the content they'll edit. Remember that this is an immediate mode toolkit so, to remember any state, we must provide the data storage. This is where the compose window will store the subject, email address, and content for a new email message:

var composeSubject = make([]byte, 512, 512)
var composeEmail = make([]byte, 512, 512)
var composeContent = make([]byte, 4096, 4096)

It's also helpful to our user to provide a hint (often called a placeholder) for the user—to do this, we need to copy some data into the buffers before the draw loop begins:

copy(composeSubject[:], "subject")
copy(composeEmail[:], "email")
copy(composeContent[:], "content")

Now let's look at the layout for the email compose window. The layout is similar to the content of our email display group in the previous layout code, setting up a dynamic row for the subject widget followed by a row template for the To label and email address entry. Instead of NkLabel(), this time we're creating a text entry widget using NkEditStringZeroTerminated() with a number of parameters. The nk.EditBox|nk.EditSelectable|nk.EditClipboard flags tell Nuklear that we're setting up an edit box where the text can be selected and interact with the system clipboard. We also need to tell the widget which buffer it should edit (in this case composeSubject) and what the maximum number of characters should be (which we set to the length of the buffer int32(len(composeSubject))). This is then repeated for the email and content input widgets:

func drawComposeLayout(ctx *nk.Context, height int) {
   nk.NkLayoutRowDynamic(ctx,0, 1)
   nk.NkEditStringZeroTerminated(ctx, nk.EditBox|nk.EditSelectable|nk.EditClipboard,
      composeSubject, int32(len(composeSubject)), nil)
   nk.NkLayoutRowTemplateBegin(ctx, 0)
   nk.NkLayoutRowTemplatePushStatic(ctx, 25)
   nk.NkLayoutRowTemplatePushVariable(ctx, 320)
   nk.NkLayoutRowTemplateEnd(ctx)
   nk.NkLabel(ctx, "To", nk.TextAlignRight)
   nk.NkEditStringZeroTerminated(ctx, nk.EditBox|nk.EditSelectable|nk.EditClipboard,
      composeEmail, int32(len(composeEmail)), nil)
   nk.NkLayoutRowDynamic(ctx, float32(height-114), 1)
   nk.NkEditStringZeroTerminated(ctx, nk.EditBox|nk.EditSelectable|nk.EditClipboard,
      composeContent, int32(len(composeContent)), nil)

   ...

Lastly, we need to add the buttons to the bottom of the screen—we use another row template for this. The variable space in this layout is set to be the size of the row, minus the size of our buttons, so that the buttons will align to the right. We insert an empty NkLabel in the first cell to work as a spacer. The two NkButtonLabel() function calls set up the buttons at the bottom-right of the layout:

   ...

   nk.NkLayoutRowTemplateBegin(ctx, 0)
   nk.NkLayoutRowTemplatePushVariable(ctx, 234)
   nk.NkLayoutRowTemplatePushStatic(ctx, 64)
   nk.NkLayoutRowTemplatePushStatic(ctx, 64)
   nk.NkLayoutRowTemplateEnd(ctx)
   nk.NkLabel(ctx, "", nk.TextAlignLeft)
   nk.NkButtonLabel(ctx, "Cancel")
   nk.NkButtonLabel(ctx, "Send")
}

With that layout code created, we can show the window and see an email Compose window like the following screenshot: