49
edits
→Details
| Line 49: | Line 49: | ||
=== Points and Relative Points === | === Points and Relative Points === | ||
A particular edge or corner of a layout frame is an anchor 'point'. | 1) A particular edge or corner of a layout frame is an anchor 'point'. | ||
* point ([[XML/FRAMEPOINT|FRAMEPOINT]]) | * point ([[XML/FRAMEPOINT|FRAMEPOINT]]) | ||
This defines where in this layout frame that it should be anchored. For example, a value of 'TOPLEFT' refers to the top left corner of the of this layout frame. For an edge, 'LEFT' for example, the center of that edge is considered to be the actual anchor point, if no other anchors additionally overriding the layout frames vertical axis are defined. | |||
The 'relativePoint' defines where, on another layout frame, to place a particular 'point' of the layout frame itself. | 2) The 'relativePoint' defines where, on another layout frame, to place a particular 'point' of the layout frame itself. | ||
* relativePoint ([[XML/FRAMEPOINT|FRAMEPOINT]]) | * relativePoint ([[XML/FRAMEPOINT|FRAMEPOINT]]) | ||
This is the anchor's relative position on the 'relative frame'. By default, the anchor will attach to the same point on the relative frame as defined by 'point'. So, if 'point' is set to 'LEFT', then by default the anchor will also attach to the left side of the relative frame. If 'relativePoint' is set however, it overrides the default behavior. So if 'relativePoint' set to 'RIGHT', then the left side of this layout frame, in this example, will instead anchor to the right side of the relative frame. | |||
3) The 'relativeTo' and 'relativeKey' atributes define which other 'layout frame' this anchor is relative to. | |||
* relativeTo (string) | * relativeTo (string) | ||
* relativeKey (string) | * relativeKey (string) | ||
By default, all layout frames are relative to their parent. If either of these are set, then it overrides the relative layout frame with respect to this anchor point. Different anchors can also have different relative layout frames, such that a texture could automatically stretch across two different other layout frames. | |||
The 'relativeTo' is the global name of a frame to use for the 'relativePoint'. Alternatively, the 'relativeKey' is the name of a runtime Lua variable on this layout frame's parent, that contains a reference to the layout frame to be used for the 'relativePoint'. Using 'parentKey' elsewhere is a way to define these values for 'realtiveKey'. If 'relativeTo' is defined, then 'relativeKey' will be ignored. See the 'parentKey' attribute in [[XML/LayoutFrame]] as one of the many ways to set this value. | The 'relativeTo' is the global name of a frame to use for the 'relativePoint'. Alternatively, the 'relativeKey' is the name of a runtime Lua variable on this layout frame's parent, that contains a reference to the layout frame to be used for the 'relativePoint'. Using 'parentKey' elsewhere is a way to define these values for 'realtiveKey'. If 'relativeTo' is defined, then 'relativeKey' will be ignored. See the 'parentKey' attribute in [[XML/LayoutFrame]] as one of the many ways to set this value. | ||
=== Layouts === | === Layouts === | ||
Layout in printing or computer graphics is concerned with the flow of elements with respect to each other. A layout system is a system for defining that layout. For WoW, flow in layout is defined by frames and anchors, and flow order is established by 'laying out' frames from their creation order from top to bottom, and from parent to child. Frames with the | Layout in printing or computer graphics is concerned with the flow of elements with respect to each other. A layout system is a system for defining that layout. For WoW, flow in layout is defined by frames and anchors, and flow order is established by 'laying out' frames from their creation order from top to bottom, and from parent to child. Frames with the same parent and render z-order, will be rendered from first to last in definition order as well. | ||
<span> | |||
<Frame name="Frame"> | <Frame name="Frame"> | ||
<Frames> | <Frames> | ||
| Line 83: | Line 85: | ||
</Frames> | </Frames> | ||
</Frame> | </Frame> | ||
</span> | |||
This will place the 'Frame2' child at an offset of 10 from the bottom of its parent frame; 'relativeTo' for 'Frame2' is its parent by default. Frame3 will be rendered on top of Frame2 is they overlap. | This will place the 'Frame2' child at an offset of 10 from the bottom of its parent frame; 'relativeTo' for 'Frame2' is its parent by default. Frame3 will be rendered on top of Frame2 is they overlap. | ||