为什么我的 xtypes 在 Sencha touch 2.0 final 中不起作用？答案

【问题标题】：Why are my xtypes not working in Sencha touch 2.0 final?为什么我的 xtypes 在 Sencha touch 2.0 final 中不起作用？
【发布时间】：2012-03-08 16:43:35
【问题描述】：

嘿，我一直在想以下问题：在我以前的应用程序中，我为我的类指定了一个 xtype，如下所示：

Ext.define('Sencha.view.Home', {
extend: 'Ext.Panel',
xtype: 'homepanel',

然后在我的视口中，我在项目中添加了“主面板”的 xtype，当然这工作正常，主面板和其他面板都显示在我的视图中。但是升级到 2.0 最终版后我不能再这样做了吗？不，我必须像这样使用它来在视图中包含我的主面板：

xclass: 'Sencha.view.Home'

这是版本的变化吗？我现在总是必须调用 xclass，还是我的 xtype 做错了什么？感谢您的帮助！

【问题讨论】：

您能否也展示一下您的项目是如何配置的？控制器和商店是如何设置的，因为这不是必需的。

标签： sencha-touch sencha-touch-2

【解决方案1】：

Sencha 框架的声明有一个别名关键字而不是 xtype http://docs.sencha.com/touch/2-0/#!/api/Ext.Class-cfg-alias

Ext.define('MyApp.CoolPanel', {
    extend: 'Ext.panel.Panel',
    alias: ['widget.coolpanel'],
    title: 'Yeah!'
});

// Using Ext.create
Ext.widget('widget.coolpanel');
// Using the shorthand for widgets and in xtypes
Ext.widget('panel', {
    items: [
        {xtype: 'coolpanel', html: 'Foo'},
       {xtype: 'coolpanel', html: 'Bar'}
    ]
});

这也是 EXTJS 现在的做法： https://stackoverflow.com/a/5608766/330417

【讨论】：

我在我的主页视图中尝试了这个：'alias:'widget.homepanel'，我在我的 Mainview 中用'alias:'homepanel'调用它，但它什么也没显示：/
你会使用它作为 xtype:homepanel，但将其声明为别名

【解决方案2】：

我有一个 Sencha Touch 2.0 应用程序，我的视口设置如下：

Ext.define('example.view.Viewport', {
    extend: 'Ext.Container',
    config: {
        fullscreen: true,
        id: 'mainContainer',
        layout: {
            type: 'card',
            animation: {}//we manually set this throughout the app
        },
        items: [
            /*
             * This is a list of all of the "cards" in our app that are preloaded
             */
            { xtype: 'dashboardpanel' },
            { xtype: 'customerlist' },
            { xtype: 'loginpanel' }
        ]
    }
});

所以如果你的不工作，我猜还有别的事情发生。但是如果不看更多代码就很难判断。

【讨论】：

【解决方案3】：

所以我发现我的 xtypes 出了什么问题：我在控制器中声明了我的视图，而不是在我的 App.js 中，因为我将它们放入我的 app.js 中对我来说一切正常！谢谢你的帮助！

【讨论】：

【解决方案4】：

Ext.define('Sencha.view.Home', {
extend: 'Ext.Panel',
alias: 'widget.homepanel'

当你想使用别名小部件“homepanel”时，你只需在任何你想实现它的地方说 xtype:'homepanel

【讨论】：

【解决方案5】：

只需将您的容器更改为从面板列出并将列表配置设置为

 scrollable: false,
 pinHeaders: false,

【讨论】：