QML 中按钮的前景属性

Question

我正在尝试更改 QML 按钮的前景可见性。基于我从互联网和 QML 文档中阅读的内容，我开发了以下示例。

import QtQuick 2.15
import QtQuick.Window 2.2
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3 
Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")     
Button {
        id: myButton
        text: "Click Me"
        foreground: ColumnLayout{
            anchors.fill: parent
            visible: false
            Rectangle {
                id:rect1
                Text{
                    text: "Rect1"
                }
            }
            Rectangle{
                id:rect2
                Text{
                    text: "Rect2"
                }
            }
        }         
onClicked: {
            myButton.foreground.visible = !myButton.foreground.visible; // toggle visibility of foreground
        }
    }
}

当我尝试执行时，我面临以下错误。

“无法分配给不存在的属性前景”，我导入的版本是QtQuick 2.15 & QtQuick.Controls.2.15

有人可以帮助实现上述期望。

提前致谢！！

Answer 1

按钮没有前景属性。尝试这样的事情：

Button {
   id: myButton
   text: "Click Me"
                       
   ColumnLayout {
      // give the foreground an ID 
      id: foreground
                           
      anchors.fill: parent
      visible: false
      Rectangle {
         id:rect1
         Text{
            text: "Rect1"
         }
      }
      Rectangle{
         id:rect2
         Text{
            text: "Rect2"
         }
      }
   }
                        
   onClicked: {
      foreground.visible = !foreground.visible; // toggle visibility of foreground
   }
}