• QML出现QML Flow: Cannot specify anchors for items inside Flow. Flow will not function.


    实现的功能大概是这样的:

    1、一个Rectangle主窗口,左上角有一个文本Text

    2、主窗口中有一个Rectangle停靠在主窗口的最右边,高与主窗口相同,宽比主窗口小

    3、定义了一个Flow填充(填满)在停靠的Rectangle中

    4、Flow中有一系列的小Rectangle,按照Qt.TopToBottom排列

    5、点击这些不同颜色的小Rectangle,文字的颜色会改变

    import QtQuick 2.0
    
    //需求:通过Flow布局中的颜色选择器,改变文本的颜色
    Rectangle {
         900;
        height: 900;
        color: "gray";
        id: root;
    
        //文本
        Text {
            id: txt;
            text: qsTr("click to change color");
            font.pixelSize: 24;
            anchors.top: parent.top;
            anchors.topMargin: 8;
            anchors.left: parent.left;
            anchors.leftMargin: 8;
        }
        //函数——改变文本的颜色
        function changeTxtColor(clr) {//参数不需要指定类型
            txt.color = clr;
        }
        //Rectangle里面放Flow
        Rectangle {
            id: flowParent;
             300;
            anchors.top: parent.top;
            anchors.topMargin: 10;
            anchors.right: parent.right;
            anchors.rightMargin: 0;
            anchors.bottom: parent.bottom;
            anchors.bottomMargin: 20;
            border.color: "red";
            border. 5;
            property real subHeight: flowParent.height / 7;//不要放在Flow里面,否则得到的是Flow根据实际情况所放的组件的高度来设置的
    
            //Flow布局
            Flow {
                id: flow;
                //设置Flow(父组件)在root中的位置
                spacing: 0;
                //设置排列方式
                flow: Flow.TopToBottom;
    
                //Flow布局下的所有颜色选择组件——放7个组件
                Rectangle {
                    id: p1;
                    Width: flowParent.width;
                    height: flowParent.subHeight;
                    //设置边框——如何为自定义的空间设置?
                    border.5;
                    color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
                    MouseArea {
                        anchors.fill: parent;
                        onClicked: changeTxtColor(p1.color);
                    }
                }
                Rectangle {
                    id: p2;
                    Width: flowParent.width;
                    height: flowParent.subHeight;
              anchors.left: p1.right;//<------------------------------------------------------------------------注意这一句!!!!!!
    //设置边框——如何为自定义的空间设置? border.5; color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0); MouseArea { anchors.fill: parent; onClicked: changeTxtColor(p2.color); } } Rectangle { id: p3; Width: flowParent.width; height: flowParent.subHeight; //设置边框——如何为自定义的空间设置? border.5; color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0); MouseArea { anchors.fill: parent; onClicked: changeTxtColor(p3.color); } } Rectangle { id: p4; Width: flowParent.width; height: flowParent.subHeight; //设置边框——如何为自定义的空间设置? border.5; color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0); MouseArea { anchors.fill: parent; onClicked: changeTxtColor(p4.color); } } Rectangle { id: p5; Width: flowParent.width; height: flowParent.subHeight; //设置边框——如何为自定义的空间设置? border.5; color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0); MouseArea { anchors.fill: parent; onClicked: changeTxtColor(p5.color); } } Rectangle { id: p6; Width: flowParent.width; height: flowParent.subHeight; //设置边框——如何为自定义的空间设置? border.5; color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0); MouseArea { anchors.fill: parent; onClicked: changeTxtColor(p6.color); } } Rectangle { id: p7; Width: flowParent.width; height: flowParent.subHeight; //设置边框——如何为自定义的空间设置? border.5; color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0); MouseArea { anchors.fill: parent; onClicked: changeTxtColor(p7.color); } } } } }

    运行出现:QML Flow: Cannot specify anchors for items inside Flow. Flow will not function. 

    解决方法:

    上述错误说明Flow中不能使用anchors布局,而在代码中(最长箭头所指的语句)Flow布局中的小Rectangle使用了anchors布局,所以不行,只能另想办法设置想要的布局,删掉它!!!

    与题目无关的小改动:

    把主窗口的Rectangle中浮动在右边的Rectangle中的Flow里面的小Rectangle的width和height属性设置成implicitHeightimplicitWidth

  • 相关阅读:
    SublimeText3激活
    Mysql数据备份
    supervisor介绍与使用
    spark-submit介绍
    Spark之spark.sql
    MarkDown编写方法
    Nginx配置多级代理后获取用户真实IP
    Hive之UDF解释
    Hive之分组取前几条记录
    Hive之Map和Reduce的优化
  • 原文地址:https://www.cnblogs.com/BASE64/p/14486961.html
Copyright © 2020-2023  润新知