go fyne v2.4 ShowPopUp vs ShowModalPopUp not blocking interactions with underlying elements or covered with a semi-transparent overlay. in Win11

Question

I wish a modal that pops up ,that will not let users interact with the app until questions on the modal are answered. Usually the back ground is greyed out as what I am used to in C# forms.

I wrote the following code experimenting with ShowModalPopUp and ShowPopUp, where both produce pop up windows. But widget.ShowModalPopUp produces a normal pop up, not a modal one, that holds focus and greys the background. Google search = "modal popup form" to see what I am expecting.

package main

import (
    "image/color"

    "fyne.io/fyne/v2"
    "fyne.io/fyne/v2/app"
    "fyne.io/fyne/v2/canvas"
    "fyne.io/fyne/v2/container"
    "fyne.io/fyne/v2/widget"
)

func main() {
    a := app.New()
    w := a.NewWindow("Pop up demo")
    w.Resize(fyne.NewSize(600, 600))

    //-------------------------------
    //func ShowModalPopUp(content fyne.CanvasObject, canvas fyne.Canvas)
    //func ShowPopUp(content fyne.CanvasObject, canvas fyne.Canvas)
    //https://developer.fyne.io/api/v2.4/widget/

    hello := widget.NewLabel("Demo Fyne show popup vs show modal popup")
    w.SetContent(container.NewVBox(
        hello,
        widget.NewButton("pop demo!", func() {
            hello.SetText("Show me a popup")
            myWindowPop := a.NewWindow("CanvasPop")
            myCanvasPop := myWindowPop.Canvas()
            red := color.NRGBA{R: 180, G: 0, B: 0, A: 255}
            rectPop := canvas.NewRectangle(&red)
            rectPop.SetMinSize(fyne.NewSize(200, 200))
            myCanvasPop.SetContent(rectPop)
            widget.ShowPopUp(rectPop, myCanvasPop)         // show popup
            myWindowPop.Resize(fyne.NewSize(300, 300))
            myWindowPop.Show()

        }),
        widget.NewButton("Modal demo", func() {
            hello.SetText("show me a ModalPopup")
            myWindow := a.NewWindow("CanvasModal")
            myCanvas := myWindow.Canvas()
            blue := color.NRGBA{R: 0, G: 0, B: 180, A: 255}
            rect := canvas.NewRectangle(&blue)
            rect.SetMinSize(fyne.NewSize(200, 200))
            myCanvas.SetContent(rect)
            widget.ShowModalPopUp(rect, myCanvas)        // show modal popup
            myWindow.Resize(fyne.NewSize(300, 300))
            myWindow.Show()
        }),
    ))

    w.ShowAndRun()
}

Answer 1

Modal popups should work as you describe. You may be interested in the dialog package which provides standard modal dialogs. Either way if the modal show didn’t work then dialogs wouldn’t work?

I suspect the issue is that you’re creating new windows for the modals. But to be a modal it must be on the same window as the content you want it to cover.

Answer 2

After much a doo finally I have modal pop up working, also thanks Andy.xyz. I wish there was more small code examples in fyne documentation. I post my working solution here for anyone to comment on and or make improvements. With thanks.

Code has a main window and button that opens a modal with a close modal button.

 package main
    import (
        "image/color"
        "fyne.io/fyne/v2/app"
        "fyne.io/fyne/v2/canvas"
        "fyne.io/fyne/v2/container"
        "fyne.io/fyne/v2/widget"
    )
    func main() {
        // Create a new Fyne application
        a := app.New()
    
        // Create a new window with a title
        w := a.NewWindow("Pop up demo by DaHerb")
    
        // Create a label widget with a message
        hello := widget.NewLabel("Demo Fyne show popup vs show modal popup")
    
        // Create a button widget to trigger the pop-up
        showPopUpButton := widget.NewButton("Show Pop-up", nil)
    
        // Define content and canvas objects for the pop-up
        content := canvas.NewText("This is the content of the pop-up", 
        color.Black)
    
        // Declare a variable to hold the pop-up widget
        var popup *widget.PopUp
    
        // Define an action when the "Show Pop-up" button is tapped
        showPopUpButton.OnTapped = func() {
            // Create a container for the pop-up content, including a "Close" 
       button
            popUpContent := container.NewVBox(
                content,
                widget.NewButton("Close", func() {
                    popup.Hide() // Function to hide the pop-up
                }),
            )
    
            // Create a modal pop-up using the content and the main window's 
     canvas
            popup = widget.NewModalPopUp(popUpContent, w.Canvas())
    
            // Show the modal pop-up
            popup.Show()
        }
    
        // Set the main window's content to include the label and the Show-Pop- 
         up button
        w.SetContent(container.NewVBox(
            hello,
            showPopUpButton,
        ))
        // Show the main window and run the application
        w.ShowAndRun()
    }