1

我在 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 }
    }
]
}
4

1 回答 1

3

我认为由于没有为 Checkbox 组件指定的锚点上的尺寸，QML 引擎不知道如何定位它。试试这些选项。

  • 为 Checkbox 组件指定尺寸（高度、宽度）或锚点
  • 使用“列”或“行”项目，这样您就不必对布局进行微管理。
于 2011-05-27T14:02:59.627 回答