Handling game state running inside a webview fragment

Question

I'm using single activity architecture and have 3 fragments (Fragment A, Fragment B and Fragment C). Click on button in Fragment A takes to Fragment B and click on button in Fragment B takes to Fragment C (which is a webview, a game is running inside this) Now I want to go back to Fragment B and want the game to be paused and again when I come back to Fragment C from B, I want the Game to be in paused state

I'm using navigation component to navigate between the fragments.

When I use navigateUp() while going back from C to B, It destroys the fragment C and recreates it when navigating to C from B and the game starts fresh again.

Any suggestions how to handle this scenario using navigation component ?

Answer 1

You can achieve this by using ViewModel and onSaveInstanceState() to save and restore the state of your WebView and the game inside it.

1. Create a ViewModel that will hold the reference to your WebView:

class WebViewViewModel : ViewModel() {
    var webView: WebView? = null
}

2. In your Fragment C, get a reference to the ViewModel and set the WebView:

private lateinit var webViewViewModel: WebViewViewModel

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)

    webViewViewModel = ViewModelProvider(requireActivity()).get(WebViewViewModel::class.java)

    if (webViewViewModel.webView == null) {
        webViewViewModel.webView = WebView(requireContext()).apply {
            // Initialize and load the game URL here
        }
    }

    // Add the WebView to your layout
    fragment_c_layout.addView(webViewViewModel.webView)
}

3. Override onSaveInstanceState() in Fragment C to save the WebView state:

override fun onSaveInstanceState(outState: Bundle) {
    super.onSaveInstanceState(outState)
    webViewViewModel.webView?.saveState(outState)
}

4. Restore the WebView state when returning to Fragment C:

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)

    webViewViewModel = ViewModelProvider(requireActivity()).get(WebViewViewModel::class.java)

    if (webViewViewModel.webView == null) {
        webViewViewModel.webView = WebView(requireContext()).apply {
            // Initialize and load the game URL here
        }
    } else if (savedInstanceState != null) {
        // Restore the WebView state
        webViewViewModel.webView?.restoreState(savedInstanceState)
    }

    // Add the WebView to your layout
    fragment_c_layout.addView(webViewViewModel.webView)
}

This way, when you navigate back from Fragment C to Fragment B, the WebView and the game state will be saved in the ViewModel. When you navigate to Fragment C again, the WebView state will be restored, and the game will be in the paused state.

Note: You may need to modify the game code to pause/resume the game based on the WebView state if the game does not handle it automatically. Also, make sure to manage the WebView lifecycle (such as onPause, onResume, and onDestroy) in your Fragment C.