Sencha touch 2 native build not loading

Question

After generating the default app with:

sencha generate app Sencha ../Sencha

I decided to test the app on the iOS simulator

cd ../Sencha/
sencha app build native

It loads the app but gets stuck on the loading icon: Sencha iOS app stuck at loading screen

Below is the code for the main application (App.js):

Ext.application({
    name: 'Sencha',

    requires: [
        'Ext.MessageBox'
    ],

    views: ['Main'],

    icon: {
        '57': 'resources/icons/Icon.png',
        '72': 'resources/icons/Icon~ipad.png',
        '114': 'resources/icons/Icon@2x.png',
        '144': 'resources/icons/Icon~ipad@2x.png'
    },

    isIconPrecomposed: true,

    startupImage: {
        '320x460': 'resources/startup/320x460.jpg',
        '640x920': 'resources/startup/640x920.png',
        '768x1004': 'resources/startup/768x1004.png',
        '748x1024': 'resources/startup/748x1024.png',
        '1536x2008': 'resources/startup/1536x2008.png',
        '1496x2048': 'resources/startup/1496x2048.png'
    },

    launch: function() {
        // Destroy the #appLoadingIndicator element
        Ext.fly('appLoadingIndicator').destroy();

        // Initialize the main view
        Ext.Viewport.add(Ext.create('Sencha.view.Main'));
    },

    onUpdated: function() {
        Ext.Msg.confirm(
            "Application Update",
            "This application has just successfully been updated to the latest version. Reload now?",
            function(buttonId) {
                if (buttonId === 'yes') {
                    window.location.reload();
                }
            }
        );
    }
});

Below is the code for the main view (Main.js):

Ext.define("Sencha.view.Main", {
    extend: 'Ext.tab.Panel',
    requires: [
        'Ext.TitleBar',
        'Ext.Video'
    ],
    config: {
        tabBarPosition: 'bottom',

        items: [
            {
                title: 'Welcome',
                iconCls: 'home',

                styleHtmlContent: true,
                scrollable: true,

                items: {
                    docked: 'top',
                    xtype: 'titlebar',
                    title: 'Welcome to Sencha Touch 2'
                },

                html: [
                    "You've just generated a new Sencha Touch 2 project. What you're looking at right now is the ",
                    "contents of <a target='_blank' href=\"app/view/Main.js\">app/view/Main.js</a> - edit that file ",
                    "and refresh to change what's rendered here."
                ].join("")
            },
            {
                title: 'Get Started',
                iconCls: 'action',

                items: [
                    {
                        docked: 'top',
                        xtype: 'titlebar',
                        title: 'Getting Started'
                    },
                    {
                        xtype: 'video',
                        url: 'http://av.vimeo.com/64284/137/87347327.mp4?token=1330978144_f9b698fea38cd408d52a2393240c896c',
                        posterUrl: 'http://b.vimeocdn.com/ts/261/062/261062119_640.jpg'
                    }
                ]
            }
        ]
    }
});

I'm stuck with the same problem. Did you find the solution yet ? If so, please edit your question and post it ! — , Aug 16 '12 at 04:51

score 3 · Answer 1 · answered Aug 22 '12 at 05:39

Change the "logger": "no" to "logger": "false" in app.json. When you're done it should look like this:

"buildOptions": {
    "product": "touch",
    "minVersion": 3,
    "debug": false,
    "logger": "false"
},

Then rebuild again with sencha app build native. You can reproduce the same error in the browser with sencha app build production then point your browser to http://localhost/path/to/myapp/build/production. If you do, you'll have to clear your browser cache before it'll work (on chrome: wrench->tools-developer tools->local storage->hostname->X (for delete).

score 0 · Answer 2 · answered Aug 13 '12 at 12:15

0

The build process creates the minified version during the build process. Start it in the browser and check what the error console says.

answered Aug 13 '12 at 12:15

Zoltan Magyar

874
1
6
19

score 0 · Answer 3 · answered Dec 12 '12 at 20:35

so this is really late, but it looks like you haven't marked your question as answered, and I've just spent a couple of hours trying to figure this out, and it turns out that all of this is because of discrepancies between the Sencha Docs, the Sencha SDK Tools for downloading, and the actual Sencha SDK.

Hopefully this will help someone -

A basic app needs to be started with Sencha Command 3.0.0 (not the SDK Tools, which worked for Sencha 2.0) if you're SDK is version 2.1.0 or above. If you get the Sencha Command bit working properly (installing it didn't put it in the PATH for me, so I had to manually add it) everything works like a charm.

http://docs.sencha.com/touch/2-1/#!/guide/command

Hope that helps some stragglers!

Sencha touch 2 native build not loading

3 Answers3