Question

我们目前正在使用Sencha Touch Carousel，我们遇到了以下问题。我们还没有看到任何简单的方法来显示超过3张卡/图像（默认选项）。代码看起来像这样

var gallery = new Ext.Carousel({
cls: 'galleryimage',
xtype: 'carousel',
height: '60px',
width: '65px',
items: [{
    html: '<img src="static/images/gallery/ex2.jpg" />',
    cls: 'image',
},
{
    html: '<img src="static/images/gallery/ex2_2.jpg" />',
    cls: 'image',
},
{
    html: '<img src="static/images/gallery/ex2_3.jpg" />',
    cls: 'image',
},
{
    html: '<img src="static/images/gallery/ex2_4.jpg" />',
    cls: 'image',
},
{
    html: '<img src="static/images/gallery/ex2_5.jpg" />',
    cls: 'image',
}]

}）;

令人非常不安的是，它没有明确记录，因为我认为很多人都希望这样做。我希望有一个人有一个非常简单的方法，而不必更改其他.scss文件。

/ *编辑* /

将此代码添加到其中：

    var gallerypanel = new Ext.Panel({
        layout: {
            type: 'vbox',
            align: 'stretch'
        },
        defaults: {
            flex: 1
        },
        items: [gallery]
    });

Answer 1

在这里，一个有4张牌的工作示例：

Ext.setup({
    tabletStartupScreen: 'tablet_startup.png',
    phoneStartupScreen: 'phone_startup.png',
    icon: 'icon.png',
    glossOnIcon: false,
    onReady: function() {
        // Create a Carousel of Items
        var carousel1 = new Ext.Carousel({
            defaults: {
                cls: 'card'
            },
            items: [
            {
                title: 'Tab 1',
                html: '1'
            },
            {
                title: 'Tab 2',
                html: '2'
            },
            {
                title: 'Tab 3',
                html: '3'
            },
            {
                title: 'Tab 4',
                html: '4'
            }]
        });


        new Ext.Panel({
            fullscreen: true,
            layout: {
                type: 'vbox',
                align: 'stretch'
            },
            defaults: {
                flex: 1
            },
            items: [carousel1]
        });
    }
});

希望有所帮助

更改卡的数量（Sencha Touch Carousel）

1 个答案: