Sencha Touch Ext.navigation.View pop to root

问题:

I have an Ext.navigation.View in which I have pushed a few views. Certain user interactions require that I go directly back to the top level of the navigation view -- the equivalent of popToRootViewControllerAnimated: on a UINavigationController in iOS.

I have tried various things like:

while(navigationView.getItems().getCount() > 1)
    navigationView.pop();

and

while(navigationView.canPop())
    navigationView.pop();

Neither work. The first example seems to put me into an infinite loop which isn't too surprising. The second example only seems to pop one view off.

So the question: What is the proper way to pop to the root view in an Ext.navigation.View in Sencha Touch (version 2 developer preview)?

回答1:

There has been a number of interim methods for achieving this.

The one I was using was to pop a number higher than the number of levels you would ever have e.g.

navigationView.pop(10);

and that worked fine, but I was never happy with that, but I see they have now introduced a reset method. Which you can call thus...

navigationView.reset();

Internally within the Sencha source code (see below) you can see that it does a similar job to what @Mithralas said, but just easier to write.

// From the Sencha source code
this.pop(this.getInnerItems().length);

回答2:

popToRoot: function() {
     this.pop(this.getItems().length - 1);
}

回答3:

Ensure to use the NavigationView.reset() method. To make it clear, if your main navigation view is Main, you'd do something like this in the controller:

this.getMain().reset();

回答4:

The solution turned out to be extending the navigation view with the following:

popToRoot: function(destroy)
{
    var navBar = this.getNavigationBar(),
    stackLn = this.stack.length,
    stackRm;

    //just return if we're at root
    if(stackLn <= 1) return;
    //just return if we're already animating
    if(navBar && navBar.animating) return;

    //splice the stack to get rid of items between top and root
    stackRm = this.stack.splice(1, stackLn-2);
    //remove views that were removed from the stack if required
    if(destroy) {
        stackRm.forEach(function(val, idx, arr) {
            this.remove(val, true);
        });
    }
    //clear out back button stack
    navBar.backButtonStack = [];
    //now we can do a normal pop
    this.pop();
}