2013-01-10 63 views
0

我是新来煎茶touch.I的数字键盘写代码,但按钮显示vertically.my代码是aligment键盘按钮(数字)

Ext.define("exercise.view.Numberplate",{ 
    extend: "Ext.SegmentedButton", 
    requires:['Ext.Button'], 
    xtype:'Numberplate', 
    allowMultiple: true, 
    config: { 
     pack:'center', 
     centered:true, 
     height:30, 
     width:100, 
     xtype:'button', 
     items: [ 
      { 
       xtype:'segmentedbutton', 
       allowDepress:true, 
       scroll:true, 
       //layout:'vbox', 
       items:[ 
        { 
         text:'1', 
         width:100 
        }, 
        { 
         text : '2', 
         width:100 
        }, 
        { 
         text: '3', 
         width:100 
        } 
       ] 
      }, 
      { 
       xtype:'segmentedbutton', 
       //centered:true, 
       pack:'center', 
       items:[ 
        /* { 
        centered:true, 
        html: [ 
        '<br><br><br><br>' 
        ].join("") 

        },*/ 
        { 
         text:'4', 
         width:100 
        }, 
        { 
         text:'5', 
         width:100 
        }, 
        { 
         text:'6', 
         width:100 
        } 
       ] 
      } 
     ] 

    }, 
    constructor: function() { 
     this.on({ 
      scope: this, 
      delegate: 'button', 

      tap: 'tapHandler' 
     }); 

     this.callParent(arguments); 
    }, 

    tapHandler: function(button) { 
     alert(button.getText()); 
     // this.setHtml("<span class=action>User tapped " + button.getText() + "</span>"); 
    } 
}); 

我试过,但我没有得到这。我觉得这很容易,但我不知道该怎么办this.can任何人帮助me.thanks提前

回答

0

只需添加layout:vbox到您的配置:

Ext.define("exercise.view.Numberplate",{ 
extend: "Ext.SegmentedButton", 
requires:['Ext.Button'], 
xtype:'Numberplate', 
allowMultiple: true, 
config: { 
    layout: 'vbox', // Add right here 
    pack:'center', 
    centered:true, 
    height:30, 
    width:100, 
    xtype:'button', 
    items: [ 
     { 
      xtype:'segmentedbutton', 
      allowDepress:true, 
      scroll:true, 
      //layout:'vbox', 
      items:[ 
       { 
        text:'1', 
        width:100 
       }, 
       { 
        text : '2', 
        width:100 
       }, 
       { 
        text: '3', 
        width:100 
       } 
      ] 
     }, 
     { 
      xtype:'segmentedbutton', 
      //centered:true, 
      pack:'center', 
      items:[ 
       /* { 
       centered:true, 
       html: [ 
       '<br><br><br><br>' 
       ].join("") 

       },*/ 
       { 
        text:'4', 
        width:100 
       }, 
       { 
        text:'5', 
        width:100 
       }, 
       { 
        text:'6', 
        width:100 
       } 
      ] 
     } 
    ] 

}, 
constructor: function() { 
    this.on({ 
     scope: this, 
     delegate: 'button', 

     tap: 'tapHandler' 
    }); 

    this.callParent(arguments); 
}, 

tapHandler: function(button) { 
    alert(button.getText()); 
    // this.setHtml("<span class=action>User tapped " + button.getText() + "</span>"); 
} 
}); 

希望它能帮助:)

+0

user1479606,由于其working.In这个程序,我创建了一个名为作为field.js,其中包含4个文本fields.in上面的代码我写的代码,当我们按下数字键,另一种观点认为,警报这里什么coming.but我想要的是,当我按下按钮1,按钮2或按钮3时,我想要'1','2'或'3'分别显示在textfield1中。你可以帮我做到这一点... – lucky

+0

我需要在这个时候去上学但你可以看看这个[厨房水槽演示](http://dev.sencha.com/deploy/touch/examples/production/kitchensink/#demo/toolbars)你可以查看这个应用右上角的源代码。 – Eli

+0

我检查那个例子,但我没有得到它。我会检查一次again.thanks为rply – lucky