煎茶触摸切换按钮答案

【问题标题】：Sencha Touch Toggle Button煎茶触摸切换按钮
【发布时间】：2011-08-13 09:25:52
【问题描述】：

当按下这样的切换按钮时，你怎么能执行一些操作：

{
    xtype: 'togglefield',
    name: 'enableSnd',
    label: 'Sound',
    value : 1    
}

【问题讨论】：

标签： event-handling sencha-touch togglebutton

【解决方案1】：

看一下sencha的官方文档：

http://dev.sencha.com/deploy/touch/docs/

对于一个简单的按钮：

    var playPauseButton = new Ext.Button({
    ui: 'small',
    text: 'Play',
    listeners: {
      tap: function() {
      Ext.Ajax.request({
        url: '/api/pause',
        success: updateStatus,
        failure: updateStatus });
      }
    }
    });

对于切换，event seems to be dragend...

【讨论】：

嗯，还是不行。尝试启用，禁用，dregend ......真正倾听的唯一听众是“改变”。但这一个在初始化时也会触发。嗯...

【解决方案2】：

这是我目前在我的应用程序中使用的一个示例。在“更改”中执行实际操作之前，我使用“beforechange”功能检查和验证一些数据。

{
    xtype: 'togglefield',
    name: 'toggleName',
    label: 'My Toggle Field',
    listeners: {
        beforechange: function (slider, thumb, newValue, oldValue) {
            if (oldValue == 0 && newValue == 1) {
                // Changing from off to on...validate something?
            }
        },
        change: function (slider, thumb, newValue, oldValue) {
            if (oldValue == 0 && newValue == 1) {
                // Changing from off to on...do something?
            }
            else if (oldValue == 1 && newValue == 0)
                // Changing from on to off...do something?
        }
    }
}

【讨论】：

嗨罗伯特，谢谢你的回答，我只是想知道你为什么在变化中测试新旧值？
@JasonRogers 只是因为我偏执并想确保价值正在改变我假设它正在做的事情。 :)
由于某种原因，我的函数以不同的顺序接收参数：function (slider, newValue, oldValue, thumb) {

【解决方案3】：

我使用以下代码为切换字段设置初始值并对切换字段的变化做出反应。

我最初禁用切换字段，然后使用（意外）行为 Sencha Touch 在初始化此切换字段以启用切换字段时触发更改事件。

请注意，这应该适用于 true 和 false 作为初始值。如果您想实际禁用切换字段，您将不得不删除 else 部分。

{
    xtype: 'togglefield',
    title: 'LightSwitch',
    label: 'Switch Lights',
    value: false,                        // initial value
    listeners: {
        change: function(slider, thumb, newValue, oldValue) {
            if (this.isDisabled() == false) {   // isEnabled
                alert('change Togglefield Event triggered');   // do something
            }
            else {
                this.enable();                                 // enable togglefield  
            }
        }
    },
    disabled: true,                                           
}

【讨论】：