<?component name="togglebutton" macroURI="/togglebutton.zul"
class="com.ToggleButton"?>
<zk>
<togglebutton onCheck="alert(self.isChecked());" checked="true"
disableImage="img/star_empty.png"
enableImage="img/star_fullfill.png" />
<togglebutton onCheck="alert(self.isChecked());" checked="false"
disableImage="img/star_empty.png"
enableImage="img/star_fullfill.png" />
</zk>
togglebutton.zul:
<window style="display: inline-block;">
<checkbox id="mc_togglebutton_checkbox" visible="false" />
<image id="mc_togglebutton_image" src="img/battery.gif" />
</window>
ToggleButton.java:
package com;
import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.HtmlMacroComponent;
import org.zkoss.zk.ui.event.CheckEvent;
import org.zkoss.zk.ui.event.Event;
import org.zkoss.zk.ui.event.EventListener;
import org.zkoss.zk.ui.event.Events;
import org.zkoss.zul.Image;
public class ToggleButton extends HtmlMacroComponent {
private Image _img;
private boolean _checked = true;
private String _disableImage;
private String _enableImage;
public void afterCompose() {
super.afterCompose();
init();
}
private void init() {
// this macro togglebutton
final Component toggleButton = this;
_img = (Image) getFirstChild().getFellow("mc_togglebutton_image");
if (_checked)
_img.setSrc(getEnableImage());
else
_img.setSrc(getDisableImage());
final Image img = _img;
img.addEventListener(Events.ON_CLICK, new EventListener(){
public void onEvent(Event event) throws Exception {
_checked = !_checked;
if (_checked)
_img.setSrc(getEnableImage());
else
_img.setSrc(getDisableImage());
// create an onCheck event then post it back
CheckEvent evt = new CheckEvent(Events.ON_CHECK, toggleButton, _checked);
Events.postEvent(evt);
}
});
}
public void setChecked(boolean checked) {
_checked = checked;
}
public boolean isChecked() {
return _checked;
}
public void setDisableImage(String disableImage) {
_disableImage = disableImage;
if (_img != null && !_checked)
_img.setSrc(_disableImage);
}
public void setEnableImage(String enableImage) {
_enableImage = enableImage;
if (_img != null && _checked)
_img.setSrc(_enableImage);
}
public String getDisableImage() {
return _disableImage;
}
public String getEnableImage() {
return _enableImage;
}
}
images:
star_fullfill.png
star_empty.png
The project architecture:
Download:
The project is available on github
https://github.com/benbai123/ZK_Practice/tree/master/Components/projects/togglebutton
References:
http://books.zkoss.org/wiki/Macro_Components
http://felipecypriano.com/2010/01/15/handling-events-on-zk-macro-components/
No comments:
Post a Comment