0

我在标签视图中设置了一个带有 6 个标签的应用程序。其中 2 个选项卡是带有图像的轮播。

遇到2个问题：

1：当我在轮播中切换卡片时，动画只能从右到左工作（下一张幻灯片动画）。但是当从左向右滑动时（上一张幻灯片动画），上一张图片只是出现，没有动画。

2：当我将选项卡更改为任何其他选项卡，然后返回轮播时，我需要将其重置到起始位置 - 再次显示第一张图像。

有没有办法解决这个问题？

这是我用于轮播标签的代码：

var Tab1 = {
    id:'Tab1',
    xtype: 'carousel',
    layout: 'card',
    title: 'Product Info',
    iconMask: true,
    iconCls: 'info',
    bufferSize: 5,
    items: [
        { cls: 'card product-info page1' },
        { cls: 'card product-info page2' },
        { cls: 'card product-info page3' },
        { cls: 'card product-info page4' },
        { cls: 'card product-info page5' }
    ],
}
4

2 回答 2

0

由于 Tab1 是轮播的 id，因此您只需在选项卡面板中为 activeItemChange 事件添加一个侦听器并调用执行此操作的函数：

resetCarousel: function() {
    Ext.getCmp('Tab1').setActiveItem(0);
}

这是非常基本的，假设您的选项卡面板中有多个轮播或其他容器，您需要确定哪个选项卡具有特定轮播以调用重置功能。此外，您可以直接在侦听器函数中使用该代码。因此，如果您在选项卡面板中添加了一个侦听器，您可以像这样重置特定容器：

onTabChange: function(object, value, oldValue, eOpts) {
    console.log(value); //do this and view the console to see what the values are so you can specify them in your conditions
    if (value == "x") {
        Ext.getCmp('Tab1').setActiveItem(0);
    } else if (value == "y") {
        //do something
    } else {
        //do something
    }
}
于 2012-08-13T17:20:51.397 回答
0

通过在我想使用以下代码重置的每个选项卡上放置一个侦听器来解决此问题：

activate : function() {
    Ext.getCmp('Tab2').setActiveItem(0);
}
于 2012-08-14T08:38:24.793 回答