1. #1
    Sencha Premium Member
    Join Date
    Sep 2012
    Location
    The Netherlands
    Posts
    79
    Answers
    7
    Vote Rating
    4
    zwikske is on a distinguished road

      0  

    Default Answered: White/Blank screen when adding app to homescreen/springboard iOS

    Answered: White/Blank screen when adding app to homescreen/springboard iOS


    Hi All,

    We've build ourselves a login page (JSP on a Tomcat server) that makes use of 'Ext.setup' that will look like this:
    Code:
    Ext.setup( {
        requires: [ 'Ext.form.Panel' ],
                
        onReady: function () 
        {
            var items = [ {
                xtype : 'fieldset',
                id: 'loginfields',
                items : [ {
                    xtype : 'textfield',
                    name  : 'zwik_username',
                    id    : 'username',
                    placeHolder : 'User Name',
                    cls   : 'textfield-bottom-separator',
                    listeners: {
                        action: function() {
                            Ext.getCmp('loginForm').submit( {
                                url: '${contextPath}/zwik_login',
                                method: 'POST'
                            });
                        }
                    }
                },
                {
                    xtype : 'passwordfield',
                    name  : 'zwik_password',
                    id    : 'password',
                    placeHolder : 'Password',
                    listeners: {
                        action: function() {
                            Ext.getCmp('loginForm').submit( {
                                url: '${contextPath}/zwik_login',
                                method: 'POST'
                            });
                        }
                    }
                }
            ] },
            {
                xtype: 'button',
                id: 'loginButton',
                text: 'Login',
                ui : 'secondary',
                style: {
                    'margin-left' : 'auto',
                    'margin-right' : 'auto',
                    width: '150px',
                },
                handler: function(form) {
                    Ext.getCmp('loginForm').submit( {
                        url: '${contextPath}/zwik_login',
                        method: 'POST'
                    });
                }
            }
            <c:if test="${loginError}">
            ,
            {
                xtype : 'label',
                html  : '${errorMessage}',
                cls   : 'incorrect-login'
            }
            </c:if>
            ] ;
    
            if (Ext.os.is.Tablet) {
                items = [ {
                    id: 'loginPanel',
                    xtype: 'panel',
                    maxWidth: '500px',
                    centered: false,
                    items: items,
                    style: "padding-bottom:20px;border: 3px solid #0072CF;background-color:white;border-radius:5px;"
                } ] ;            		
            }
                	
            Ext.create('Ext.form.Panel', {
                requires: ['Ext.field.Password', 'Ext.TitleBar', 'Ext.form.FieldSet'],
                id : 'loginForm',
                fullscreen: true,
                scrollable: false,
                standardSubmit : true,
                layout: {
                    type: 'vbox'
                },
                items: items
            }); <%-- End Ext.create('form', {...}) --%>
        } <%-- End onReady : function() {...} --%>
    }); <%-- End Ext.setup --%>
    As you can see, nothing special happens above. When we test this in our browser the page shows up perfectly fine. No errors in the console or network tab whatsoever. Also when we open the page on our mobile browser the page works perfect. Though when we add the page as a bookmark to our home screen on iOS and open up the "app" from the home screen. Only a blank page shows up.

    What should we do to solve this or debug this anyway? We're using Windows 7 machines on a Tomcat 7 server. We use Chrome on our computer and the default Safari browser on iOS. We haven't used the sencha command to build to production or testing, just as is.

  2. I got it solved by moving the 'requires' to just after Ext.setup. The code now looks like this:

    Code:
    Ext.setup(
            {
                requires: ['Ext.form.Panel', 'Ext.field.Password', 'Ext.TitleBar', 'Ext.form.FieldSet'],
    
    ...
    ...
    ...

  3. #2
    Sencha Premium Member
    Join Date
    Sep 2012
    Location
    The Netherlands
    Posts
    79
    Answers
    7
    Vote Rating
    4
    zwikske is on a distinguished road

      0  

    Default


    I got it solved by moving the 'requires' to just after Ext.setup. The code now looks like this:

    Code:
    Ext.setup(
            {
                requires: ['Ext.form.Panel', 'Ext.field.Password', 'Ext.TitleBar', 'Ext.form.FieldSet'],
    
    ...
    ...
    ...

  4. #3
    Touch Premium Member BostonMerlin's Avatar
    Join Date
    Aug 2010
    Location
    Boston
    Posts
    522
    Answers
    20
    Vote Rating
    41
    BostonMerlin has a spectacular aura about BostonMerlin has a spectacular aura about BostonMerlin has a spectacular aura about

      1  

    Default


    I'm having the same problem. After upgrading to Sencha 2.1, my site launched from the home screen, shows a blank white screen. launch the same site from a browser bookmark, works fine. Before the upgrade to 2.1 this worked fine, no problem.

    I created a brand new 1 container view with nothing but a button. I don't have any requires to move around (doing this with Architect) like the OP so I'm at a loss as to what to try next.

    Thoughts?

    Thanks, John

  5. #4
    Sencha Premium Member
    Join Date
    Oct 2012
    Posts
    36
    Vote Rating
    0
    roboboot is on a distinguished road

      0  

    Default


    Same for me. After 2.1 upgrade when I put the link in Home on iOS it is showed a White Screen.

    Any Idea?

  6. #5
    Touch Premium Member BostonMerlin's Avatar
    Join Date
    Aug 2010
    Location
    Boston
    Posts
    522
    Answers
    20
    Vote Rating
    41
    BostonMerlin has a spectacular aura about BostonMerlin has a spectacular aura about BostonMerlin has a spectacular aura about

      0  

    Default


    Sencha has finally classified this as a bug and will address:

  7. #6
    Sencha User
    Join Date
    Sep 2011
    Posts
    78
    Vote Rating
    1
    shweta.saxena09 is on a distinguished road

      0  

    Default


    I tried this....
    And its not working...

    And before making app build, i want to see my whole app as a native app... How to resolve this issue... Please guide

    Thankew