Results 1 to 7 of 7

Thread: Ext.widget with modern widgets

  1. #1
    Sencha User
    Join Date
    Aug 2010
    Posts
    3

    Default Ext.widget with modern widgets

    Hello,

    I'm trying to implement login part for my universal application, bellow is my launch function from Application.js:

    Code:
    launch: function () {
        var loggedIn;
        loggedIn = localStorage.getItem("StormUserDetails");
        Ext.widget(loggedIn ? 'app-main' : 'login');
    },
    That works but I found that Ext.widget() doesn't load widget instance in modern view.

    If I try to load those widgets via mainView in app.js everything works perfectly.

    Thanks Alex

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,449
    Answers
    3997

    Default

    You need to require classes properly anyway so when you run a build it will require those classes. So you need to add the two components that have the xtype 'app-main' and 'login' into the requires array in your application.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Fullstack Engineer
    ________________
    Modus Create is based on the model of an open source team. We’re a remote, global team of experts in our field. To find out more about the work we do, head over to our website.

    Check out my GitHub:
    https://github.com/mitchellsimoens

  3. #3
    Sencha User
    Join Date
    Aug 2010
    Posts
    3

    Default

    Hi Mitchell, yep, I've done that, still blank screen. What I found is that my classic Main.js has plugins: 'viewport' line. There is no viewport plugin in modern API, so is there a way to convert modern Main.js that extends Ext.tab.Panel into Viewport? Thanks alex

  4. #4
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,449
    Answers
    3997

    Default

    This simple fiddle works:

    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Fullstack Engineer
    ________________
    Modus Create is based on the model of an open source team. We’re a remote, global team of experts in our field. To find out more about the work we do, head over to our website.

    Check out my GitHub:
    https://github.com/mitchellsimoens

  5. #5
    Sencha User
    Join Date
    Aug 2010
    Posts
    3

    Default

    Hi Mitchel,

    you are using mainView param and that works for me too. I was trying to follow this exercise https://docs.sencha.com/extjs/5.1/tu...login_app.html and make it work in modern API. So I need something like this withoout MainView Ext.widget() isntead:


    Code:
    Ext.define('Fiddle.view.Main', {
        extend : 'Ext.tab.Panel',
        xtype  : 'fiddle-main',
        
        items : [
            {
                title : 'Foo',
                html  : 'foo'
            },
            {
                title : 'Bar',
                html  : 'bar'
            }
        ]
    });
    
    Ext.application({
        name : 'Fiddle',
        
        //mainView : 'Fiddle.view.Main',
        launch: function() {
            Ext.widget('fiddle-main');
        }
    });
    Thanks alex

  6. #6
    Sencha User
    Join Date
    May 2015
    Posts
    31
    Answers
    1

    Default

    Make sure to add the container to the viewport when using launch(). Using the config, Ext does this automagically for you.


    PHP Code:
    // inside launch()
     
    var mainView Ext.create('App.view.main.Main'); 
        if (
    Ext.Viewport.add) { 
            
    Ext.Viewport.add(mainView); 
        } 

    Also: If this is based on the classic toolkit, make sure that the container uses plugin "viewport". This is not needed when using modern though.

    Regards

    Wolfgang

  7. #7
    Sencha User mounir1's Avatar
    Join Date
    Jan 2018
    Location
    Turkey Antalya
    Posts
    10

    Default

    Quote Originally Posted by wolfganga View Post
    Make sure to add the container to the viewport when using launch(). Using the config, Ext does this automagically for you.


    PHP Code:
    // inside launch()
     
    var mainView Ext.create('App.view.main.Main'); 
        if (
    Ext.Viewport.add) { 
            
    Ext.Viewport.add(mainView); 
        } 

    Also: If this is based on the classic toolkit, make sure that the container uses plugin "viewport". This is not needed when using modern though.

    Regards

    Wolfgang
    I's been a while,but I am wondering if there is an else for that statement so the modern can excute the widget different way !!

Similar Threads

  1. Widget column with multiple widgets per column
    By btmccracken in forum Ext 5: Q&A
    Replies: 3
    Last Post: 27 May 2015, 9:42 AM
  2. Touch MVC, Mobile Widgets -> Desktop profile, custom widgets?
    By aaronwhite in forum Sencha Touch 2.x: Q&A
    Replies: 4
    Last Post: 3 Feb 2012, 2:15 PM
  3. Replies: 3
    Last Post: 24 Jan 2012, 3:19 PM
  4. GXT widget Grid - how to render the widgets
    By xperetz in forum Community Discussion
    Replies: 5
    Last Post: 7 Oct 2010, 1:58 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •