Hi komarios,
there are several ways to achieve this, highly depending on the use case.
The easiest way i can think of is creating an image with round corners and then creating a button using the image as background.
Button.qml
import QtQuick 1.1
import VPlay 1.0
Item {
id: button
property alias text: buttonText.text
property alias textColor: buttonText.color
property alias textSize: buttonText.font.pixelSize
signal clicked
width: 100
height: 60
// you could also use a MultiresolutionImage here to improve performance and memory usage on low end devices
Image {
source: "img/round_corners.png"
anchors.fill: parent
}
Text {
id: buttonText
anchors.centerIn: parent
font.pixelSize: 14
color: "#f5b68a"
}
MouseArea {
anchors.fill: parent
onClicked: button.clicked()
}
}
Then you can use the button like this:
main.qml
import VPlay 1.0
import QtQuick 1.1
GameWindow {
activeScene: scene
width: 960
height: 640
Scene {
id: scene
width: 480
height: 320
Button {
anchors.centerIn: parent
text: "click me!"
onClicked: console.debug("aw yeah, don't stop clicking me")
}
}
}
What kind of buttons were you thinking of? Like Chrisu, with “random” colors? A possible downside of his solution is that the edges are not transparent (if needed), but have the background color instead.
Cheers,
Alex
