import Qt 4.7

Image {
    id: checkbox
    property bool selected
    signal changed
    height: {
        var aspectRatio = sourceSize.height / sourceSize.width
        return checkbox.width * aspectRatio
    }
    width: sourceSize.width
    smooth: true
    states: [
        State {
            name: "checked";
            when: (checkbox.selected == true);

            PropertyChanges { target: checkbox; source: "qrc:/button/checkboxChecked.png" }
        },
        State {
            name: "unchecked";
            when: (checkbox.selected == false);

            PropertyChanges { target: checkbox; source: "qrc:/button/checkbox.png" }
        }
    ]
    MouseArea{
        id: area
        anchors.fill: parent
        onClicked: {
            checkbox.selected = !checkbox.selected
            changed()
        }
    }
}