Forums

OverviewV-Play 2 Support (Qt 5) › [Apps] Custom back button behavior

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #12773

    Nathan

    Hi. I’ve got a Page in a NavigationStack, so VPlay creates a back button in the top left corner and (presumably, I haven’t tested this yet) handles Android’s back button to pop the stack and show the previous page. One of my pages has multiple frames, however, and I would like to have the back button in the top left and the Android back button switch to the previous frame if the first one is not already active, and otherwise use the normal behavior of popping the stack. I can easily handle deciding which behavior to apply, and implementing the frame switching behavior, but how can I customize the back button handling? I haven’t found anything that looks like what I’m looking for in the docs.

    What I want is something like this:

    Page {
        onBackPressed: {
            if (currentFrame === 0) navigationStack.pop() // or whatever the default behavior is
            else currentFrame--
        }
    }

    Ideally I would be able to pass the event to the standard handler somehow in the default case, but if that’s not possible I can just reproduce its behavior manually as well.

    #12774

    Günther
    V-Play Team

    Hi Nathan!

    Yes, the Android back button is automatically handled by some app components, which also includes popping pages from the NavigationStack.
    Unfortunately, we currently do not yet provide a way to overwrite the default behavior in a convenient way. For that we want to have a well-structured component that handles the back-button and decides which implementation has priority if multiple handlers are defined.

    This is already on our roadmap, and there will probably also be a way to define a custom handling within a Page as you suggested.

    The inofficial way to add a custom handler to a Page looks like that at the moment:

     

    import VPlayApps 1.0
    import QtQuick 2.5
    
    App {
    
      NavigationStack {
        backButtonEnabled: false // deactivate default behavior of navigation stack
    
        Page {
          title: "Custom BackButton"
    
          Text {
            id: textItem
            anchors.centerIn: parent
            text: "Press Back Button"
          }
    
          // handle back button
          Connections {
            target: getApplication()
            onBackButtonPressedGlobally: {
              event.accepted = true
    
              // do sth here
              textItem.text = "Back Pressed"
            }
          }
    
        }
      }
    
    }
    

     

    Note: As this is just a connection to the back button press, other components (e.g. a Navigation which opens the first tab on a back press) might steal the back event from the page. So it might be a good idea to just stick with the default behavior until we have a better solution ready. 😉

     

    Cheers,
    Günther

    • This reply was modified 2 years, 8 months ago by  GT.
Viewing 2 posts - 1 through 2 (of 2 total)

RSS feed for this thread

You must be logged in to reply to this topic.

Voted #1 for:

  • Easiest to learn
  • Most time saving
  • Best support

Develop Cross-Platform Apps and Games 50% Faster!

  • Voted the best supported, most time-saving and easiest to learn cross-platform development tool
  • Based on the Qt framework, with native performance and appearance on all platforms including iOS and Android
  • Offers a variety of plugins to monetize, analyze and engage users
FREE!
create apps
create games
cross platform
native performance
3rd party services
game network
multiplayer
level editor
easiest to learn
biggest time saving
best support