Question

如何在用户按下时按下正常按钮？还有如何在单击另一个按钮时使其看起来正常？我们可以使用分段按钮来完成此操作。但是如何使用普通按钮实现呢？

Answer 1

在sencha-touch-debug.css中，查看已申请按下的confirm button ..

的css

/* line 73, ../themes/stylesheets/sencha-touch/default/_mixins.scss */
.x-button.x-button-confirm.x-button-pressing, .x-button.x-button-confirm.x-button-pressing:after, .x-button.x-button-confirm.x-button-pressed, .x-button.x-button-confirm.x-button-pressed:after, .x-button.x-button-confirm.x-button-active, .x-button.x-button-confirm.x-button-active:after, .x-toolbar .x-button.x-button-confirm.x-button-pressing, .x-toolbar .x-button.x-button-confirm.x-button-pressing:after, .x-toolbar .x-button.x-button-confirm.x-button-pressed, .x-toolbar .x-button.x-button-confirm.x-button-pressed:after, .x-toolbar .x-button.x-button-confirm.x-button-active, .x-toolbar .x-button.x-button-confirm.x-button-active:after, .x-button.x-button-confirm-round.x-button-pressing, .x-button.x-button-confirm-round.x-button-pressing:after, .x-button.x-button-confirm-round.x-button-pressed, .x-button.x-button-confirm-round.x-button-pressed:after, .x-button.x-button-confirm-round.x-button-active, .x-button.x-button-confirm-round.x-button-active:after, .x-toolbar .x-button.x-button-confirm-round.x-button-pressing, .x-toolbar .x-button.x-button-confirm-round.x-button-pressing:after, .x-toolbar .x-button.x-button-confirm-round.x-button-pressed, .x-toolbar .x-button.x-button-confirm-round.x-button-pressed:after, .x-toolbar .x-button.x-button-confirm-round.x-button-active, .x-toolbar .x-button.x-button-confirm-round.x-button-active:after, .x-button.x-button-confirm-small.x-button-pressing, .x-button.x-button-confirm-small.x-button-pressing:after, .x-button.x-button-confirm-small.x-button-pressed, .x-button.x-button-confirm-small.x-button-pressed:after, .x-button.x-button-confirm-small.x-button-active, .x-button.x-button-confirm-small.x-button-active:after, .x-toolbar .x-button.x-button-confirm-small.x-button-pressing, .x-toolbar .x-button.x-button-confirm-small.x-button-pressing:after, .x-toolbar .x-button.x-button-confirm-small.x-button-pressed, .x-toolbar .x-button.x-button-confirm-small.x-button-pressed:after, .x-toolbar .x-button.x-button-confirm-small.x-button-active, .x-toolbar .x-button.x-button-confirm-small.x-button-active:after {
  background-color: #628904;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #3e5702), color-stop(10%, #507003), color-stop(65%, #628904), color-stop(100%, #648c04));
  background-image: -webkit-linear-gradient(#3e5702, #507003 10%, #628904 65%, #648c04);
  background-image: linear-gradient(#3e5702, #507003 10%, #628904 65%, #648c04);
}

您可以在app.css文件中包含此css，然后通过设置pressedCls属性将其应用于您的按钮。

pressedCls: 'x-button-pressed'

Answer 2

当用户按住时，roadRunner的答案是解决方案，而根据您提到的有关分段按钮的内容，我认为您的意思是点击按钮。< / p>

如果是这样，为了回答您的问题，我假设您有2 Ext.Button，button_1和button_2（id与其姓名相同）

当您点击button_1并希望它看起来像是按下时：

Ext.getCmp('button_1').setCls('x-button-pressing');

当您点击button_2时，请执行相似操作并更改button_1的外观：

Ext.getCmp(`button_2`).setCls('x-button-pressing');
Ext.getCmp(`button_1`).setCls('');

希望这有帮助。

Answer 3

启用切换应该有效。 toggleGroup用于对组中的某些按钮进行分组。

                                    {
                                        xtype: 'button',
                                        id: 'btnId'
                                        enableToggle: true,
                                        text: 'Toggele Button',
                                        toggleGroup: 'accountbuttons'
                                    }

如何在sencha中按下正常按钮？

3 个答案: