游戏机制解析课：多层界面坐标变换与逆序还原——三层界面变换的九点往返（案例24）

界面元素的坐标常相对于父级。把多层偏移直接相加，容易漏掉缩放对下层位置的影响；逐层变换并按相反顺序还原，可以定位坐标差异出现在哪里。

本篇给出一份完整且可重复的虚构游戏记录。先读清规则，再尝试自行推演输入，最后逐项对照中间状态。不同作品可以选择不同约定，只有在相同前提下才能比较结果；不要只看最终数字相同就认为过程正确。

约定与原始记录

从最内层开始，三层变换都采用先按横纵倍率缩放，再加本层偏移。倍率均为正整数，没有旋转和裁切。将九个局部点变到世界坐标，再从最外层逆序减偏移并除倍率。

每层[sx,sy,tx,ty]，从内向外 [[1, 4, -7, -4], [4, 3, -5, 4], [3, 3, -4, -7]] [[-1, 0], [3, 2], [-3, -1], [-8, 4], [-4, 3], [-6, -1], [-9, -7], [8, -7], [4, -3]]

逐步计算

局部点[-1, 0]经过三层依次为[[-8, -4], [-37, -8], [-115, -31]]；逆序还原依次为[['-37', '-8'], ['-8', '-4'], ['-1', '0']]，最终回到原点坐标。

局部点[3, 2]经过三层依次为[[-4, 4], [-21, 16], [-67, 41]]；逆序还原依次为[['-21', '16'], ['-4', '4'], ['3', '2']]，最终回到原点坐标。

局部点[-3, -1]经过三层依次为[[-10, -8], [-45, -20], [-139, -67]]；逆序还原依次为[['-45', '-20'], ['-10', '-8'], ['-3', '-1']]，最终回到原点坐标。

局部点[-8, 4]经过三层依次为[[-15, 12], [-65, 40], [-199, 113]]；逆序还原依次为[['-65', '40'], ['-15', '12'], ['-8', '4']]，最终回到原点坐标。

局部点[-4, 3]经过三层依次为[[-11, 8], [-49, 28], [-151, 77]]；逆序还原依次为[['-49', '28'], ['-11', '8'], ['-4', '3']]，最终回到原点坐标。

局部点[-6, -1]经过三层依次为[[-13, -8], [-57, -20], [-175, -67]]；逆序还原依次为[['-57', '-20'], ['-13', '-8'], ['-6', '-1']]，最终回到原点坐标。

局部点[-9, -7]经过三层依次为[[-16, -32], [-69, -92], [-211, -283]]；逆序还原依次为[['-69', '-92'], ['-16', '-32'], ['-9', '-7']]，最终回到原点坐标。

局部点[8, -7]经过三层依次为[[1, -32], [-1, -92], [-7, -283]]；逆序还原依次为[['-1', '-92'], ['1', '-32'], ['8', '-7']]，最终回到原点坐标。

局部点[4, -3]经过三层依次为[[-3, -16], [-17, -44], [-55, -139]]；逆序还原依次为[['-17', '-44'], ['-3', '-16'], ['4', '-3']]，最终回到原点坐标。

九个点均能逆序恢复，缩放和偏移的先后次序保持一致。

复核方法与适用范围

把三层变换合并为每个轴的一条一次式，核对正向结果；再用逆序还原检查最初坐标。每一层的偏移属于该层输出坐标，不能跳过层级先统一相加。

例子只关注点的位置，不涉及字体像素取整、图像滤波或点击区域大小。实际界面在某层取整后可能不可精确逆转，本例保留精确数值，目的是把变换顺序问题与渲染误差分开观察。

练习时可以只改动一个输入，再观察哪一步首次出现差异。对等于门槛、重复请求、空集合和最后一步分别留一份记录；如果发现异常，应先回到单位、顺序和边界约定，避免用额外补偿掩盖前面已经发生的错误。