添加列表组件查看后 Sencha 触摸空白屏幕

发布于 2025-01-04 04:48:55 字数 1495 浏览 0 评论 0原文

我正在尝试将列表组件添加到 Sencha Touch 中的视图中。该应用程序正确运行,直到我尝试添加列表组件。将列表添加到视图后,应用程序加载(显示启动屏幕),然后仅显示白屏。

我正在使用 Sencha Touch、XCode 4、iOS 5 SDK 和 PhoneGap 1.3.0。

提前致谢!

这是视图的代码:

plantanalyzer.views.BuildingList = Ext.extend(Ext.Panel, {
dockedItems: [{
            dock: 'top',
            html: '<img src="images/logo.jpg"/>'
        },
        {
        xtype: 'list',
        itemTpl : '{name}',
        grouped : true,
        indexBar: true,
        store: newStore

    }]
});

以及我的测试数据存储的代码。我在index.html的头部有这个:

var newStore;

    function onBodyLoad(){
        Ext.regModel('Plants', {
            fields: ['name', 'efficiency']
        });

        newStore = new Ext.data.JsonStore({
            model  : 'Plants',
            sorters: 'name',

            getGroupString : function(record) {
                return record.get('name')[0];
            },

            data: [
                {name: 'Milwaukee',   efficiency: .85},
                {name: 'New York',    efficiency: .65},
                {name: 'St Paul',     efficiency: .73},
                {name: 'Phoenix',     efficiency: .35},
                {name: 'Los Angeles', efficiency: .45},
                {name: 'Miami',       efficiency: .75},
                {name: 'London',      efficiency: .39},
                {name: 'Moscow',      efficiency: .95},
                {name: 'Hogwarts',    efficiency: .99}
            ]
        });
    }

I am attempting to add a List component to a view in Sencha Touch. The app runs correctly until I try to add the list component. After Adding the list to the view the app loads (shows the splash screen)then only shows a white screen.

I'm using Sencha Touch, XCode 4, iOS 5 SDK, and PhoneGap 1.3.0.

Thanks in advance!

here's the code for the view:

plantanalyzer.views.BuildingList = Ext.extend(Ext.Panel, {
dockedItems: [{
            dock: 'top',
            html: '<img src="images/logo.jpg"/>'
        },
        {
        xtype: 'list',
        itemTpl : '{name}',
        grouped : true,
        indexBar: true,
        store: newStore

    }]
});

and the code for my test datastore. I have this in the head of index.html:

var newStore;

    function onBodyLoad(){
        Ext.regModel('Plants', {
            fields: ['name', 'efficiency']
        });

        newStore = new Ext.data.JsonStore({
            model  : 'Plants',
            sorters: 'name',

            getGroupString : function(record) {
                return record.get('name')[0];
            },

            data: [
                {name: 'Milwaukee',   efficiency: .85},
                {name: 'New York',    efficiency: .65},
                {name: 'St Paul',     efficiency: .73},
                {name: 'Phoenix',     efficiency: .35},
                {name: 'Los Angeles', efficiency: .45},
                {name: 'Miami',       efficiency: .75},
                {name: 'London',      efficiency: .39},
                {name: 'Moscow',      efficiency: .95},
                {name: 'Hogwarts',    efficiency: .99}
            ]
        });
    }

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

萌逼全场 2025-01-11 04:48:55

您可以在主体加载时创建商店,即在加载列表之后,因此当需要列表时 newStore 对象为空。
将此代码放在:

 Ext.regModel('Plants', {
        fields: ['name', 'efficiency']
    });

    newStore = new Ext.data.JsonStore({
        model  : 'Plants',
        sorters: 'name',

        getGroupString : function(record) {
            return record.get('name')[0];
        },

        data: [
            {name: 'Milwaukee',   efficiency: .85},
            {name: 'New York',    efficiency: .65},
            {name: 'St Paul',     efficiency: .73},
            {name: 'Phoenix',     efficiency: .35},
            {name: 'Los Angeles', efficiency: .45},
            {name: 'Miami',       efficiency: .75},
            {name: 'London',      efficiency: .39},
            {name: 'Moscow',      efficiency: .95},
            {name: 'Hogwarts',    efficiency: .99}
        ]
    });

之前:

plantanalyzer.views.BuildingList = Ext.extend(Ext.Panel, {
dockedItems: [{
            dock: 'top',
            html: '<img src="images/logo.jpg"/>'
        },
        {
        xtype: 'list',
        itemTpl : '{name}',
        grouped : true,
        indexBar: true,
        store: newStore

    }]
});

检查情况是否确实如此。

另一项建议是您应该将列表放在面板的项目中,而不是停靠的项目中。
顺便说一句,您的代码结构不佳。您应该遵循 MVC 模式。
检查这个 https://vimeo.com/17705448 和这个 http://www.sencha.com/learn/a-sencha-touch-mvc-application-with-phonegap/

You create your store on body load, i.e. after the list was loaded so the newStore object is empty when the list needed.
Put this code:

 Ext.regModel('Plants', {
        fields: ['name', 'efficiency']
    });

    newStore = new Ext.data.JsonStore({
        model  : 'Plants',
        sorters: 'name',

        getGroupString : function(record) {
            return record.get('name')[0];
        },

        data: [
            {name: 'Milwaukee',   efficiency: .85},
            {name: 'New York',    efficiency: .65},
            {name: 'St Paul',     efficiency: .73},
            {name: 'Phoenix',     efficiency: .35},
            {name: 'Los Angeles', efficiency: .45},
            {name: 'Miami',       efficiency: .75},
            {name: 'London',      efficiency: .39},
            {name: 'Moscow',      efficiency: .95},
            {name: 'Hogwarts',    efficiency: .99}
        ]
    });

Right before:

plantanalyzer.views.BuildingList = Ext.extend(Ext.Panel, {
dockedItems: [{
            dock: 'top',
            html: '<img src="images/logo.jpg"/>'
        },
        {
        xtype: 'list',
        itemTpl : '{name}',
        grouped : true,
        indexBar: true,
        store: newStore

    }]
});

To check if this is really the case.

One other suggestion is that you should put the list in the items of the panel, not the dockedItems.
Btw, your code is not well structured. You should follow the MVC patter.
Check this https://vimeo.com/17705448 and this http://www.sencha.com/learn/a-sencha-touch-mvc-application-with-phonegap/.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文