HtmlBasedComponent"

From Documentation
 
(7 intermediate revisions by 2 users not shown)
Line 10: Line 10:
 
A skeletal implementation for HTML based components. It simplifies to implement methods common to HTML based components.
 
A skeletal implementation for HTML based components. It simplifies to implement methods common to HTML based components.
  
−
=Example=
 
  
−
N/A
+
=Supported Events=
  
−
=Supported events=
+
{| class='wikitable' | width="100%"
−
 
 
−
{| border="1" | width="100%"
 
 
! <center>Name</center>
 
! <center>Name</center>
 
! <center>Event Type</center>
 
! <center>Event Type</center>
 
|-
 
|-
−
| <center><tt>onDrop</tt></center>
+
| <center><code>onDrop</code></center>
−
|<javadoc>org.zkoss.zk.ui.event.DropEvent</javadoc>
+
| '''Event:''' <javadoc>org.zkoss.zk.ui.event.DropEvent</javadoc>
 +
Denotes a user has dropped the dragged target to a component.
 
|-
 
|-
−
| <center><tt>onClick</tt></center>
+
| <center><code>onClick</code></center>
−
| <javadoc> org.zkoss.zk.ui.event.MouseEvent</javadoc>
+
| '''Event:''' <javadoc> org.zkoss.zk.ui.event.MouseEvent</javadoc>
 +
 
 +
Denotes a user has clicked a component.
 
|-
 
|-
−
| <center><tt>onDoubleClick</tt></center>
+
| <center><code>onDoubleClick</code></center>
−
| <javadoc> org.zkoss.zk.ui.event.MouseEvent</javadoc>
+
| '''Event:''' <javadoc> org.zkoss.zk.ui.event.MouseEvent</javadoc>
 +
Denotes a user has double-clicked a component.
 
|-
 
|-
−
| <center><tt>onRightClick</tt></center>
+
| <center><code>onRightClick</code></center>
−
|<javadoc> org.zkoss.zk.ui.event.MouseEvent</javadoc>
+
| '''Event:''' <javadoc> org.zkoss.zk.ui.event.MouseEvent</javadoc>
 +
Denotes a user has right-clicked a component.
 
|-
 
|-
−
| <center><tt>onMove</tt></center>
+
| <center><code>onMouseOver</code></center>
−
|<javadoc> org.zkoss.zk.ui.event.MoveEvent</javadoc>
+
| '''Event:''' <javadoc> org.zkoss.zk.ui.event.MoveEvent</javadoc>
 +
{{versionSince| 5.0.3}} Denotes a user has hovered over the component.
 
|-
 
|-
−
| <center><tt>onSize</tt></center>
+
| <center><code>onMouseOut</code></center>
−
|<javadoc> org.zkoss.zk.ui.event.SizeEvent</javadoc>
+
| '''Event:''' <javadoc> org.zkoss.zk.ui.event.MoveEvent</javadoc>
 +
{{versionSince| 5.0.3}} Denotes a user has moved out a component.
 
|-
 
|-
−
| <center><tt>onMouseOver</tt></center>
+
| <center><code>onOK </code></center>
−
|<javadoc> org.zkoss.zk.ui.event.MoveEvent</javadoc>
+
| '''Event:''' <javadoc>org.zkoss.zk.ui.event.KeyEvent</javadoc>
 +
 
 +
Denotes a user has pressed the '''ENTER''' key.
 +
 
 
|-
 
|-
−
| <center><tt>onMouseOut</tt></center>
+
| <center><code>onCancel </code></center>
−
|<javadoc> org.zkoss.zk.ui.event.MoveEvent</javadoc>
+
| '''Event:''' <javadoc>org.zkoss.zk.ui.event.KeyEvent</javadoc>
 +
 
 +
Denotes a user has pressed the '''ESC''' key.
 +
 
 
|-
 
|-
−
| <center><tt>onZIndex</tt></center>
+
| <center><code>onCtrlKey</code></center>
−
|<javadoc> org.zkoss.zk.ui.event.ZIndexEvent</javadoc>
+
| '''Event:''' <javadoc>org.zkoss.zk.ui.event.KeyEvent</javadoc>
 +
 
 +
Denotes a user has pressed a special key, such as PgUp, Home, and a key combined with the Ctrl or Alt key. Refer to the <code>ctrlKeys</code> Property section below for details.
 
|-
 
|-
−
| <center><tt>onOK</tt></center>
+
| <center><code>onAfterSize</code></center>
−
|<javadoc> org.zkoss.zk.ui.event.KeyEvent</javadoc>
+
| '''Event:''' <javadoc>org.zkoss.zk.ui.event.AfterSizeEvent</javadoc>
 +
It's fired after
 +
* a user resizes a sizable component in a browser
 +
* a component calculates its size in a browser
 
|-
 
|-
−
| <center><tt>onCacnel</tt></center>
+
| <center><code>onCreate</code></center>
−
|<javadoc> org.zkoss.zk.ui.event.KeyEvent</javadoc>
+
| '''Event:''' <javadoc>org.zkoss.zk.ui.event.CreateEvent</javadoc>
−
|-
 
−
| <center><tt>onCtrlKey</tt></center>
 
−
|<javadoc> org.zkoss.zk.ui.event.KeyEvent</javadoc>
 
 
|}
 
|}
  
Line 61: Line 73:
 
  *ALL
 
  *ALL
  
−
=Use cases=
 
−
 
−
{| border='1px' | width="100%"
 
−
! Version !! Description !! Example Location
 
−
|-
 
−
| &nbsp;
 
−
| &nbsp;
 
−
| &nbsp;
 
−
|}
 
  
 
=Version History=
 
=Version History=
  
−
{| border='1px' | width="100%"
+
{| class='wikitable' | width="100%"
 
! Version !! Date !! Content
 
! Version !! Date !! Content
 
|-
 
|-

Latest revision as of 02:48, 10 June 2022


DocumentationZK Component ReferenceBase ComponentsHtmlBasedComponent
HtmlBasedComponent

Html Based Component

Employment/Purpose

A skeletal implementation for HTML based components. It simplifies to implement methods common to HTML based components.


Supported Events

Name
Event Type
onDrop
 Event: DropEvent

Denotes a user has dropped the dragged target to a component.

onClick
 Event: MouseEvent

Denotes a user has clicked a component.

onDoubleClick
 Event: MouseEvent

Denotes a user has double-clicked a component.

onRightClick
 Event: MouseEvent

Denotes a user has right-clicked a component.

onMouseOver
 Event: MoveEvent

Since 5.0.3 Denotes a user has hovered over the component.

onMouseOut
 Event: MoveEvent

Since 5.0.3 Denotes a user has moved out a component.

onOK
Event: KeyEvent

Denotes a user has pressed the ENTER key.

onCancel
Event: KeyEvent

Denotes a user has pressed the ESC key.

onCtrlKey
 Event: KeyEvent

Denotes a user has pressed a special key, such as PgUp, Home, and a key combined with the Ctrl or Alt key. Refer to the ctrlKeys Property section below for details.

onAfterSize
 Event: AfterSizeEvent

It's fired after

  • a user resizes a sizable component in a browser
  • a component calculates its size in a browser
onCreate
 Event: CreateEvent

Supported Children

*ALL


Version History

Version Date Content
5.0.3 June 2010 The onMouseOver and onMouseOut events are supported.



Last Update : 2022/06/10

Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License.


Retrieved from "https://www.zkoss.org/_w/index.php?title=ZK_Component_Reference/Base_Components/HtmlBasedComponent&oldid=54538"