Set background color on Layout (such as GridLayout)

Jehyeok

I create QT quick component redefinding GridLayout to make simple use.
MyGridLayout.qml

GridLayout  {
  rows:1
  columns:0
}

And I use this
myDialog.qml

MyGridLayout  {
  MyGridLayout {
    Text {
    }
    Text {
    }
  }
  MyGridLayout {
    Button {
    }
  }
}

It works well to have same setting.
However, I would like to set background color on it. there is no such a property on GridLayout...
Do you know how to do it with my customised component (MyGridLayout)
I would like to do like below.

MyGridLayout  {
  color: "white"
  MyGridLayout {
  color: "gray"
    Text {
    }
    Text {
    }
  }
  MyGridLayout {
  color: "black"
    Button {
    }
  }
}

dheerendra

Not possible. You need to try something like follows. Your grid layout need to child of Rect with appropriate colors.

Rectangle {
    width: 200;height: 200;color :"black"
    MyGridLayout {
        id: grid
        columns: 3
        anchors.fill: parent

        Text { text: "Three"; font.bold: true; }
        Text { text: "words"; color: "red" }
           }

}

jpnurmi

How about this?

// MyGridLayout.qml
import QtQuick 2.5
import QtQuick.Layouts 1.1

Rectangle {
    default property alias data: grid.data
    implicitWidth: grid.implicitWidth
    implicitHeight: grid.implicitHeight
    GridLayout {
        anchors.fill: parent
    }
}

Jehyeok

@jpnurmi Thanks. It works

amarism

@jpnurmi may i know what is "data" is here???

ODБOï

@amarism
see here for data
http://doc.qt.io/qt-5/qml-qtquick-item.html