Initial view pushing a navigation view

[TBakker]

Hi,

This week I downloaded Architect, I'm a sencha newbie but this tool is pretty easy to use . I got stuck on something while working with views.

I have a container(initial view) and a navigation view. The container serves as a login screen. The navigation view is my main view who push/pop other views.

How can I push a navigation view with a tap on the login button?

I have 2 controllers:
-Logincontroller
knows my MainNav by [view]
has one 'tap' action

-MainNavController
knows the other containers
has multiple 'tap' actions

Mutiple Views:
-cntLogin (container) (initial)
useralias: cntlogin

- MainNav (Ext.navigation.View)
useralias: mainnav

- bunch of other containers

This is my code when I push containers onto the navigationview but doesnt work when I try to push a navigation itself.

button.up('navigationview').push({
    xtype: 'cntpg',
    title: 'Persoonsgegevens'
});

Help is appreciated.

[sonnypickett]

What I have done to make this work is the following. Some of it will vary depending upon where the code is located. Basically I create an empty container called WorkArea at the top level, then I drag it into the Main View to create a link. In my case my Main View is a VBox with a header, work area, footer combo.

To move my various "worker" views into the WorkArea I do the following within a View Controller

var cont = this.GetWorkArea();

var viewToLoad = Ext.create(MyApp.view.ViewToLoad);   // name of actual view class 

cont.removeAll();
cont.add(viewToLoad);
cont.doLayout();

Of course I do add checks to make sure all the objects are valid before making the calls. Also if you've named your app something besides the default (MyApp), use that in the class path.

Now, initial view was an issue for me, since work area is blank by default. The way I got this to work was adding similar code to the "afterLayout" event of the Main View. Looks like this...

var cont = this.down('#workArea');

var viewToLoad = Ext.create(MyApp.view.LoginPanel);

cont.removeAll();
cont.add(viewToLoad);
cont.doLayout();

Not sure if it makes a memory difference, but I do have AutoDestroy set to true on my views. Good luck...

[TBakker]

Thank you for your reply.
Your idea of making a WorkArea made sense to me and created a solution .

I have this small piece of code that will remove the components on the WorkArea container and add the navigation view:

myviewport = Ext.ComponentQuery.query('myworkarea')[0];
myviewport .removeAll();
mynav = Ext.create('MyApp.view.MyNavigationView', {});
myviewport .add(mynav);