wicketで動的にタグの属性を変更する
表などを表示するときに背景が一色よりも背景を交互に変更した方が見やすいです。
例えば、
より
こっちの方が見やすいです。そんなことなくても見やすいことにしといてください。
PagingNavigatorPage.java
public class PagingNavigatorPage extends WebPage { public PagingNavigatorPage() { PageableListView view = new PageableListView("addressList", new PropertyModel(this, "elements"),3) { @Override protected void populateItem(ListItem item) { final ListElement elem = (ListElement) item.getModelObject(); item.add(new Label("id", String.valueOf(elem.getId()))); item.add(new Label("name", elem.getName())); item.add(new ExternalLink("address", elem.getAddress(), elem.getAddress())); } }; add(view); PagingNavigator navigator = new PagingNavigator("paging", view); add(navigator); } public List<ListElement> getElements(){ List<ListElement> list = new ArrayList<ListElement>(); list.add(new ListElement(1,"沢城みゆき", "sawashiro")); list.add(new ListElement(2,"平野綾", "hirano")); list.add(new ListElement(3,"生天目仁美", "nabatame")); list.add(new ListElement(4,"井上麻里奈", "inoue")); list.add(new ListElement(5,"真田アサミ", "sanada")); list.add(new ListElement(6,"後藤沙緒里", "gotojaku")); list.add(new ListElement(7,"ゴットゥーザ様", "gotokyou")); return list; } } @SuppressWarnings("serial") class ListElement implements Serializable { private int id; private String name; private String address; public ListElement(int id, String name , String address) { super(); this.id = id; this.name = name; this.address = address; } public String getName() { return name; } public void setName(String name) { this.name = name; } public String getAddress() { return address; } public void setAddress(String address) { this.address = address; } public int getId(){ return id; } public void setId(){ this.id = id; } }
PagingNavigatorPage.html
<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Insert title here</title> </head> <body> <h1>Paging Navigator</h1> <table border="1"> <thead> <tr> <th>No</th> <th>名前</th> <th>URL</th> </tr> </thead> <tbody> <tr wicket:id="addressList" style="background-color: #FFFFFF;"> <td wicket:id="id">id</td> <td wicket:id="name">sample</td> <td><a wicket:id="address" href="sample">sample</a></td> </tr> </tbody> </table> <div wicket:id="paging">1,2</div> </body> </html>
と書くと上記のように保存される。
populateItemの中に
item.add(new AttributeModifier("style", new AbstractReadOnlyModel() { @Override public Object getObject() { if((elem.getId()%2)!=0){ return "background-color :#E0FFFF;"; }else{ return "background-color :#FFFFFF;"; } } }));
と書くと交互に色が変わる。
属性を変更するクラスがAttributeModifierで第一引数に変更する属性名、第二引数に属性の値を書く。
第二引数にはモデルを渡せるからgetObjectで動的に変更することができる。
ListView使ったときにAttributeModifierをどれにaddしたらいいか少し迷ったけどitemにaddすればよかったのね。もっと簡単にかけないかな。