📄 bicomponent.html
字号:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><!--
Generated using api.website.xsl version 2003-07-17
-->
<head>
<META http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>BiComponent</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link type="text/css" rel="stylesheet" href="api.css"><script type="text/javascript">
function showDerivedClasses() {
var ul = document.getElementById("api-derived-classes");
var lis = ul.childNodes;
var l = lis.length;
for (var i = 1; i < l; i++)
lis[i].style.display = "";
lis[0].style.display = "none";
}
</script></head>
<body>
<h1 id="BiComponent">BiComponent</h1>
<p>This is the core visual class.</p>
<p>This class extends
<code><a href="BiEventTarget.html">BiEventTarget</a></code>
and therefore all methods and fields available for
<code><a href="BiEventTarget.html">BiEventTarget</a></code>
are also available for <code>BiComponent</code>.</p>
<ul class="partial-class-tree">
<li><code><a href="BiObject.html">BiObject</a></code><ul>
<li><code><a href="BiEventTarget.html">BiEventTarget</a></code><ul><li><code>BiComponent</code><ul id="api-derived-classes"><li><code><a href="javascript:showDerivedClasses()">Show derived classes</a></code></li><li style="display:none"><code><a href="BiAbstractChartBase.html">BiAbstractChartBase</a></code></li><li style="display:none"><code><a href="BiAbstractChartSectionBase.html">BiAbstractChartSectionBase</a></code></li><li style="display:none"><code><a href="BiAbstractGrid.html">BiAbstractGrid</a></code></li><li style="display:none"><code><a href="BiApplicationWindow.html">BiApplicationWindow</a></code></li><li style="display:none"><code><a href="BiChartAreaBase.html">BiChartAreaBase</a></code></li><li style="display:none"><code><a href="BiChartCategoryAxisBase.html">BiChartCategoryAxisBase</a></code></li><li style="display:none"><code><a href="BiChartGridLines.html">BiChartGridLines</a></code></li><li style="display:none"><code><a href="BiChartGridLinesBase.html">BiChartGridLinesBase</a></code></li><li style="display:none"><code><a href="BiChartLegend.html">BiChartLegend</a></code></li><li style="display:none"><code><a href="BiChartValueAxisBase.html">BiChartValueAxisBase</a></code></li><li style="display:none"><code><a href="BiComboBox.html">BiComboBox</a></code></li><li style="display:none"><code><a href="BiDesktopPane.html">BiDesktopPane</a></code></li><li style="display:none"><code><a href="BiGauge.html">BiGauge</a></code></li><li style="display:none"><code><a href="BiGaugeLabels.html">BiGaugeLabels</a></code></li><li style="display:none"><code><a href="BiGaugeMajorTicks.html">BiGaugeMajorTicks</a></code></li><li style="display:none"><code><a href="BiGaugeMinorTicks.html">BiGaugeMinorTicks</a></code></li><li style="display:none"><code><a href="BiGaugeNeedle.html">BiGaugeNeedle</a></code></li><li style="display:none"><code><a href="BiGaugePlate.html">BiGaugePlate</a></code></li><li style="display:none"><code><a href="BiGaugeSection.html">BiGaugeSection</a></code></li><li style="display:none"><code><a href="BiGraphBase.html">BiGraphBase</a></code></li><li style="display:none"><code><a href="BiGridHeaders.html">BiGridHeaders</a></code></li><li style="display:none"><code><a href="BiGridRowHeaders.html">BiGridRowHeaders</a></code></li><li style="display:none"><code><a href="BiGroupBox.html">BiGroupBox</a></code></li><li style="display:none"><code><a href="BiIframe.html">BiIframe</a></code></li><li style="display:none"><code><a href="BiImage.html">BiImage</a></code></li><li style="display:none"><code><a href="BiInlineComponent.html">BiInlineComponent</a></code></li><li style="display:none"><code><a href="BiLabel.html">BiLabel</a></code></li><li style="display:none"><code><a href="BiList.html">BiList</a></code></li><li style="display:none"><code><a href="BiMenuBar.html">BiMenuBar</a></code></li><li style="display:none"><code><a href="BiMoveHandle.html">BiMoveHandle</a></code></li><li style="display:none"><code><a href="BiOptionPane.html">BiOptionPane</a></code></li><li style="display:none"><code><a href="BiProgressBar.html">BiProgressBar</a></code></li><li style="display:none"><code><a href="BiResizeHandle.html">BiResizeHandle</a></code></li><li style="display:none"><code><a href="BiSlider.html">BiSlider</a></code></li><li style="display:none"><code><a href="BiSpinner.html">BiSpinner</a></code></li><li style="display:none"><code><a href="BiSplitPane.html">BiSplitPane</a></code></li><li style="display:none"><code><a href="BiStatusBar.html">BiStatusBar</a></code></li><li style="display:none"><code><a href="BiTabPage.html">BiTabPage</a></code></li><li style="display:none"><code><a href="BiTabPane.html">BiTabPane</a></code></li><li style="display:none"><code><a href="BiTextField.html">BiTextField</a></code></li><li style="display:none"><code><a href="BiToolBar.html">BiToolBar</a></code></li><li style="display:none"><code><a href="BiToolBarSeparator.html">BiToolBarSeparator</a></code></li><li style="display:none"><code><a href="BiTreeView.html">BiTreeView</a></code></li><li style="display:none"><code><a href="BiTreeViewDragHeaderMarker.html">BiTreeViewDragHeaderMarker</a></code></li><li style="display:none"><code><a href="BiWindow.html">BiWindow</a></code></li><li style="display:none"><code><a href="BiWizardPane.html">BiWizardPane</a></code></li></ul></li></ul></li></ul>
</li>
</ul>
<h2>Constructor</h2>
<p><code>
new BiComponent([<span class="methodArgument">name</span>])</code></p>
<h3>Parameters</h3>
<table>
<thead>
<tr>
<td>Name</td>
<td>Type</td>
<td class="optional-header">Optional</td>
<td>Default</td>
<td>Descripton</td>
</tr>
</thead>
<tbody>
<tr>
<td><code>name</code></td>
<td><code class="type">String</code></td>
<td class="optional-column"><img src="check.png" alt="checked"></td>
<td></td>
<td>
The argument is optional and can be used to describe the component.
</td>
</tr>
</tbody>
</table>
<h2>Properties</h2>
<table>
<thead>
<tr>
<td>Name</td>
<td>Type</td>
<td class="get-header">get</td>
<td class="set-header">set</td>
<td>Descripton</td>
</tr>
</thead>
<tbody>
<tr>
<td><a name="accessKey"></a><code>accessKey</code></td>
<td><code class="type">String</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>
The key, in combination with the Alt key, that will activate the
componet.
</td>
</tr>
<tr>
<td><a name="anonymous"></a><code>anonymous</code></td>
<td><code class="type">Boolean</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>
An anonymous component is not included in the default object
model (<code><a href="#children">children</a></code>, <code><a href="#firstChild">firstChild</a></code>,
<code><a href="#lastChild">lastChild</a></code>, <code><a href="#nextSibling">nextSibling</a></code>, <code><a href="#previousSibling">previousSibling</a></code>
nor <code><a href="#parent">parent</a></code>).
</td>
</tr>
<tr>
<td><a name="backColor"></a><code>backColor</code></td>
<td><code class="type">String</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>The background color name</td>
</tr>
<tr>
<td><a name="backgroundImage"></a><code>backgroundImage</code></td>
<td><code class="type">String</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>The location of the an image file to use as background image</td>
</tr>
<tr>
<td><a name="border"></a><code>border</code></td>
<td><code class="type"><code><a href="BiBorder.html">BiBorder</a></code></code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>The border property describes how to paint the border on the component</td>
</tr>
<tr>
<td><a name="bottom"></a><code>bottom</code></td>
<td><code class="type">Number</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>
The bottom position relative to the parent inner edge. When using
bottom a <code><a href="#height">height</a></code> must also be set. When using get the
return value is always a number representing the pixel value.
</td>
</tr>
<tr>
<td><a name="canFocus"></a><code>canFocus</code></td>
<td><code class="type">Boolean</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>
Whether the component can take focus. To be able to be focusable
the component must be <code><a href="#enabled">enabled</a></code> and have a
<code><a href="#tabIndex">tabIndex</a></code> greater than or equal to 0.
</td>
</tr>
<tr>
<td><a name="canSelect"></a><code>canSelect</code></td>
<td><code class="type">Boolean</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>Whether textual content is selectable</td>
</tr>
<tr>
<td><a name="children"></a><code>children</code></td>
<td><code class="type"><code><a href="BiComponent.html">BiComponent</a></code>[]</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>The components added to the current component</td>
</tr>
<tr>
<td><a name="clientHeight"></a><code>clientHeight</code></td>
<td><code class="type">Number</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>The height inside possible borders and scrollbar</td>
</tr>
<tr>
<td><a name="clientLeft"></a><code>clientLeft</code></td>
<td><code class="type">Number</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>The left position
of the component relative to the browser window view port</td>
</tr>
<tr>
<td><a name="clientTop"></a><code>clientTop</code></td>
<td><code class="type">Number</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>The top position
of the component relative to the browser window view port</td>
</tr>
<tr>
<td><a name="clientWidth"></a><code>clientWidth</code></td>
<td><code class="type">Number</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>The width inside possible borders and scrollbar</td>
</tr>
<tr>
<td><a name="command"></a><code>command</code></td>
<td><code class="type"><code><a href="BiCommand.html">BiCommand</a></code></code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>
Commands are used to make more than one component trigger the
same action. Commands alos synchronize different properties on
the components using the command. BiComponent only synchronizes
the <code><a href="#enabled">enabled</a></code> property with the command. Sub classes
that have a value property usually synchronizes that as well.
</td>
</tr>
<tr>
<td><a name="containsFocus"></a><code>containsFocus</code></td>
<td><code class="type">Boolean</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>Whether the component or any of its descendants has focus</td>
</tr>
<tr>
<td><a name="contextMenu"></a><code>contextMenu</code></td>
<td><code class="type"><code><a href="BiMenu.html">BiMenu</a></code></code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>
If set then this is the menu that will be shown
when the user right clicks (or uses some othe UI mechanism) to bring up
a context menu. Set this to <code>null</code> when no contex menu
is desired.
</td>
</tr>
<tr>
<td><a name="created"></a><code>created</code></td>
<td><code class="type">Boolean</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>
This becomes true when the HTML element representing the
component gets created. From a pure UI perspective this can be
seen as when there is a visual representation created and available
on the screen.
</td>
</tr>
<tr>
<td><a name="cssClassname"></a><code>cssClassname</code></td>
<td><code class="type">String</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>The CSS class name for the element representing the component.
This should be used with caution since in some cases this might give unrespected results.</td>
</tr>
<tr>
<td><a name="cursor"></a><code>cursor</code></td>
<td><code class="type">String</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>The name of the cursos to show when the mouse pointer is over
the component. This is any valid CSS2 cursor name. [Need to list these as well as the IE6 specific]</td>
</tr>
<tr>
<td><a name="enabled"></a><code>enabled</code></td>
<td><code class="type">Boolean</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>
Whether the component is enabled or not. When this is changed the
component fires the <code><a href="#enabledchanged">enabledchanged</a></code> event.
A disabled component cannot recieve focus.
</td>
</tr>
<tr>
<td><a name="firstChild"></a><code>firstChild</code></td>
<td><code class="type"><code><a href="BiComponent.html">BiComponent</a></code></code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>
Returns the first child component. If the current component has
no children then this returns <code>null</code>.
</td>
</tr>
<tr>
<td><a name="focused"></a><code>focused</code></td>
<td><code class="type">Boolean</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>
If the component can be focused then this makes the component
focused (if set to <code>true</code>). If the component was focused
and this is set to <code>false</code> then the component is blurred.
Changing this fires the <code><a href="#focus">focus</a></code>
and <code><a href="#blur">blur</a></code> events (depending on the
previous state).<br>
<br>
A disabled component cannot recieve focus.<br>
<br>
To be able to recieve focus the <code><a href="#tabIndex">tabIndex</a></code>
must be greater or equal to 0.
</td>
</tr>
<tr>
<td><a name="foreColor"></a><code>foreColor</code></td>
<td><code class="type">String</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>The foreground color name</td>
</tr>
<tr>
<td><a name="height"></a><code>height</code></td>
<td><code class="type">Number</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>
The height of the component. When using get the return value is
always a number representing the pixel value.
</td>
</tr>
<tr>
<td><a name="hideFocus"></a><code>hideFocus</code></td>
<td><code class="type">Boolean</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"><img src="check.png" alt="checked"></td>
<td>Whether to hide the
dotted outline that the OS usually draws around focused components.</td>
</tr>
<tr>
<td><a name="insetBottom"></a><code>insetBottom</code></td>
<td><code class="type">Number</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>Border bottom width plus scroll bar if any.</td>
</tr>
<tr>
<td><a name="insetLeft"></a><code>insetLeft</code></td>
<td><code class="type">Number</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>Border left width plus scroll bar if any.</td>
</tr>
<tr>
<td><a name="insetRight"></a><code>insetRight</code></td>
<td><code class="type">Number</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>Border right width plus scroll bar if any.</td>
</tr>
<tr>
<td><a name="insetTop"></a><code>insetTop</code></td>
<td><code class="type">Number</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>Border top width plus scroll bar if any.</td>
</tr>
<tr>
<td><a name="isEnabled"></a><code>isEnabled</code></td>
<td><code class="type">Boolean</code></td>
<td class="get-column"><img src="check.png" alt="checked"></td>
<td class="set-column"></td>
<td>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -