When working with this code, focus on the pink box outlined in blue and the blue box inside it.
https://i.sstatic.net/NH8YS.png
I'm looking to position the blue Rectangle
to the right of the pink box. How can this be achieved? Why are the anchors not functioning as expected?
https://doc.qt.io/qt-5/qml-qtquick-controls2-pane.html
import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Layouts 1.12
import QtQuick.Controls 2.12
Window
{
id: window; visible: true; width: 1000; height: 1000
Pane
{
id: pane
anchors.bottom: parent.bottom
anchors.bottomMargin: 10
height: 50; width: 200
Layout.fillWidth: true
background:
Rectangle
{
id: rect
height: parent.height; width: parent.width
color: "pink";
border.color: "blue";
border.width: 2
}
RowLayout
{
width: parent.width; height: 50
Flickable
{
id: flickable
parent: rect
anchors.fill: parent
TextArea.flickable:
TextArea
{
id: messageField
text: "TextArea"
wrapMode: TextArea.Wrap
}
ScrollBar.vertical: ScrollBar { }
}
Rectangle
{
id: sendButton
parent: rect
anchors.right: rect.right; anchors.rightMargin: 2
anchors.top: rect.top; anchors.topMargin: 2
height: 20; width: 20
color: "blue"
}
}
}
}