煎茶旋转木马不工作

Posted 2023-02-25

【中文标题】煎茶旋转木马不工作

【英文标题】：Sencha Carousel not working

【发布时间】：2013-08-21 06:35:13

【问题描述】：

我是 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”时，它可以正常工作但不能滚动……我在上面的代码中有什么错误。请帮我解决。

【问题讨论】：

看到我更新了我的答案

告诉我，工作与否

@Viswa 现在正在工作......但是当我向下滚动时，它会回到相同的位置

【参考方案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..

【讨论】：

没有视图甚至不可见

仍然没有显示我已经启动了我的应用程序，例如 ~Ext.application( launch: function () ~

@Fazil 好的，我正在检查

@Fazil 你为什么不遵循 MVC ？...这样的编码会让你头疼

我知道为什么轮播视图不可见