extjs - 煎茶旋转木马不工作

Question

我是 sencha 的新手，我尝试使用Carousel. 这是我的代码

var signupBase = {
standardSubmit : false,
items: [{
         xtype: 'fieldset',
         title: 'Sign up',
         defaults: {
                    required: true,
                    labelAlign: 'left',
                    useClearIcon: true,
                    labelWidth: '37%'
                    },
                    items: [{
                            xtype: 'textfield',
                            name : 'FirstName',
                            label: 'FirstName' ,
                            useClearIcon: true
                            },{
                            xtype: 'textfield',
                            name : 'LastName',
                            label: 'LastName',
                            useClearIcon: true
                            },{
                            xtype: 'textfield',
                            name : 'email',
                            label: 'Email',
                            useClearIcon: true
                            },{
                            xtype: 'passwordfield',
                            name : 'password',
                            label: 'Password',
                            useClearIcon: true
                            },{
                            xtype: 'passwordfield',
                            name : 'Confirm',
                            label: 'Confirm',
                            useClearIcon: true
                            }]
                    },{
                    xtype:  'button',
                    text:   'Sign up',
                    ui: 'confirm',
                    handler: function() {
                    view.setActiveItem('welcomepanel', {type:'fade', direction:'left'});

                    }
                    }]
            }
          var carousel = new Ext.create('Ext.Carousel',
                                          {
                                          fullscreen: true,
                                          itemLength: 250, // **you can change value as you want**
                                          defaults: {
                                          styleHtmlContent: true
                                          },
                                          items: [signupBase]});
        var view = Ext.create('Ext.TabPanel', {
                       fullscreen: true,
                       tabBarPosition: 'bottom',
                       scroll:'vertical',
                       //styleHtmlContent: true,
                       //padding: 10,
                       items: [{
                               title: 'HOME',
                               iconCls: 'home',
                               items: [{
                                       xtype: 'toolbar',
                                       title: 'Sign In',
                                       },signinBase]

                               },
                               {
                               title: 'ITEMS',
                               iconCls: 'star',
                               items: [
                                       {
                                       xtype: 'toolbar',
                                       title: 'Add Items',
                                       },
                                       carousel]

轮播视图在“添加项目”选项卡中不可见。当我直接添加“signupBase”时它的工作但它不滚动......我在上面的代码中有什么错误。请帮我解决它。

Answer 1

只是给height旋转木马。

        var carousel = new Ext.create('Ext.Carousel',{
            itemLength: 250, 
            height : '100%',
            defaults: {
                styleHtmlContent: true
            },
            items: [signupBase]
        });

更新

为添加项目选项卡提供卡片布局并使用停靠在顶部的标题栏，试试下面的代码

//Same code..
     {
       title: 'ITEMS',
       iconCls: 'star',
       layout:'card',
       items: [{
        docked: 'top',
        xtype: 'titlebar',
        title: 'Add Items',
       },
       carousel]
    },
//Same code..