button - 是否可以使用 gxt 2.5 在按钮中添加复选框

Question

我的类扩展了 gxt 按钮，我想在按钮中添加一个复选框，但没有在按钮中添加组件的方法。

import com.extjs.gxt.ui.client.widget.button.Button;
import com.extjs.gxt.ui.client.widget.form.CheckBox;

public class ButtonCheckBox extends Button {

    private CheckBox checkBox;

    public ButtonCheckBox() {
        checkBox = new CheckBox();
        checkBox.setBoxLabel("CheckBox");

        setWidth(200);
    }
}

如果可能的话，我怎样才能在我的按钮中添加一个复选框？

Answer 1

感谢 Eliran Malka，我使用以下代码完成了这项工作

import com.dips.pei.client.view.resources.Icons;
import com.extjs.gxt.ui.client.event.ComponentEvent;
import com.extjs.gxt.ui.client.widget.button.ToggleButton;
import com.google.gwt.user.client.ui.AbstractImagePrototype;

public class CheckBoxButton extends ToggleButton {

public CheckBoxButton() {
    setIcon(AbstractImagePrototype.create(Icons.INSTANCE.notcheckedIcon()));
    setId("checkBoxButton");
}

@Override
protected void onClick(ComponentEvent ce) {
    super.onClick(ce);

    if(isPressed()){
            setIcon(AbstractImagePrototype.create(Icons.INSTANCE.checkedIcon()));
    }else{
        setIcon(AbstractImagePrototype.create(Icons.INSTANCE.notcheckedIcon()));
    }
}
}

Answer 2

使用 GXT 2.x 标准 API 似乎不可能，但可以使用 HTML 来实现Template。

假设复选框的目的是作为按钮状态的指示器，我建议您改用 aToggleButton并修改其外观。您可以为其分配一个 CSS 类名，并根据其不同的状态应用不同的背景图像：

.my-toggle-button .x-btn-mc {
    background-image: url('images/toggle-button/checkbox-off.png');
}

.my-toggle-button.x-btn-pressed .x-btn-mc {
    background-image: url('images/toggle-button/checkbox-on.png');
}

参考资料（在 GXT 2.2.5 API 上）

• Template
• ToggleButton