Auf dieser Seite

RectangleShape QML Type

Ein ausgefülltes Rechteck mit optionalem Rahmen. Mehr...

Import Statement: import QtQuick.Shapes.DesignHelpers 6.12
Since: QtQuick 6.10

Eigenschaften

Ausführliche Beschreibung

RectangleShape wird verwendet, um Bereiche mit einer Volltonfarbe oder Farbverläufen zu füllen und einen rechteckigen Rahmen zu erstellen.

Jedes „Rectangle“-Element wird entweder mit einer einheitlichen Füllfarbe, die über die Eigenschaft „ fillColor “ festgelegt wird, oder mit einem Farbverlauf gezeichnet, der mithilfe eines der Untertypen „ ShapeGradient “ definiert und über die Eigenschaft „gradient“ festgelegt wird. Wenn sowohl eine Farbe als auch ein Farbverlauf angegeben sind, wird der Farbverlauf verwendet.

Einem Rechteck kann ein optionaler Rahmen mit eigener Farbe und Dicke hinzugefügt werden, indem die Eigenschaften „ strokeColor “ und „ strokeWidth “ festgelegt werden. Durch Setzen der Farbe auf „ transparent “ wird ein Rahmen ohne Füllfarbe erstellt.

Abgerundete Rechtecke lassen sich mithilfe der Eigenschaft „ radius “ zeichnen. Der Radius kann zudem für jede Ecke separat festgelegt werden. Zusätzlich kann „ bevel “ auf jede Ecke angewendet werden, um diese scharf abzuschneiden.

Der Standardwert von „ QtQuick.Shapes::Shape::preferredRendererType “ für „RectangleShape“ ist „ Shape.CurveRenderer “.

Anwendungsbeispiel

    RectangleShape {
        id: rectangleShape
        anchors.centerIn: parent
        radius: 0
        topLeftRadius: 30
        bottomRightRadius: 30
        bevel: true
        joinStyle: ShapePath.MiterJoin
        fillColor: "#3ad23c"
        strokeColor: "transparent"
        visible: false
    }

Grünes Rechteck mit abgerundeten Ecken

Eigenschaftsdokumentation

bevel : bool

Diese Eigenschaft legt fest, ob die Ecken des Rechtecks abgeschrägt sind.

Wird sie auf „ false “ gesetzt, führt dies je nach den Werten der einzelnen „ radius “-Eigenschaften entweder zu scharfen oder zu abgerundeten Ecken.

Diese Eigenschaft kann durch die einzelnen „bevel“-Eigenschaften überschrieben werden.

    RectangleShape {
        id: rectangleShape
        anchors.centerIn: parent
        radius: 0
        topLeftRadius: 30
        bottomRightRadius: 30
        bevel: true
        joinStyle: ShapePath.MiterJoin
        fillColor: "#3ad23c"
        strokeColor: "transparent"
        visible: false
    }

Rechteck mit abgeschrägten Ecken oben links und unten rechts

Siehe auch „ topLeftBevel“ , „ topRightBevel “, „ bottomLeftBevel “ und „ bottomRightBevel “.

borderMode : enumeration

Die Eigenschaft „borderMode“ legt fest, wo der Rahmen entlang der Kante des Rechtecks gezeichnet wird.

KonstanteBeschreibung
RectangleShape.InsideDer Rahmen wird entlang der Innenkante des Elements gezeichnet und hat keinen Einfluss auf die Breite des Elements.

Dies ist der Standardwert.

KonstanteBeschreibung
RectangleShape.MiddleDer Rahmen wird über den Rand des Elements gezeichnet und hat keinen Einfluss auf die Breite des Elements.
RectangleShape.OutsideDer Rahmen wird entlang der Außenkante des Elements gezeichnet und vergrößert die Elementbreite um den Wert von „ strokeWidth “.

Siehe auch „ strokeWidth “.

bottomLeftBevel : bool

bottomRightBevel : bool

topLeftBevel : bool

topRightBevel : bool

Wenn diese Eigenschaften gesetzt sind, definieren sie die einzelnen Eckenabschrägungen. Werden sie auf „ false “ gesetzt, führt dies je nach den Werten der einzelnen „ radius “-Eigenschaften entweder zu scharfen oder abgerundeten Ecken. Werden sie auf „ true “ gesetzt, führt dies zu abgeschrägten Ecken. Sind sie nicht gesetzt, wird stattdessen der Wert von „ bevel “ verwendet.

Diese Eigenschaften sind standardmäßig nicht festgelegt. Weisen Sie ihnen „ undefined “ zu, um sie in den nicht festgelegten Zustand zurückzusetzen.

Im folgenden Beispiel ist „ bottomRightBevel “ auf „true“ gesetzt:

    RectangleShape {
        id: rectangleShape
        anchors.centerIn: parent
        topLeftRadius: 0
        bottomRightBevel: true
        joinStyle: ShapePath.MiterJoin
    }

Rechteckumriss mit drei abgerundeten Ecken und einer abgeschrägten Ecke

Siehe auch „ bevel “.

bottomLeftRadius : real

bottomRightRadius : real

topLeftRadius : real

topRightRadius : real

Wenn diese Eigenschaften festgelegt sind, definieren sie die einzelnen Eckenradien. Ein Wert von Null bedeutet, dass die Ecke scharf ist, während ein positiver Wert bedeutet, dass sie abgerundet ist. Sind sie nicht festgelegt, wird stattdessen der Wert von „ radius “ verwendet.

Diese Eigenschaften sind standardmäßig nicht gesetzt. Weisen Sie ihnen „ undefined “ zu, um sie wieder in den nicht gesetzten Zustand zu versetzen.

Im folgenden Beispiel ist „ radius “ auf „ 10 “ und „ topLeftRadius “ auf „ 0 “ gesetzt:

    RectangleShape {
        id: rectangleShape
        anchors.centerIn: parent
        topLeftRadius: 0
        bottomRightBevel: true
        joinStyle: ShapePath.MiterJoin
    }

Rechteckumriss mit drei abgerundeten Ecken und einer abgeschrägten Ecke

Siehe auch „ radius “.

capStyle : enumeration

Diese Eigenschaft legt fest, wie die Endpunkte von Linien gezeichnet werden. Der Standardwert ist „ ShapePath.SquareCap “.

KonstanteBeschreibung
ShapePath.FlatCapEin quadratisches Linienende, das den Endpunkt der Linie nicht überdeckt.
ShapePath.SquareCapEin eckiges Linienende, das den Endpunkt überdeckt und um die Hälfte der Linienbreite darüber hinausragt.
ShapePath.RoundCapEin abgerundetes Linienende.

dashOffset : real

Diese Eigenschaft definiert den Startpunkt des Strichmusters, gemessen in den Einheiten, die zur Festlegung des Strichmusters verwendet werden.

Der Standardwert lautet „ 0 “.

Siehe auch ` QPen::setDashOffset()`.

dashPattern : list<real>

Diese Eigenschaft definiert das Strichmuster, wenn „ strokeStyle “ auf „ ShapePath.DashLine“ gesetzt ist. Das Muster muss als gerade Anzahl positiver Einträge angegeben werden, wobei die Einträge 1, 3, 5… die Striche und 2, 4, 6… die Leerzeichen darstellen. Das Muster wird in Einheiten der Stiftbreite angegeben.

Der Standardwert ist (4, 2), was bedeutet, dass ein Strich von 4 * strokeWidth Pixeln auf ein Leerzeichen von 2 * strokeWidth Pixeln folgt.

Siehe auch QPen::setDashPattern().

drawBottom : bool [since 6.11]

Diese Eigenschaft legt fest, ob der untere Rahmen gezeichnet wird.

Der Standardwert lautet „ true “.

Diese Eigenschaft wurde in Qt 6.11 eingeführt.

drawLeft : bool [since 6.11]

Diese Eigenschaft legt fest, ob der linke Rand gezeichnet wird.

Der Standardwert lautet „ true “.

Diese Eigenschaft wurde in Qt 6.11 eingeführt.

drawRight : bool [since 6.11]

Diese Eigenschaft gibt an, ob der rechte Rand gezeichnet wird.

Der Standardwert lautet „ true “.

Diese Eigenschaft wurde in Qt 6.11 eingeführt.

drawTop : bool [since 6.11]

Diese Eigenschaft legt fest, ob der obere Rand gezeichnet wird.

Der Standardwert lautet „ true “.

Diese Eigenschaft wurde in Qt 6.11 eingeführt.

fillColor : color

Diese Eigenschaft legt die Füllfarbe fest.

Wenn sie auf „ transparent “ gesetzt ist, erfolgt keine Füllung.

Der Standardwert ist „ "white" “.

Hinweis: Wenn „ fillGradient “ auf einen anderen Wert als „ null “ gesetzt ist, wird dieser anstelle von „ fillColor “ verwendet.

fillGradient : ShapeGradient

Der „fillGradient“ der Füllfarbe des Rechtecks.

Standardmäßig ist kein „fillGradient“ aktiviert und der Wert ist null. In diesem Fall wird die Füllung mit einer Volltonfarbe basierend auf dem Wert von „ fillColor “ vorgenommen.

Wenn dieser Wert festgelegt ist, wird „ fillColor “ ignoriert und die Füllung erfolgt unter Verwendung eines der Untertypen von „ ShapeGradient “.

Hinweis: Der Typ „ Gradient “ kann hier nicht verwendet werden. Verwenden Sie stattdessen lieber einen der erweiterten Untertypen, wie z. B. „ LinearGradient “.

fillRule : enumeration

Diese Eigenschaft enthält die Füllregel. Der Standardwert lautet „ ShapePath.OddEvenFill “. Eine Erläuterung zu Füllregeln finden Sie unter QPainterPath::setFillRule().

KonstanteBeschreibung
ShapePath.OddEvenFillFüllregel „ungerade-gerade“.
ShapePath.WindingFillFüllregel mit einer Windungszahl ungleich Null.

joinStyle : enumeration

Diese Eigenschaft legt fest, wie Verbindungslinien zwischen zwei verbundenen Linien gezeichnet werden. Der Standardwert ist „ ShapePath.BevelJoin “.

KonstanteBeschreibung
ShapePath.MiterJoinDie Außenkanten der Linien werden so verlängert, dass sie sich in einem Winkel treffen, und dieser Bereich wird ausgefüllt.
ShapePath.BevelJoinDie dreieckige Aussparung zwischen den beiden Linien wird ausgefüllt.
ShapePath.RoundJoinEin Kreisbogen zwischen den beiden Linien wird ausgefüllt.

radius : real

Diese Eigenschaft legt den Eckenradius fest, der zur Definition eines abgerundeten Rechtecks verwendet wird.

Ist „radius“ ein positiver Wert, wird der Rechteckpfad als abgerundetes Rechteck definiert, andernfalls als normales Rechteck.

Diese Eigenschaft kann durch die einzelnen Eckenradius-Eigenschaften überschrieben werden.

Der Standardwert ist „ 10 “.

Siehe auch „ topLeftRadius“ , „ topRightRadius “, „ bottomLeftRadius “ und „ bottomRightRadius “.

strokeColor : color

Diese Eigenschaft legt die Farbe der Kontur fest.

Wenn sie auf „ transparent “ gesetzt ist, erfolgt keine Konturierung.

Der Standardwert ist „ "black" “.

strokeStyle : enumeration

Diese Eigenschaft legt den Stil der Linienführung fest. Der Standardwert ist „ ShapePath.SolidLine“.

KonstanteBeschreibung
ShapePath.SolidLineEine durchgezogene Linie.
ShapePath.DashLineDurch einige Pixel voneinander getrennte Striche.

strokeWidth : real

Diese Eigenschaft legt die Strichbreite fest.

Wird ein negativer Wert festgelegt, erfolgt keine Konturzeichnung.

Der Standardwert lautet „ 1 “.

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.