Clip Alignment Interactions
Different sizes of regions and clips, the use of registration points, and the
setting of a region's fit
attribute can create many different outcomes for the
placement and scaling of a visual clip. The following sections describe what
happens when a region uses a certain fit
value and you assign the clip to the
region using a registration point that has a certain regAlign
value. These layout
attributes are described in the following sections:
The Active Area
In the following sections, the term "active area" refers to the part of the region
that the clip can appear in based on its registration point alignment. The
following figure illustrates this by showing a registration point placed near
the upper-right corner of a region. If the clip uses the topRight
alignment
value, the dotted lines show the active area of the region into which the clip
can expand or contract according to the region's fit
attribute.
Active Area in a Region
fit="hidden"
When a region uses the default fit="hidden"
value, the clip is placed on the
registration point according to its regAlign
attribute. Any part of the clip that
extends past the region is cropped. If an edge of the clip does not extend to the
boundary of the active area, the remaining space is filled with the region's
background color.
fit="fill"
The following table explains how a clip scales when the region has a fit="fill"
attribute and the clip uses a registration point with a certain regAlign
value.
Interaction of fit="fill" with regAlign Attribute Values
Value |
Action |
topLeft |
Scale the clip's height and width independently so that the clip just touches the bottom and right edges of its active area. |
topMid |
Scale the clip's height and width independently so that the clip just touches the bottom edge of its active area, and the nearest (to the registration point) of the left or right edges of the active area. |
topRight |
Scale the clip's height and width independently so that the clip just touches the bottom and left edges of its active area. |
midLeft |
Scale the clip's height and width independently so that the clip just touches the nearest (to the registration point) of the top or bottom edges of the box, and touches the right edge of its active area. |
center |
Scale the clip's height and width independently so that the content just touches the nearest (to the registration point) of the top or bottom edges of the active area, and touches the nearest (to the registration point) of the left or right edges of its active area. |
midRight |
Scale the clip's height and width independently so that the clip just touches the nearest (to the registration point) of the top or bottom edges of the box, and touches the left edge of its active area. |
bottomLeft |
Scale the clip's height and width independently so that the clip just touches the top and right edges of its active area. |
bottomMid |
Scale the clip's height and width independently so that the clip just touches the top edge of the box, and the nearest (to the registration point) of the left or right edges of its active area. |
bottomRight |
Scale the clip's height and width independently so that the clip just touches the top and left edges of its active area. |
fit="meet"
The following table explains how a clip scales when the region has a fit="meet"
attribute and the clip uses a registration point with a certain regAlign
value
Interaction of fit="meet" with regAlign Attribute Values
Value |
Action |
topLeft |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches the right or bottom edge of the active area while none of the clip is cropped. |
topMid |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches at least one of the left, right, or bottom edges while none of the clip is cropped. |
topRight |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches the left or bottom edge of the active area while none of the clip is cropped. |
midLeft |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches at least one of the top, right, or bottom edges while none of the clip is cropped. |
center |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches at least one of the top, left, right, or bottom edges while none of the clip is cropped. |
midRight |
Scale the clip's height and width while maintaining its aspect ratio so that the content just touches at least one of the top, left, or bottom edges while none of the clip is cropped. |
bottomLeft |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches the top or right edge of the active area while none of the clip is cropped. |
bottomMid |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches at least one of the top, left, or right edges while none of the clip is cropped. |
bottomRight |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches the top or left edge of the box while none of the clip is cropped. |
fit="slice"
The following table explains how a clip scales when the region has a fit="slice"
attribute and the clip uses a registration point with a certain regAlign
value.
Interaction of fit="slice" with regAlign Attribute Values
Value |
Action |
topLeft |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches the right or bottom edge of the active area, whichever requires the most scaling. Any part of the clip that extends beyond the bounds of the region is cropped. |
topMid |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches the left, right, or bottom edge of its active area, whichever requires the most scaling. Any part of the clip that extends beyond the bounds of the region is cropped. Cropping will occur on up to two sides of the region. |
topRight |
Scale the visual clip's height and width while maintaining its aspect ratio so that the clip just touches the left or bottom edge of the active area, whichever requires the most scaling. Any part of the clip that extends beyond the bounds of the region is cropped. |
midLeft |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches the top, right, or bottom edge of the active area, whichever requires the most scaling. Any content that extends beyond the bounds of the region is cropped. Cropping will occur on up to two sides of the region. |
center |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches the top, left, right, or bottom edge of the active area, whichever requires the most scaling. Any part of the clip that extends beyond the bounds of the region is cropped. Cropping will occur on up to three sides of the region. |
midRight |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches the top, left, or bottom edge of the active area, whichever requires the largest scaling. Any part of the clip that extends beyond the bounds of the region is cropped. Cropping will occur on up to two sides of the region. |
bottomLeft |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches the top or right edge of the active area, whichever requires the most scaling. Any part of the clip that extends beyond the bounds of the region is cropped. |
bottomMid |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches the top, left, or right edge of the active area, whichever requires the most scaling. Any content that extends beyond the bounds of the region is cropped. Cropping will occur on up to two sides of the region. |
bottomRight |
Scale the clip's height and width while maintaining its aspect ratio so that the clip just touches the top or left edge of the active area, whichever requires the most scaling. Any part of the clip that extends beyond the bounds of the region is cropped. |
fit="scroll"
When a region uses a fit="scroll"
attribute, the clip is placed on the registration
point according to the regAlign
attribute. If any part of the clip extends
outside the active area, scrollbars allow the viewer to scroll the remaining clip
area into view. If an edge of the clip does not extend to the boundary of the
active area, the remaining space is filled with the region's background color.
|
©2002 RealNetworks, Inc. All rights reserved.
For more information, visit RealNetworks
Click here if the Table of Contents frame is not visible at the left side of your screen.
|