WoW:SetTexCoord Transformations: Difference between revisions

{{uitech}}, formatting...
m (→‎SetTexCoord Math with Matrices: Fixed algorithm/examples due to tex coordinate origin update)
({{uitech}}, formatting...)
Line 1: Line 1:
{{tocright}}
{{uitech}}{{tocright}}
 
 
The SetTexCoord method in WoW's Texture API can be used for some fairly complex display tasks, including drawing bits of circles, rotating images on screen, etc.  Unless one has experience in computer graphics programming, the way in which this can be used might not be evident, so this document hopes to explain how Textures work and how you can use them.
The SetTexCoord method in WoW's Texture API can be used for some fairly complex display tasks, including drawing bits of circles, rotating images on screen, etc.  Unless one has experience in computer graphics programming, the way in which this can be used might not be evident, so this document hopes to explain how Textures work and how you can use them.


= Basic Concepts =
= Basic Concepts =
Line 22: Line 25:


The SetTexCoord method is used to provide the image coordinates of each of these four corner points.
The SetTexCoord method is used to provide the image coordinates of each of these four corner points.


=Coordinate Transformations=
=Coordinate Transformations=
==Overview==
==Overview==
The way in which the image coordinates map to Texture frame coordinates, and then onto Screen Coordinates (or vice versa) is through a series of <b>Affine Transformations</b>, these are transformations which preserve linearity (points which lay on a line before the transformation, continue to lay on a line after it), and distance ratios (the ratio of distance between two pairs of points on a line before the transformation remain the same afterwards). In the 2D world affine transformations are any combination of:
The way in which the image coordinates map to Texture frame coordinates, and then onto Screen Coordinates (or vice versa) is through a series of <b>Affine Transformations</b>, these are transformations which preserve linearity (points which lay on a line before the transformation, continue to lay on a line after it), and distance ratios (the ratio of distance between two pairs of points on a line before the transformation remain the same afterwards). In the 2D world affine transformations are any combination of:
Line 46: Line 51:


With the inverse in hand, we can determine what the image coordinates are going to be by passing in the four corner Texture coordinate values (0,1) (0,0) (1,1) (1,0) in turn and passing the resulting set of coordinates into SetTexCoord as the UL, LL, UR, and LR image coordinates.
With the inverse in hand, we can determine what the image coordinates are going to be by passing in the four corner Texture coordinate values (0,1) (0,0) (1,1) (1,0) in turn and passing the resulting set of coordinates into SetTexCoord as the UL, LL, UR, and LR image coordinates.


=The Math=
=The Math=
==Overview of Matrix Multiplication==
==Overview of Matrix Multiplication==


Line 148: Line 155:
  local angle = math.rad(90);
  local angle = math.rad(90);
  setCoords(texture, cos(angle), sin(angle), 0, -sin(angle), cos(angle), 0);
  setCoords(texture, cos(angle), sin(angle), 0, -sin(angle), cos(angle), 0);
[[Category:UI Technical Details]]
Anonymous user