QT 5.7 QML快速半透明矩形，一側有圓角

Question

我想要一個使用Qt Quick QML的半透明矩形形狀，但只有一側有圓角。

這是我想要的矩形的形狀。如果沒有看到，我可能會重疊2個矩形，一個圓角，一個沒有。但是，這不適用於透明度，因爲重疊會變得更暗。

 ----------| 
/   | 
/   | 
|    | 
|    | 
|    | 
\    | 
    \   | 
    ----------| 

有人有什麼想法嗎？

Answer 1

你可以使用clipping（見performance docs）切斷一個圓角矩形的角落：

import QtQuick 2.5 
import QtQuick.Window 2.2 

Window { 
    width: 300 
    height: 300 
    visible: true 

    Item { 
     width: 100 
     height: 100 
     anchors.centerIn: parent 
     clip: true 

     Rectangle { 
      anchors.fill: parent 
      anchors.rightMargin: -radius 
      radius: 10 
      color: "navajowhite" 
      opacity: 0.5 
     } 
    } 
} 

你也可以使用layers避免交叉透明度問題：

import QtQuick 2.5 
import QtQuick.Window 2.2 

Window { 
    width: 300 
    height: 300 
    visible: true 

    Item { 
     width: 100 
     height: 100 
     opacity: 0.5 
     layer.enabled: true 
     anchors.centerIn: parent 

     Rectangle { 
      color: "navajowhite" 
      radius: 10 
      anchors.fill: parent 
     } 
     Rectangle { 
      color: "navajowhite" 
      anchors.fill: parent 
      anchors.leftMargin: 10 
     } 
    } 
} 

由於由@folibis提到，您也可以使用Canvas，其中已有類似的answer。