@tomendop see documentation for "Layout QML Type". It states:

Note: It is not recommended to have bindings to the x, y, width, or height properties of items in a layout, since this would conflict with the goals of Layout, and can also cause binding loops.

I can't say exactly what is going wrong in your example, but it is basically that you are doing something you aren't supposed to do when you choose to use the Layout mechanism.

I think it can be quite confusing as QML has a number of different ways to manage layout and it isn't always obvious which way is best or most appropriate.

Hi @Kyeiv ,
I didn't realize that you wanted the elements of each line to line up with each other. In this case you can use GridLayout:

import QtQuick import QtQuick.Window import QtQuick.Controls import QtQuick.Layouts Window { GridLayout { anchors.fill: parent columns: 3 //rows: 5 Text { Layout.fillWidth: true text: "Text1a Looooooooog" horizontalAlignment : Text.AlignHCenter elide: Text.ElideRight } Text { Layout.fillWidth: true text: "Text1b" horizontalAlignment : Text.AlignHCenter elide: Text.ElideRight } Text { Layout.fillWidth: true text: "Text1c" horizontalAlignment : Text.AlignHCenter elide: Text.ElideRight } Item { Layout.columnSpan: 3 Layout.fillWidth: true height: 10 Rectangle { height: 1 width: parent.width anchors.centerIn: parent color: "grey" } } Text { Layout.fillWidth: true text: "Text2a" horizontalAlignment : Text.AlignHCenter elide: Text.ElideRight } Text { Layout.fillWidth: true text: "Text2b Looooooooog" horizontalAlignment : Text.AlignHCenter elide: Text.ElideRight } Text { Layout.fillWidth: true text: "Text2c" horizontalAlignment : Text.AlignHCenter elide: Text.ElideRight } ´ Item { Layout.columnSpan: 3 Layout.fillWidth: true height: 10 Rectangle { height: 1 width: parent.width anchors.centerIn: parent color: "grey" } } Text { Layout.fillWidth: true text: "Text3a" horizontalAlignment : Text.AlignHCenter elide: Text.ElideRight } Text { Layout.fillWidth: true text: "Text3b" horizontalAlignment : Text.AlignHCenter elide: Text.ElideRight } Text { Layout.fillWidth: true text: "Text3c Looooooooog" horizontalAlignment : Text.AlignHCenter elide: Text.ElideRight } } }

80bb60b9-e0d8-4200-9aff-b91995e3daf7-image.png
da6d1565-5132-45f8-bd56-95be08ea8f2f-image.png

@raven-worx i cannot specify Layout.alignment in string creating Text because i get error that this property doesn't exist

Hello!

I think what is missing is a specification of the contentWidth and contentHeight of the ScrollView. The reason this breaks in the main case is because ColumnLayout has no default width/height. In spite of your specification of an implicitHeight and implicitWidth the ScrollView still must have the content sizes specified manually.

So adding:

contentWidth: parent.width contentHeight: the_column.height

to the ScrollView resolves the issues.

I managed to solve the issue changing the code to:

ColumnLayout { id: listcolumn2 Layout.fillWidth: true Layout.preferredWidth: 500 Layout.minimumWidth: 100 spacing: 0 ColumnLayout { id: sublistcolumn1 Text{...} ListView { id: lv1 Layout.fillHeight: true Layout.fillWidth: true Layout.minimumHeight: lv1.contentItem.childrenRect.height } Layout.fillWidth: true Layout.preferredWidth: 500 Layout.minimumWidth: 100 } ColumnLayout { id: sublistcolumn2 Text{...} ListView { id: lv2 Layout.fillHeight: true Layout.fillWidth: true Layout.minimumHeight: lv2.contentItem.childrenRect.height } Layout.fillWidth: true Layout.preferredWidth: 500 Layout.minimumWidth: 100 } Item { id: filler Layout.fillHeight: true Layout.fillWidth: true Layout.preferredWidth: 500 Layout.minimumWidth: 100 } }

Was able to solve it by outcommenting selectionHandle in the custom keyboard style.qml file.

I found the solution in this post:
https://forum.qt.io/post/321757