Rectangle QML Type

塗りつぶされた矩形を描画します。詳細...

• 継承したメンバを含む、すべてのメンバの一覧

プロパティ

• color : color
• gradient : Gradient (since Qt Quick Ultralite 2.7)
• radius : real

詳細説明

矩形アイテムは、領域をベタ塗りやグラデーションで塗りつぶすために使用します。

外観

各矩形アイテムは、color プロパティを使用して指定された塗りつぶしのベタ色、またはGradient タイプを使用して定義され、gradient プロパティを使用して設定されたグラデーションを使用して描画されます。色とグラデーションの両方が指定されている場合は、グラデーションが使用されます。

また、radius プロパティを使用して丸みを帯びた長方形を作成することもできます。

使用例

次の例では、Rectangle アイテムを使用して、角を丸めた正方形を作成しています。

import QtQuick 2.15

Rectangle {
    width: 100
    height: 100
    color: "red"
    radius: 10
}

Imageも参照して ください。

プロパティのドキュメント

color : color

このプロパティは、矩形を塗りつぶすために使用される色を保持する。

デフォルトの色は白です。

次の例では、16進数と名前付きカラー表記で色を指定した矩形を示しています：

Rectangle {
    color: "#00B000"
    width: 80; height: 80
}

Rectangle {
    color: "steelblue"
    y: 100; width: 80; height: 80
}

gradient : Gradient [since Qt Quick Ultralite 2.7]

矩形を塗りつぶすために使用するグラデーション。

このプロパティは、単純な垂直または水平のグラデーションを構築することができます。

Rectangle {
    y: 0; width: 80; height: 80
    color: "lightsteelblue"
}

Rectangle {
    y: 100; width: 80; height: 80
    gradient: Gradient {
        GradientStop { position: 0.0; color: "lightsteelblue" }
        GradientStop { position: 1.0; color: "blue" }
    }
}

Rectangle {
    y: 200; width: 80; height: 80
    rotation: 90
    gradient: Gradient {
        GradientStop { position: 0.0; color: "lightsteelblue" }
        GradientStop { position: 1.0; color: "blue" }
    }
}

グラデーションと色の両方が指定された場合、グラデーションが使用されます。

このプロパティはQt Quick Ultralite 2.7で導入されました。

color とGradientも参照してください 。

radius : real

このプロパティは、丸みを帯びた矩形を描画するために使用される角の半径を保持する。

半径が0でない場合、矩形は丸みを帯びた矩形として描かれ、そうでない場合は通常の矩形として描かれる。現在のところ、異なる角に異なる半径を指定する方法はありません。

特定の Qt ライセンスの下で利用可能です。
詳細はこちら。