4

我正在编写一个 Sencha Touch 应用程序,其中包含一个中等复杂的组合Ext.TabBarwith Ext.Panel

但是当我没有设置属性时,我的Ext.PanelusingExt.layout.CardLayout遇到了一个神秘的问题:当我尝试调用'方法时,fullscreen: true它会抛出一个它在我的概念证明版本中没有打开的方法。TypeError: Object card has no method 'setActiveItem'panel.setActiveItem()fullscreen: true

我可以在加载了 Sencha Touch 库的页面上复制 Chrome 控制台上的问题,如下所示:

> var p1 = new Ext.Panel({layout:'card', items:[{html:'a'},{html:'b'}]})
undefined
> p1.setActiveItem(0)
TypeError: Object card has no method 'setActiveItem'

它不会发生在.fullscreen财产上:

> var p2 = new Ext.Panel({fullscreen: true,
                          layout:'card',
                          items:[{html:'a'},{html:'b'}]})
undefined
> p2.setActiveItem(0)
subclass

是什么赋予了?

版本信息:我使用的是 Sencha Touch 1.0.1a

更新 1(1 月 3 日,~10.30UTC+1h),使用调试器四处走动并发现一些东西:

仅设置layout: 'card'不会触发创建真实Ext.layout.CardLayout对象的创建。由于.setActiveItem()试图委托给竞争者的.layout财产,它几乎会立即失败。但是,设置.layout为新的Ext.layout.CardLayout会导致更多问题。

更新 2:(1 月 3 日,~12:25UTC+1h)这一切都归结为各种组件对象没有被渲染/插入到依赖项中以准备好渲染。我设法通过添加侦听器使我的代码正常工作,首先是added封闭面板中执行 a 的事件的侦听器this.setLayout(new Ext.layout.CardLayout());,然后是afterrender正在添加的组件上的侦听器,最终调用.setActiveItem()以切换到所需的卡。

4

4 回答 4

1

当卡片布局不是外部全屏布局时,它可以正常工作,但当然必须根全屏面板。

在这种情况下,我在内部卡片布局周围使用“适合”布局,并且设置活动项目可以正常工作:

var inner = new Ext.Panel({
    layout:'card',
    items:[
        {html:'a'},
        {html:'b'}
    ]
});

var outer = new Ext.Panel({
    fullscreen:true,
    layout:'fit',
    items:[
        inner
    ]
});

我怀疑问题更多的是关于面板是否已被渲染,而 fullscreen:true 恰好强制立即渲染(以及任何孩子,这就是它在我上面的代码中工作的原因)。

这是来自 Ext.Component 源:

if (this.fullscreen || this.floating) {
    this.monitorOrientation = true;
    this.autoRender = true;
}

if (this.fullscreen) {
    var viewportSize = Ext.Viewport.getSize();
    this.width = viewportSize.width;
    this.height = viewportSize.height;
    this.cls = (this.cls || '') + ' x-fullscreen';
    this.renderTo = document.body;
}

我想你可以手动进行一些设置......但我不得不问,你首先如何避免在它之外有一个全屏祖先组件?

于 2011-01-14T22:04:05.740 回答
1

我有同样的问题。卡片布局仅在容器面板具有“适合”布局时才有效。但是将容器类设置为适合会导致滚动条无法正常工作。所以我必须做的是禁用容器和卡片面板的滚动条,并为卡片面板的子项设置滚动条。

于 2011-03-22T00:20:25.433 回答
0

我的问题中的更新 2 回答了这个问题,尽管该解决方案感觉明显是货物崇拜。如果它在未来的 Sencha Touch 版本中出现问题,我不会太惊讶。

于 2011-01-03T11:36:50.867 回答
0

Sencha 可能已经改变了这一点,因为我没有收到错误。但是, setActiveItem() 将强制我的视图立即呈现,这在设置 UI 时是不可取的。如果您想设置初始卡片而不立即渲染视图,请直接使用属性而不是设置器,如下所示:

yourComp.activeItem = yourView;

代替

yourComp.setActiveItem(yourView);
于 2011-07-21T11:53:32.837 回答