Customize Row and Column Titles"
From Documentation
m (correct highlight (via JWB)) |
|||
| (9 intermediate revisions by 2 users not shown) | |||
| Line 1: | Line 1: | ||
{{ZKSpreadsheetEssentialsPageHeader}} | {{ZKSpreadsheetEssentialsPageHeader}} | ||
| + | |||
| + | {{Deprecated|url=http://books.zkoss.org/wiki/ZK_Spreadsheet_Essentials}} | ||
| + | |||
__TOC__ | __TOC__ | ||
| Line 9: | Line 12: | ||
===ZUML=== | ===ZUML=== | ||
| − | <source lang="xml" | + | <source lang="xml" highlight="4,7"> |
<zk> | <zk> | ||
<div height="100%" width="100%" apply="demo.HeaderTitleComposer"> | <div height="100%" width="100%" apply="demo.HeaderTitleComposer"> | ||
| Line 28: | Line 31: | ||
====Current Title==== | ====Current Title==== | ||
| − | We can use onHeaderClick, onHeaderRightClick or onHeaderDoubleClick to get current header that user clicked | + | We can use onHeaderClick, onHeaderRightClick or onHeaderDoubleClick to get the current header that user clicked. Here, we use onHeaderDoubleClick as an example. |
1. we can get clicked header type by | 1. we can get clicked header type by | ||
| − | <source lang="java" | + | <source lang="java" highlight="1"> |
HeaderMouseEvent.getType(); | HeaderMouseEvent.getType(); | ||
</source> | </source> | ||
| − | 2. we can get header title by | + | 2. we can get the header title by |
| − | <source lang="java" | + | <source lang="java" highlight="5,7"> |
public void onHeaderDoubleClick$spreadsheet(HeaderMouseEvent event) { | public void onHeaderDoubleClick$spreadsheet(HeaderMouseEvent event) { | ||
String currentTitle = null; | String currentTitle = null; | ||
| Line 49: | Line 52: | ||
3. Then, set the current header title to textbox and open the popup. | 3. Then, set the current header title to textbox and open the popup. | ||
| − | <source lang="java" | + | <source lang="java" highlight="6,7"> |
Popup inputTitlePopup; | Popup inputTitlePopup; | ||
Textbox titleEditor; | Textbox titleEditor; | ||
| Line 64: | Line 67: | ||
====Edit Title==== | ====Edit Title==== | ||
| − | We can change column title when | + | We can change the column title when the user clicks '''Enter''' |
| − | <source lang="java" | + | <source lang="java" highlight="3,6,8"> |
public void onOK$titleEditor() { | public void onOK$titleEditor() { | ||
HashMap<Integer, String> titles = new HashMap<Integer, String>(); | HashMap<Integer, String> titles = new HashMap<Integer, String>(); | ||
| Line 84: | Line 87: | ||
====Cancel Editing==== | ====Cancel Editing==== | ||
| − | Close popup when user click '''Esc''' | + | Close popup when the user click '''Esc''' |
| − | <source lang="java" | + | <source lang="java" highlight="2"> |
public void onCancel$titleEditor() { | public void onCancel$titleEditor() { | ||
inputTitlePopup.close(); | inputTitlePopup.close(); | ||
| Line 91: | Line 94: | ||
</source> | </source> | ||
| − | View complete source of ZUML [https://code.google.com/p/zkbooks/source/browse/trunk/zssessentials/examples/WebContent/config/headerTitle.zul headerTitle.zul] | + | View the complete source of ZUML [https://code.google.com/p/zkbooks/source/browse/trunk/zssessentials/examples/WebContent/config/headerTitle.zul headerTitle.zul] |
| − | View complete source of composer [https://code.google.com/p/zkbooks/source/browse/trunk/zssessentials/examples/src/org/zkoss/zssessentials/config/HeaderTitleComposer.java HeaderTitleComposer.java] | + | View the complete source of composer [https://code.google.com/p/zkbooks/source/browse/trunk/zssessentials/examples/src/org/zkoss/zssessentials/config/HeaderTitleComposer.java HeaderTitleComposer.java] |
=Version History= | =Version History= | ||
Latest revision as of 12:55, 19 January 2022
This article is out of date, please refer to http://books.zkoss.org/wiki/ZK_Spreadsheet_Essentials for more up to date information.
Purpose
ZK Spreadsheet can set customized title by Spreadsheet.setColumntitles(Map) or Spreadsheet.setRowtitles(Map)
ZUML
<zk>
<div height="100%" width="100%" apply="demo.HeaderTitleComposer">
<popup id="inputTitlePopup">
<textbox id="titleEditor"/>
</popup>
<div height="3px"></div>
<spreadsheet id="spreadsheet" src="/Untitled"
maxrows="200"
maxcolumns="40"
width="100%"
height="450px"></spreadsheet>
</div>
</zk>
Composer
Current Title
We can use onHeaderClick, onHeaderRightClick or onHeaderDoubleClick to get the current header that user clicked. Here, we use onHeaderDoubleClick as an example.
1. we can get clicked header type by
HeaderMouseEvent.getType();
2. we can get the header title by
public void onHeaderDoubleClick$spreadsheet(HeaderMouseEvent event) {
String currentTitle = null;
int headerType = event.getType();
if (headerType == HeaderEvent.TOP_HEADER) {
currentTitle = spreadsheet.getColumntitle(currentIndex);
} else {
currentTitle = spreadsheet.getRowtitle(currentIndex);
}
...
3. Then, set the current header title to textbox and open the popup.
Popup inputTitlePopup;
Textbox titleEditor;
public void onHeaderDoubleClick$spreadsheet(HeaderMouseEvent event) {
...
inputTitlePopup.open(event.getPageX(), event.getPageY());
titleEditor.setText(currentTitle);
titleEditor.focus();
}
Edit Title
We can change the column title when the user clicks Enter
public void onOK$titleEditor() {
HashMap<Integer, String> titles = new HashMap<Integer, String>();
titles.put(Integer.valueOf(currentIndex), titleEditor.getText());
if (isColumnHeader) {
spreadsheet.setColumntitles(titles);
} else {
spreadsheet.setRowtitles(titles);
}
inputTitlePopup.close();
}
Click Enter to change title
Cancel Editing
Close popup when the user click Esc
public void onCancel$titleEditor() {
inputTitlePopup.close();
}
View the complete source of ZUML headerTitle.zul
View the complete source of composer HeaderTitleComposer.java
Version History
| Version | Date | Content |
|---|---|---|
All source code listed in this book is at Github.