|
@@ -23,28 +23,26 @@ Box nodes are always rendered, even if they do not have a texture assigned to th
|
|
|
|
|
|
## Slice-9 texturing
|
|
## Slice-9 texturing
|
|
|
|
|
|
-GUIs often feature elements that are context sensitive in regard to their size: panels and dialogs that need to be resized to fit the containing content. These will cause problems as soon as you apply texturing to the scaled node.
|
|
|
|
|
|
+GUIs often feature elements that are context sensitive in regard to their size: panels and dialogs that need to be resized to fit the containing content. These may cause visual problems when you apply texturing to the resized node.
|
|
|
|
|
|
-Normally, the engine scales the texture to fit the boundaries of a box node, but it is possible to limit what parts of the texture that should scale with the slice-9 feature:
|
|
|
|
|
|
+Normally, the engine scales the texture to fit the boundaries of a box node, but by defining slice-9 edge areas it is possible to limit what parts of the texture that should scale:
|
|
|
|
|
|
{srcset="images/gui-box/[email protected] 2x"}
|
|
{srcset="images/gui-box/[email protected] 2x"}
|
|
|
|
|
|
-The *Slice9* box node property is used to control how the texture is sliced:
|
|
|
|
-
|
|
|
|
-The slicing is controlled by 4 numbers that specify the number of pixels that will not be regularly scaled, on each side of the texture.
|
|
|
|
|
|
+The *Slice9* box node consists of 4 numbers that specify the number of pixels for the left, top, right and bottom margin that should not be regularly scaled:
|
|
|
|
|
|
{srcset="images/gui-box/[email protected] 2x"}
|
|
{srcset="images/gui-box/[email protected] 2x"}
|
|
|
|
|
|
- The margins are set clockwise, starting on the left edge:
|
|
|
|
|
|
+The margins are set clockwise, starting on the left edge:
|
|
|
|
|
|
{srcset="images/gui-box/[email protected] 2x"}
|
|
{srcset="images/gui-box/[email protected] 2x"}
|
|
|
|
|
|
-- Corner segments are never scaled, only moved.
|
|
|
|
-- Edge segments are scaled along one axis only.
|
|
|
|
-- The central texture area is scaled regularly, horizontally and vertically as needed.
|
|
|
|
|
|
+- Corner segments are never scaled.
|
|
|
|
+- Edge segments are scaled along a sigle axis. The left and right edge segments are scaled vertically. The top and bottom edge segments are scaled horizontally.
|
|
|
|
+- The central texture area is scaled horizontally and vertically as needed.
|
|
|
|
|
|
Due to the way mipmapping works in the renderer, scaling of texture segments can sometimes exhibit artifacts. This happens when you _scale down_ segments below the original texture size. The renderer then selects a lower resolution mipmap for the segment, resulting in visual artifacts.
|
|
Due to the way mipmapping works in the renderer, scaling of texture segments can sometimes exhibit artifacts. This happens when you _scale down_ segments below the original texture size. The renderer then selects a lower resolution mipmap for the segment, resulting in visual artifacts.
|
|
|
|
|
|
{srcset="images/gui-box/[email protected] 2x"}
|
|
{srcset="images/gui-box/[email protected] 2x"}
|
|
|
|
|
|
-It is easy to avoid this problem, but it implies some constraints to the source texture: simply make sure that the texture's segments that will be scaled are small enough never to be scaled down, only up.
|
|
|
|
|
|
+To avoid this problem, make sure that the texture's segments that will be scaled are small enough never to be scaled down, only up.
|