This example continues the theme of the previous two examples and presents the final standings of the top ten medal-winning countries in the 2008 Summer Olympics in a TableView component. However, rather than representing the data using simple string-based hash maps or deserialized JSON values, this example uses a custom Java bean component to represent a table row. In addition to the "nation", "gold", "silver", "bronze", and "total" properties used in the previous examples, it also defines a "flag" property of type org.apache.pivot.wtk.media.Image, which is shown in the first column:
The Java source for the bean class is as follows:
package org.apache.pivot.tutorials.tableviews;
import java.net.URL;
import org.apache.pivot.util.concurrent.TaskExecutionException;
import org.apache.pivot.wtk.media.Image;
public class OlympicStanding {
private Image flag = null;
private String nation = null;
private int gold = 0;
private int silver = 0;
private int bronze = 0;
public Image getFlag() {
return flag;
}
public void setFlag(Image flag) {
this.flag = flag;
}
public void setFlag(URL flag) {
try {
setFlag(Image.load(flag));
} catch (TaskExecutionException exception) {
throw new IllegalArgumentException(exception);
}
}
public String getNation() {
return nation;
}
public void setNation(String nation) {
this.nation = nation;
}
public int getGold() {
return gold;
}
public void setGold(int gold) {
this.gold = gold;
}
public int getSilver() {
return silver;
}
public void setSilver(int silver) {
this.silver = silver;
}
public int getBronze() {
return bronze;
}
public void setBronze(int bronze) {
this.bronze = bronze;
}
public int getTotal() {
return (gold + silver + bronze);
}
}
The BXML source is as follows. Note that, in this example, the value for "total" no longer needs to be hard-coded, because it is calculated by the bean class:
<Window title="Table Views" maximized="true"
xmlns:bxml="http://pivot.apache.org/bxml"
xmlns:content="org.apache.pivot.wtk.content"
xmlns:tableviews="org.apache.pivot.tutorials.tableviews"
xmlns="org.apache.pivot.wtk">
<Border>
<ScrollPane horizontalScrollBarPolicy="fill">
<TableView bxml:id="tableView">
<columns>
<TableView.Column name="flag" width="20">
<cellRenderer>
<content:TableViewImageCellRenderer/>
</cellRenderer>
</TableView.Column>
<TableView.Column name="nation" width="3*" headerData="Nation"/>
<TableView.Column name="gold" width="1*" headerData="Gold"/>
<TableView.Column name="silver" width="1*" headerData="Silver"/>
<TableView.Column name="bronze" width="1*" headerData="Bronze"/>
<TableView.Column name="total" width="1*" headerData="Total"/>
</columns>
<tableViewSortListeners>
function sortChanged(tableView) {
var tableData = tableView.getTableData();
tableData.setComparator(new org.apache.pivot.wtk.content.TableViewRowComparator(tableView));
}
</tableViewSortListeners>
<!-- Source: http://en.wikipedia.org/wiki/2008_Summer_Olympics_medal_table -->
<tableviews:OlympicStanding nation="China" gold="51" silver="21" bronze="28" flag="@cn.png"/>
<tableviews:OlympicStanding nation="United States" gold="36" silver="38" bronze="36" flag="@us.png"/>
<tableviews:OlympicStanding nation="Russia" gold="23" silver="21" bronze="28" flag="@ru.png"/>
<tableviews:OlympicStanding nation="Great Britain" gold="19" silver="13" bronze="15" flag="@gb.png"/>
<tableviews:OlympicStanding nation="Germany" gold="16" silver="10" bronze="15" flag="@de.png"/>
<tableviews:OlympicStanding nation="Australia" gold="14" silver="15" bronze="17" flag="@au.png"/>
<tableviews:OlympicStanding nation="South Korea" gold="13" silver="10" bronze="8" flag="@kr.png"/>
<tableviews:OlympicStanding nation="Japan" gold="9" silver="6" bronze="11" flag="@jp.png"/>
<tableviews:OlympicStanding nation="Italy" gold="8" silver="10" bronze="10" flag="@it.png"/>
<tableviews:OlympicStanding nation="France" gold="7" silver="16" bronze="17" flag="@fr.png"/>
</TableView>
<columnHeader>
<TableViewHeader tableView="$tableView" sortMode="single_column"/>
</columnHeader>
</ScrollPane>
</Border>
</Window>
Like the previous example, this one also supports sorting, using the same logic as the JSON version. The only other major difference between this example and the previous is the use of relative-width columns in the table view. The "n*" notation used here is identical to that used by the TablePane container discussed earlier.
Next: Tree Views