Switch view supersonic

Question

I'm developing cross-platform application that uses supersonic. However, I believe I have a problem with understanding how supersonic manages views internally.

First of all I don't want to use native navigation bar because it does not support images inside title, like logo of company. That is way I don't want to push a view into views stack (because it automatically adds the < Back button).

My question is: how to switch a view in appgyver's supersonic without pushing it into the views stack? Similarly like tabs but without tabs interface. Is it possible?

Maybe I should just use a different mobile web application framework?

Answer 1

You can remove the native navigation bar with this method:

supersonic.ui.navigationBar.hide(options).then( function() {
    supersonic.logger.debug("Navigation bar hidden without animation.");
});

There is also another suggestion for hiding the navbar so it doesn't flash on the screen found here:

Navigation Bar not hiding I have noticed that a lot of the times, the bar won't be hidden because the call has been made before the view has finished loading, resulting in an error, and the bar not hiding .

Quick Fix: You need a way to tell the view that it has finished loading. How do we do that ? window.post()

On the original view, in any controller, add the following code

$scope.broadcastMessage = function(msg){

    var message = {
        recipient: "hideView",
        message: "Hi Hide view!"
    };

    window.postMessage(message);
});

In your second view, do the same, but use the following code

function messageReceived(event) {

    // check that the message is intended for us
    if (event.data.recipient === "showView") {
        steroids.view.navigationBar.hide(); 
    }
}
window.addEventListener("message", messageReceived);

That will make sure the call is not made until after the view has received the message (which it won't until after it has loaded)

This means pushing views to the stack will not provide the native navbar and you can add your own and style it how you want. This is a pretty common method using Supersonic right now.

If you are using tabs, they each have their own view stack.

To answer your question, there is no way to have a view that is not pushed to a stack. Working around that is pretty straightforward. You could also use modals. Again, to style the navbar however you want, you would want to create your own and hide the native navbar.

It is worth a try with this framework. I've built many applications with it now.