How to use ListModel in Timeline component
From Documentation
(Redirected from Small Talks/How to use ListModel in Timeline component)
Author
Gu Wei Xing, Software developer in NanTong of JiangSu province, China.
Gu Wei Xing, Software developer in NanTong of JiangSu province, China.
Date
May 21, 2007
May 21, 2007
Version
Applicable to zk-timeline1.1_3.
Applicable to zk-timeline1.1_3.
How to use ListModel
Like you do with ListBox component, you must set a model property for the bandinfo.For example,
<bandinfo model="${model}"/>
The listmodel is a variable which type is a SimpleModelList ,ListModelList (or etc) that implements ListModel interface.Here, I create uselistmodel.zul to demonstrate to use ListModel for band #1 and #2. So,when you want to add or remove OccurEvent dynamically from band you only call ListModel.add(OccurEvent) or ListModel.remove(OccurEvent).
Note:The ListModel in TimelineComponent supports lazy-loading.So you needn’t to add BandScrollListener to band.
Here is the source:
<window id="win">
<zscript>
<![CDATA[
import java.util.*;
TimeZone zone=TimeZone.getTimeZone("GMT-05");
Date current=new Date(Date.parse("Jun 28 2006 00:00:00 GMT-0500"));
//for hotzone of band #1
Date d1=new Date(Date.parse("Aug 01 2006 00:00:00 GMT-0500"));
Date d2=new Date(Date.parse("Sep 01 2006 00:00:00 GMT-0500"));
Date d3=new Date(Date.parse("Aug 02 2006 00:00:00 GMT-0500"));
Date d4=new Date(Date.parse("Aug 04 2006 00:00:00 GMT-0500"));
Date d5=new Date(Date.parse("Aug 02 2006 06:00:00 GMT-0500"));
Date d6=new Date(Date.parse("Aug 02 2006 12:00:00 GMT-0500"));
//for hotzone of band #2
Date d7=new Date(Date.parse("Aug 01 2006 00:00:00 GMT-0500"));
Date d8=new Date(Date.parse("Sep 01 2006 00:00:00 GMT-0500"));
ListModel model = new ListModelList();
]]>
</zscript>
<timeline height="300px" width="100%" id="tl">
<bandinfo width="70%" id="b1" intervalUnit="month"
intervalPixels="100" eventSourceUrl="data/example2.xml"
timeZone="{zone}" date="${current}" model="${model}">
<hotzone start="${d1}" end="${d2}" magnify="10" unit="week" />
<hotzone start="${d3}" end="${d4}" magnify="7" unit="day" />
<hotzone start="${d5}" end="${d6}" magnify="5" unit="hour" />
</bandinfo>
<bandinfo id="b2" timeZone="${zone}" date="${current}"
width="30%" intervalUnit="year" intervalPixels="200" syncWith="b1"
highlight="true" eventSourceUrl="data/example2.xml" trackHeight="0.5"
trackGap="0.2" showEventText="false" model="${model}">
<hotzone start="${d7}" end="${d8}" magnify="20" unit="week" />
</bandinfo>
</timeline>
<vbox>
<hbox>
<button label="Add OccurEvent">
<attribute name="onClick">
<![CDATA[
import org.zkforge.timeline.*;
import org.zkforge.timeline.data.*;
import java.util.*;
OccurEvent e=new OccurEvent();
Map params=new HashMap();
params.put("event",e);
Window w=(Window)Executions.createComponents("occurevent.zul", null, params);
w.doModal();
if(w.getAttribute("OK")){
model.add(e);
b1.scrollToCenter(e.getStart());
}
]]>
</attribute>
</button>
<button label="Remove OccurEvent">
<attribute name="onClick">
<![CDATA[
import org.zkforge.timeline.data.*;
Map params=new HashMap();
params.put("events",model.iterator());
Window w=(Window)Executions.createComponents("selectevent.zul", null, params);
w.doModal();
int index=w.getAttribute("selected");
if(index!=-1){
OccurEvent e=(OccurEvent)model.get(index);
model.remove(e);
b1.scrollToCenter(e.getStart());
}
]]>
</attribute>
</button>
<button label="Modify OccurEvent">
<attribute name="onClick">
<![CDATA[
import org.zkforge.timeline.data.*;
Map params=new HashMap();
params.put("events",model.iterator());
Window w=(Window)Executions.createComponents("selectevent.zul", null, params);
w.doModal();
int index=w.getAttribute("selected");
if(index!=-1){
OccurEvent e=(OccurEvent)model.get(index);
Map params=new HashMap();
params.put("event",e);
Window w=(Window)Executions.createComponents("occurevent.zul", null, params);
w.doModal();
if(w.getAttribute("OK")){
model.set(index,e);
b1.scrollToCenter(e.getStart());
}
}
]]>
</attribute>
</button>
<button label="Clear Dynamic Events">
<attribute name="onClick">
<![CDATA[
model.clear();
]]>
</attribute>
</button>
</hbox>
</vbox>
</window>
To modify a OccurEvent you can simply use model.set(int i,OccurEvent e).
Another alternate in Timeline1.1-3
- Bug1690556 is fiexed.
- Correct the display problem about band which has some hotzones.
- In OccurEvent class, set/getWikiSection(String wikiSection) is added.
- In Bandinfo class, modifyOccurEvent(OccurEvent event) is added. The original function which name is addManyOccureEvents has been renamed addManyOccurEvents and its parameter type has been changed from ArrayList to Iterator.
Dowload the example file
Summary
Thanks Pascal_Stalin.With his help,I fiexd the bug1690556 about timezone.
Gu Wei Xing is a software developer in NanTong of JiangSu province, China. He loves Java software development and Flash programming. He is also the host developer of the timeline project for ZK.forge.
| Copyright © Gu Wei Xing. This article is licensed under GNU Free Documentation License. |