应用镜像变换来翻转/反射 QML 控件

Posted 2023-03-25

【中文标题】应用镜像变换来翻转/反射 QML 控件

【英文标题】：Applying a mirror transformation to flip/reflect a QML Control

【发布时间】：2021-09-19 23:07:08

【问题描述】：

我可以在 QML 中水平翻转/反射形状项目吗？例如;我有以下形状：

我可以水平翻转/反射它来产生吗：

我知道我可以编辑我的 QML 代码以不同的方式绘制线条，但如果可能的话，只使用 QML 动画或其他东西来翻转它会更简单。

Shape 
    id: annotationHLine;
    anchors.left: annotationShp.right;
    anchors.top: annotationShp.top;
    anchors.topMargin: annotationShp.height * 0.5;

    ShapePath 
        strokeWidth: 2;
        strokeColor: "Green";
        fillColor: "transparent";
        startX: -slant; startY: 0;
        PathLine  x: relativeTargetX*0.5; y: 0 
        PathLine  x: relativeTargetX; y: relativeTargetY 
    

【参考方案1】：

你可以使用变换和缩放

transform: Scale xScale: -1 

【参考方案2】：

可以，只需将水平镜像变换矩阵设置为形状：

transform: Matrix4x4 
      matrix: Qt.matrix4x4(-1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
    

编辑：

x 的位置并没有真正改变，它仍然是一样的，只是对象现在被转换渲染了。您可以通过在矩阵顶部堆叠翻译来弥补这一点：

transform: [
  Matrix4x4 
    matrix: Qt.matrix4x4(-1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
  ,
  Translate 
    x: annotationHLine.width
  
]

编辑 2：

实际上，您可以将翻译合并到原始矩阵中以简化一些事情：

transform:  Matrix4x4 
    matrix: Qt.matrix4x4( -1, 0, 0, but.width, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)
  

【讨论】：

谢谢，这有效，但是它改变了组件的 x 位置。有什么想法如何在翻转组件的同时保留组件位置？

技术上没有错，但是Scale.xScale 变体更简单，同时还能发挥作用。