The <radiogroup> component encloses a list of
<radiobutton>s. It ensures that a single
item is selected at a time. Initially it will select the first item in
a group if none is set to be selected. By default the radio buttons
are spaced vertically.
In the following example, the second radio button is selected. The text
that appears is separate from the value that is represented by each item.
In this example, group1.value is 2.
<canvas height="100">
<radiogroup id="group1">
<radiobutton value="1" text="one"/>
<radiobutton value="2" text="two" selected="true"/>
<radiobutton value="3" text="three"/>
</radiogroup>
</canvas>
You can use radio group with your own layout attribute, by overriding the
<view> layout attribute. The example below uses a wrapping layout
to create two columns of radio buttons. Note that a height must be given to
indicate to the layout where to wrap.
<canvas height="100">
<radiogroup height="60" layout="class:wrappinglayout; axis:y">
<radiobutton value="1" text="one"/>
<radiobutton value="2" text="two"/>
<radiobutton value="3" text="three"/>
<radiobutton value="4" text="four"/>
<radiobutton value="5" text="five"/>
<radiobutton value="6" text="six"/>
</radiogroup>
</canvas>
A radiogroup can contain a set of any <baselistitem>.
To make radio buttons with
a different look and feel, create a subclass of <baselistitem> to use instead
of the <radiobutton> class.
| Name (CSS property) | Type (tag) | Type (js) | Default | Category |
|---|---|---|---|---|
layout
|
expression | any | class: simplelayout; axis: y; spacing:5 | read/write |
| The layout to use for the radiogroup. Note: if you use a different layout, be sure to include the layout library file. | ||||
Attributes inherited from <baselist>
dataoption, defaultselection, itemclassname, multiselect, toggleselected
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 <baselist>
addItem, clearSelection, getItem, getItemAt, getNumItems, getSelection, getText, getValue, moveSelection, removeAllItems, removeItem, removeItemAt, select, selectItem, selectItemAt, selectNext, selectPrev, setHilite
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