2016-11-01 6 views
4

QtクイックQMLを使用して半透明の矩形が必要ですが、1辺のみが丸いコーナーが必要です。QT 5.7 QMLクイック半透明矩形(角が丸みを帯びている)

これは、私が欲しい矩形の一種です。それが見えない場合、おそらく2つの矩形、つまり角が丸いものと矩形が重なっているだけです。ただし、オーバーラップがより暗くなるので、透明では機能しません。

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

誰もが考えていますか?

+0

私はそれを行う唯一の方法は 'キャンバス' – folibis

答えて

4

あなたは、単一の丸い長方形の角をカットする(performance docsを参照)clippingを使用することができます。

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

関連する問題