34、JavaFX图形变换与坐标系统详解

JavaFX图形变换与坐标系统详解

1. 组合变换

1.1 剪切变换

剪切值为1.0会产生45度的旋转，大于1.0的值会导致大于45度的旋转，负值会使坐标轴朝相反方向移动。例如：

Rectangle { 
    x: 30
    y: 60 
    width: 100 
    height: 40 
    fill: Color.YELLOW 
    transforms: [ Shear { x: -0.25 } ]
}

这里剪切值 -0.25 使y轴顺时针旋转，沿着原始y轴每移动4个单位，就会沿着负x轴移动1个单位。

1.2 多变换组合

通常可以对一个节点应用多个变换，变换执行顺序如下：
1. 节点的 translateX 、 translateY 、 translateZ 、 layoutX 和 layoutY 变量所隐含的平移。
2. 节点的 rotate 变量所隐含的旋转，旋转围绕步骤1中平移后的节点中心进行。
3. 节点的 scaleX 、 scaleY 和 scaleZ 变量所隐含的缩放，缩放围绕步骤1中平移后的节点中心进行。
4. transforms 变量中的变换，按照它们