Customize Row and Column Titles"
From Documentation
m (→ZUML Example) |
m |
||
Line 3: | Line 3: | ||
__TOC__ | __TOC__ | ||
− | |||
==Scenario== | ==Scenario== | ||
− | + | ZK Spreadsheet can set customize title by <javadoc method="setColumntitles(java.util.Map)">org.zkoss.zss.ui.Spreadsheet</javadoc> or <javadoc method="setRowtitles(java.util.Map)">org.zkoss.zss.ui.Spreadsheet</javadoc> | |
− | ===ZUML | + | ===ZUML=== |
<source lang="xml" high="4,7"> | <source lang="xml" high="4,7"> | ||
Line 26: | Line 25: | ||
</source> | </source> | ||
− | ===Current title=== | + | ===Composer=== |
+ | ====Current title==== | ||
We can use onHeaderClick, onHeaderRightClick or onHeaderDoubleClick to get current header that user clicked, in here, we use onHeaderDoubleClick as a example. | We can use onHeaderClick, onHeaderRightClick or onHeaderDoubleClick to get current header that user clicked, in here, we use onHeaderDoubleClick as a example. | ||
Line 63: | Line 63: | ||
[[File:ZKSsEss_Spreadsheet_HeaderTitle_DClick.png]] | [[File:ZKSsEss_Spreadsheet_HeaderTitle_DClick.png]] | ||
− | ===Edit title=== | + | ====Edit title==== |
We can change column title when use click '''Enter''' | We can change column title when use click '''Enter''' | ||
<source lang="java" high="3,6,8"> | <source lang="java" high="3,6,8"> | ||
Line 83: | Line 83: | ||
[[File:ZKSsEss_Spreadsheet_HeaderTitle_Result.png]] | [[File:ZKSsEss_Spreadsheet_HeaderTitle_Result.png]] | ||
− | ===Cancel editing=== | + | ====Cancel editing==== |
Close popup when user click '''Esc''' | Close popup when user click '''Esc''' | ||
<source lang="java" high="2"> | <source lang="java" high="2"> |
Revision as of 09:41, 22 November 2010
Scenario
ZK Spreadsheet can set customize 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 current header that user clicked, in here, we use onHeaderDoubleClick as a example.
1. we can get clicked header type by
HeaderMouseEvent.getType();
2. we can get 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 column title when use click 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();
}
Cancel editing
Close popup when user click Esc
public void onCancel$titleEditor() {
inputTitlePopup.close();
}
Version History
Version | Date | Content |
---|---|---|
All source code listed in this book is at Github.