View Full Version : how to draw a circle using qml

1st August 2011, 05:54

i want to draw a circle or ellipse using qml.is it possible to draw?
i saw samegame example in that they took .png to balloons.but in my app,i want to draw so that i can add text to middle of balloon.

thanks in advance.


1st August 2011, 11:19
Circle is simple:

Rectangle {
width: parent.width<parent.height?parent.width:parent.height
height: width
color: "red"
border.color: "black"
border.width: 1
radius: width*0.5
Text {
anchor.fill = parent
color: "red"
text: "Boom"
Ellipse may be more tricky.
Note that you can use graphics (like in samegame example) and text on top of it (like in my example above).

8th August 2016, 12:48
Ya it is possible. For example I will create a circle button.

Button {
x:680 (Example value)
y:-150 (Example value)
text: "Circle button"
style: ButtonStyle {
background: Rectangle {
implicitWidth: 140 (Example val)
implicitHeight: width
border.width: control.activeFocus ? 1 : 2
border.color: "white"
radius: width * 0.5
gradient: Gradient {
GradientStop { position: 5 ; color: control.pressed ? "#eee" : "red" } (Animate)
GradientStop { position: 6 ; color: control.pressed ? "#ccc" : "red" }