1. #1
    Sencha User
    Join Date
    Apr 2011
    Posts
    212
    Vote Rating
    3
    bweiler is on a distinguished road

      0  

    Default PR4 approach to creating and referencing views?

    PR4 approach to creating and referencing views?


    I have been using the following get[ViewName]View() approach to get references to view constructors and I understand this will be changing going forward. In fact, if the views array is moved to the application definition, this old approach no longer works.

    Old approach:
    Code:
    Ext.define('MyApp.controller.MyController', {
        extend: 'Ext.app.Controller',
    
    
        views: [
             'MyList' // May belong in the app definition
        ],
    
        var list = this.getMyListView().create();
        ...

    Please explain the proper way to create and reference views going forward. I tried the following approach and it did not work.
    Code:
    Ext.define('MyApp.controller.MyController', {
        extend: 'Ext.app.Controller',
    
    
        views: [
             'MyList' // Does the views array belong in the app definition?
        ],
    
        refs: {
             // It made sense to me to autoCreate the main
             main: {
                 selector: 'mainview',
                 xtype: 'mainview',
                 autoCreate: true
             },
            // Do I have to autoCreate all views?
             myList: 'mylistview', // Using xtype as selector
        }
    
        var main = this.getMain() // Works fine
        ...
    
        // Create the first instance
        var list = this.getMyList().create(); // Undefined, but not sure why
        ...
        // Get subsequent references?
        var list = this.getMyList(); // Didn't get this far
        ...

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,547
    Vote Rating
    872
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    I use xtypes most of the time and use the requires within each view. I never subscribed to using the views array.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Apr 2011
    Posts
    212
    Vote Rating
    3
    bweiler is on a distinguished road

      0  

    Default


    Quote Originally Posted by mitchellsimoens View Post
    I use xtypes most of the time and use the requires within each view. I never subscribed to using the views array.
    Will you please explain your comment a bit further. I am still not following. Here's the example in the updated Intro to Applications documentation:
    Code:
    Ext.application({
        name: 'MyApp',
        models: ['User', 'Product', 'Order'],
        views: ['OrderList', 'OrderDetail', 'Main'],
        controllers: ['Orders'],
    
    
        launch: function() {
            Ext.create('MyApp.view.Main');
        }
    });
    The text says that this causes the classes listed in the arrays to be automatically loaded. I would think this means that I can reference them using the refs definition in the controller, but this does not seam to be the case. Providing some examples to clarify my confusion in my original post would be greatly appreciated.

    Thanks

  4. #4
    Sencha User
    Join Date
    Oct 2010
    Posts
    80
    Vote Rating
    0
    linuxyf is on a distinguished road

      0  

    Default


    i want to know same problem.

    how to hide current view and show create and show another view as pr3?

  5. #5
    Sencha User
    Join Date
    Oct 2010
    Posts
    80
    Vote Rating
    0
    linuxyf is on a distinguished road

      0  

    Default


    Quote Originally Posted by bweiler View Post
    Will you please explain your comment a bit further. I am still not following. Here's the example in the updated Intro to Applications documentation:
    Code:
    Ext.application({
        name: 'MyApp',
        models: ['User', 'Product', 'Order'],
        views: ['OrderList', 'OrderDetail', 'Main'],
        controllers: ['Orders'],
    
    
        launch: function() {
            Ext.create('MyApp.view.Main');
        }
    });
    The text says that this causes the classes listed in the arrays to be automatically loaded. I would think this means that I can reference them using the refs definition in the controller, but this does not seam to be the case. Providing some examples to clarify my confusion in my original post would be greatly appreciated.

    Thanks
    how to get 'OrderList', 'Main' view instance in controller.

    i can get Main view instance by this.getMain(), but get undefined by this.getOrderList

  6. #6
    Sencha - Community Support Team edspencer's Avatar
    Join Date
    Jan 2009
    Location
    Palo Alto, California
    Posts
    1,939
    Vote Rating
    9
    edspencer is a jewel in the rough edspencer is a jewel in the rough edspencer is a jewel in the rough

      0  

    Default


    The best way to do this in Touch 2.0 is to simply reference the name of the view (e.g. MyApp.view.OrderList). The getter function wasn't adding a great deal of value and causes additional processing to be performed at startup, slowing the application down. It may make a return but for the time being just create views like you would for any other class:

    Code:
    Ext.create('MyApp.view.OrderList');
    Ext JS Senior Software Architect
    Personal Blog: http://edspencer.net
    Twitter: http://twitter.com/edspencer
    Github: http://github.com/edspencer

  7. #7
    Sencha User
    Join Date
    Oct 2010
    Posts
    80
    Vote Rating
    0
    linuxyf is on a distinguished road

      0  

    Default


    Quote Originally Posted by edspencer View Post
    The best way to do this in Touch 2.0 is to simply reference the name of the view (e.g. MyApp.view.OrderList). The getter function wasn't adding a great deal of value and causes additional processing to be performed at startup, slowing the application down. It may make a return but for the time being just create views like you would for any other class:

    Code:
    Ext.create('MyApp.view.OrderList');
    i know the create view instance as you said.

    Ext.create('MyApp.view.OrderList');

    but how to get the created view instance in controller.