Displays an image in the browser.
The ImageView can be used to efficiently display images in the browser. It includes a built in support for a number of features that can improve your page load time if you use a lot of images including a image loading cache and automatic support for CSS spriting.
Note that there are actually many controls that will natively include images using an icon property name.
Defined in: image.js
- SproutCore 1.0
- Fields borrowed from SC.View:
- acceptsFirstResponder, acceptsMultitouch, ariaHidden, ariaRole, attributeBindings, autoMixins, backgroundColor, childViewLayout, childViewLayoutOptions, childViews, childViewsNeedLayout, classNameBindings, classNames, concatenatedProperties, createdByParent, designMode, displayProperties, enabledState, firstKeyView, hasLayout, hasTouch, hasVisibility, isBuildingIn, isBuildingOut, isChildViewLayoutLive, isEnabled, isFixedHeight, isFixedPosition, isFixedSize, isFixedWidth, isKeyResponder, isTextSelectable, isView, isVisible, lastKeyView, layerLocationNeedsUpdate, layerNeedsUpdate, layout, modeAdjust, nextKeyView, page, pane, parentView, previousKeyView, renderDelegateName, shouldInheritCursor, shouldInheritEnabled, tagName, themeName, toolTip, touchBoundary, transitionAdjust, transitionAdjustOptions, transitionHide, transitionHideOptions, transitionIn, transitionInOptions, transitionOut, transitionOutOptions, transitionShow, transitionShowOptions, useStaticLayout
- Fields borrowed from SC.Responder:
- hasFirstResponder, isFirstResponder, responderContext
- Fields borrowed from SC.Object:
- isDestroyed, isObject, nextProperty, object, property, target, toInvalidate
- Fields borrowed from SC.Observable:
- Fields borrowed from SC.Control:
- controlSize, errorLabel, fieldKey, fieldLabel, isActive, isControl, isSelected
YES, this image can load in the background. Otherwise, it is treated
as a foreground image. If the image is not visible on screen, it will
always be treated as a background image.
- Default value:
Current load status of the image.
This status changes as an image is loaded from the server. If spriting
is used, this will always be loaded. Must be one of the following
YES, image view will use the
SC.imageQueue to control loading. This
setting is generally preferred.
- Default value:
A url or CSS class name.
This is the image you want the view to display. It should be either a
url or css class name. You can also set the content and
contentValueKey properties to have this value extracted
If you want to use CSS spriting, set this value to a CSS class name. If you need to use multiple class names to set your icon, separate them by spaces.
Note that if you provide a URL, it must contain at least one '/' as this is how we autodetect URLs.
Class Method Detail
YES if the passed value looks like an URL and not a CSS class
Instance Method Detail
Called when the element is attached to the document.
If the image uses static layout (i.e. we don't know the frame beforehand),
then this method will call
updateLayerIfNeeded in order to adjust the inner
frame of the image according to its rendered frame.
Called when the element is created.
If the view is using a canvas element, then we can not draw to the canvas
until it exists. This method will call
updateLayerIfNeeded in order to draw
to the canvas.
Will be one of the following constants:
The canvas element performs better than the img element since we can update the canvas image without causing browser reflow. As an additional benefit, canvas images are less easily copied, which is generally in line with acting as an 'application'.
- SproutCore 1.5