plugins/components/CheckBox.qml

0001 /* This file is part of the KDE project
0002  * SPDX-FileCopyrightText: 2012 Dan Leinir Turthra Jensen <admin@leinir.dk>
0003  *
0004  * SPDX-License-Identifier: GPL-2.0-or-later
0005  */
0006
0007 import QtQuick 2.3
0008 import org.krita.sketch 1.0
0009
0010 Item {
0011     id: base;
0012     property bool checked: false;
0013     property alias text: txt.text;
0014     onCheckedChanged: state = checked ? "checked" : "";
0015     // Double-double margins looks odd, but it's to ensure the /icon/ has the right amount of padding
0016     height: Constants.DefaultFontSize + Constants.DefaultMargin * 4;
0017     Image {
0018         id: notCheckedImg;
0019         anchors {
0020             left: parent.left;
0021             top: parent.top;
0022             bottom: parent.bottom;
0023             margins: Constants.DefaultMargin;
0024         }
0025         width: height;
0026         smooth: true;
0027         source: Settings.theme.icon("checkbox-unchecked");
0028     }
0029     Image {
0030         id: checkedImg;
0031         anchors {
0032             left: parent.left;
0033             top: parent.top;
0034             bottom: parent.bottom;
0035             margins: Constants.DefaultMargin;
0036         }
0037         width: height;
0038         smooth: true;
0039         opacity: 0;
0040         source: Settings.theme.icon("checkbox-checked");
0041     }
0042     Label {
0043         id: txt;
0044         anchors {
0045             top: parent.top;
0046             left: notCheckedImg.right;
0047             leftMargin: Constants.DefaultMargin;
0048             right: parent.right;
0049             bottom: parent.bottom;
0050         }
0051     }
0052     MouseArea {
0053         anchors.fill: parent;
0054         onClicked: checked = !checked;
0055     }
0056     states: [
0057         State {
0058             name: "checked";
0059             PropertyChanges { target: notCheckedImg; opacity: 0; }
0060             PropertyChanges { target: checkedImg; opacity: 1; }
0061         }
0062     ]
0063     transitions: [
0064         Transition {
0065             from: "";
0066             to: "checked";
0067             reversible: true;
0068             PropertyAnimation { targets: [notCheckedImg, checkedImg]; properties: "opacity"; duration: Constants.AnimationDuration; }
0069         }
0070     ]
0071 }