An abstract base class that responds to focus by animating to the focused view and sizing itself to that view. A subclass of this view may be used to override the default look and feel of the focus indicator.
By default, a class called focusoverlay is
used which highlights the corners of the focused view and adds a
bounce animation when it arrives at the focusable view. To override
this behavior and use your own class, set
canvas.focusclass to the name of a class that extends
basefocusview. To make it so there is no
visual focus indicator set the canvas'
focusclass attribute to null.
In some browsers you need to click on the application before keyboard navigation will work. You can experiment with the example below. Tab and shift-tab will move the focus between components. Space will activate the checkbox. Return or space will activate the button.
Example 57. Custom Focus Indicator
<canvas height="120">
<class name="myfocusclass" extends="basefocusview">
<view bgcolor="blue" y="${parent.height+1}" height="2" width="${parent.width}"/>
</class>
<attribute name="focusclass" value="myfocusclass" type="string"/>
<view x="20" y="20">
<simplelayout spacing="10"/>
<checkbox>I would like fries with that</checkbox>
<checkbox>Rush delivery</checkbox>
<button>Order</button>
</view>
</canvas>
| Name (CSS property) | Type (tag) | Type (js) | Default | Category |
|---|---|---|---|---|
offset
|
expression | any | 5 | read/write |
| the offset is used by the brackets to 'offset' themselves from the bounding rect of the focusoverlay. The bounce effect is achieved by animating this parameter | ||||
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 <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