0

我使用此链接开始使用 Sencha：http ://www.sencha.com/learn/getting-started-with-sencha-touch-2/

我的 Main.js 如下：

Ext.define("epiduo_ped.view.Main", 
{
    extend: 'Ext.Carousel',
    requires: 
    [
        'Ext.TitleBar',
        'Ext.Video'
    ],

    config: 
    {
        tabBarPosition: 'bottom',

        items: 
        [
           {
             xtype:   'homepanel'

           },
           {
             xtype:   'page1panel'
           }
        ]
    }
});

我修改了我的页面以扩展 Ext.Carousel 而不是 Ext.Panel。就允许滑动而言，这很有效，但是，现在我在底部没有导航栏，带有用于在页面之间切换的按钮，这是有道理的，因为我不再扩展 Ext.tab.panel。Sencha 中是否有内置的方式来同时拥有两者，或者这种自定义方式是我必须添加自己的 html 以在底部添加导航栏？无论哪种方式，我都不确定该怎么做。换句话说：我需要一个有 3 个页面的轮播，以便用户可以在它们之间滑动，同时添加用户使用 tabBar 上的按钮在轮播中的页面之间切换的能力。

4

2 回答 2

0

只需保留您的Ext.tab.Panel并在其中添加轮播：

Ext.define("epiduo_ped.view.Main", 
{
    extend: 'Ext.tab.Panel',
    requires: 
    [
        'Ext.TitleBar',
        'Ext.Video'
    ],

    config: 
    {
        tabBarPosition: 'bottom',
        fullscreen: true,

        items: [{
            title: 'Home',
            iconCls: 'home',
            html: 'Home Screen'
        },{
            title: 'Contact',
            iconCls: 'user',
            xtype:'carousel',
            items: [{
                html : 'Item 1',
            },{
                html : 'Item 2',
            },{
                html : 'Item 3'
            }]
        }]
    }
});

希望这可以帮助。

于 2012-07-03T20:35:41.750 回答
0

好的，我想为其他正在努力完成这项任务的人发布答案。基本上它是一个带有停靠在底部的工具栏的轮播：

http://www.sencha.com/forum/showthread.php?228733-Control-Carousel-with-Tabbar&s=3e485e109a9b06e351a1429469603273

您只需要使用 Sencha“主题”设置工具栏和图标的样式

http://docs.sencha.com/touch/2-0/#!/guide/theming

于 2012-07-06T20:26:10.797 回答