QML ファイルのアンカーに問題があります。このコードは機能していません。anchors.left がテキストに適用されず、テキストがチェックボックスにとどまります。
Checkbox{
objectName: "chkRemenber"
id: chkRemenber
}
Text {
id: labRemenber
text: "REMENBER"
anchors.left: chkRemenber.right
}
ただし、独自のコンポーネントを使用せずに画像を使用すると、機能します。テキストは chkRemenber2 の左側にあります。
Image {
id: chkRemenber2
width: 30
height: 30
source: "../checkbox_on.png"
fillMode: Image.PreserveAspectFit;
MouseArea {
anchors.fill: parent
onClicked: toggle()
}
}
Text {
id: labRemenber2
text: "REMENBER"
anchors.left: chkRemenber2.right
}
これは私のチェックボックスのコードです:
import QtQuick 1.0
Rectangle {
id: container
property bool pressed: false
property string src: "../checkbox_off.png"
function toggle (){
if (container.state == "on")
container.state = "off";
else
container.state = "on";
console.log("CLICK ! " + container.state);
}
Image {
id: checkBoxImg
width: 30
height: 30
source: src
fillMode: Image.PreserveAspectFit;
MouseArea {
anchors.fill: parent
onClicked: toggle()
}
}
states: [
State {
name: "on"
PropertyChanges { target: checkBoxImg; source: "../checkbox_on.png" }
PropertyChanges { target: container; pressed: true }
},
State {
name: "off"
PropertyChanges { target: checkBoxImg; source: "../checkbox_off.png" }
PropertyChanges { target: container; pressed: false }
}
]
}