A combobox is a common UI element for
displaying a pop-up list associated with a text field. The selected
text of the combobox is displayed within the text field. This field
is an <inputtext> field if the
editable of the combobox is true
(the default), or a static <text> field if it
is false.
The number of items shown in the combobox can be set using the
shownitems attribute. If there are more items
available than are shown, a scrollbar will be created
automatically.
The list of items in a combobox can be created explicity using the
<textlistitem> tag with assigned
text and value
attributes.
<canvas height="100">
<combobox id="cbox" x="5" y="5" width="130" editable="false">
<textlistitem text="Dark Blue" value="0x000055"/>
<textlistitem text="Turquoise" value="0x66dddd"/>
<textlistitem text="Light Blue" value="0xaaddff"/>
</combobox>
<view x="150" y="5" width="20" height="20" bgcolor="${cbox.value}"/>
</canvas>
A combobox can also be populated by assigning a
datapath to a <textlistitem>.
Also the number of items shown can be set with the
shownitems attribute.
<canvas height="130">
<dataset name="items">
<item value="item1">item one</item>
<item value="item2">item two</item>
<item value="item3">item three</item>
<item value="item4">item four</item>
</dataset>
<combobox x="5" y="5" width="130" shownitems="3" defaulttext="choose one...">
<textlistitem datapath="items:/item" text="$path{'text()'}" value="$path{'@value'}"/>
</combobox>
</canvas>
Finally, a combox can also have custom items in its list by tending
the <listitem> class. An example of this is shown
below:
<canvas height="130">
<class name="mylistitem" extends="listitem" width="100%" height="20">
<attribute name="text" value="type="string"/>
<!-- place a red square in the left hand side of mylistitem -->
<view bgcolor="red" width="10" height="10" x="5" y="5"/>
<!-- constrain the text to the text attribute of listitem -->
<text x="20" text="${classroot.text}" fgcolor="0x4B4B4B">
</text>
</class>
<dataset name="items">
<item value="item1">item one</item>
<item value="item2">item two</item>
<item value="item3">item three</item>
<item value="item4">item four</item>
</dataset>
<combobox x="5" y="5" width="130" editable="false">
<mylistitem datapath="items:/item" text="$path{'text()'}" value="$path{'@value'}"/>
</combobox>
</canvas>
Attributes inherited from <basecombobox>
attachoffset, autoscrollbar, bordersize, dataoption, defaultselection, defaulttext, editable, isopen, itemclassname, min_width, selected, shownitems, spacing, text_width, text_x, text_y, value
Attributes inherited from <baseformitem>
changed, ignoreform, rollbackvalue, submit, submitname, value
Attributes inherited from <basecomponent>
doesenter, enabled, hasdefault, isdefault, style, styleable, text
Attributes inherited from <view>
aaactive, aadescription, aaname, aasilent, aatabindex, align, backgroundrepeat, bgcolor, cachebitmap, capabilities, clickable, clickregion, clip, colortransform, context, contextmenu, cornerradius, cursor, fgcolor, focusable, focustrap, font, fontsize, fontstyle, frame, framesloadratio, hasdirectionallayout, hassetheight, hassetwidth, height, layout, loadratio, mask, opacity, pixellock, playing, proxyurl, resource, resourceheight, resourcewidth, rotation, shadowangle, shadowblurradius, shadowcolor, shadowdistance, showhandcursor, source, stretches, subviews, tintcolor, totalframes, unstretchedheight, unstretchedwidth, usegetbounds, valign, visibility, visible, width, x, xoffset, xscale, y, yoffset, yscale
Attributes inherited from <node>
classroot, cloneManager, data, datapath, defaultplacement, id, ignoreplacement, immediateparent, inited, initstage, name, nodeLevel, options, parent, placement, styleclass, subnodes, transition
Methods
Methods inherited from <basecombobox>
addItem, clearSelection, getItem, getItemAt, getSelection, getText, getValue, removeItem, removeItemAt, select, selectItem, selectItemAt, setDefaultSelection, setItemclassname, setOpen, setText, toggle
Methods inherited from <baseformitem>
commit, destroy, findForm, init, rollback, setChanged, setValue, toXML
Methods inherited from <basecomponent>
acceptValue, doEnterDown, doEnterUp, doSpaceDown, doSpaceUp, presentValue, setStyle, setTint, updateDefault
Methods inherited from <view>
bringToFront, containsPt, getAttributeRelative, getBounds, getColor, getColorTransform, getCurrentTime, getDepthList, getDisplayObject, getID3, getMouse, getNextSelection, getPan, getPrevSelection, getProxyURL, getTotalTime, getVolume, init, isBehind, isInFrontOf, isMouseOver, measureHeight, measureWidth, play, proxyurl, searchSubviews, seek, sendAAEvent, sendBehind, sendInFrontOf, sendToBack, setAccessible, setAttributeRelative, setColor, setColorTransform, setPan, setProxyPolicy, setSource, setVolume, shouldYieldFocus, stop, unload, updateResourceSize
Methods inherited from <node>
animate, applyConstraintMethod, applyData, childOf, completeInstantiation, construct, createChildren, dataBindAttribute, destroy, determinePlacement, getOption, getUID, init, lookupSourceLocator, releaseConstraint, releaseConstraintMethod, searchImmediateSubnodes, searchSubnodes, setOption, setSelected, updateData
Events
Events inherited from <view>
onaddsubview, onbackgroundrepeat, onblur, onclick, onclickable, onclip, oncontext, oncornerradius, ondblclick, onerror, onfocus, onframe, onframesloadratio, ongesture, onheight, onkeydown, onkeyup, onlastframe, onload, onloadratio, onmousedown, onmousedragin, onmousedragout, onmouseout, onmouseover, onmousetrackout, onmousetrackover, onmousetrackup, onmouseup, onmouseupoutside, onopacity, onplay, onplaying, onremovesubview, onshadowangle, onshadowblurradius, onshadowcolor, onshadowdistance, onstop, ontimeout, ontouch, onvisible, onwidth, onx, ony