Hur kan man få en cell i TableView responsiv mot ökad fönsterstorlek?

Permalänk

Hur kan man få en cell i TableView responsiv mot ökad fönsterstorlek?

Jag har denna kod.

import QtQuick import QtQuick.Controls 6.3 import QtQuick.Layouts 6.3 import QtQuick.Controls.Windows 6.0 import QtQuick3D 6.3 import Qt.labs.qmlmodels 1.0 Window { id: window width: 250 height: 480 visible: true title: qsTr("Hello World") Row { id: row width: window.width height: window.height Column { id: column1 width: 50 height: window.height topPadding: 0 spacing: 0 Rectangle { id: rectangle width: column1.width height: column1.width color: "#fc0909" border.width: 0 } Rectangle { id: rectangle1 width: column1.width height: column1.width color: "#0d01ff" border.width: 0 } } SwipeView { id: swipeView width: window.width - column1.width height: window.height Column { id: column x: 175 y: 0 width: swipeView.width height: window.height TableView { width: column.width height: window.height - addItemToStockList.height columnSpacing: 1 rowSpacing: 1 clip: true model: TableModel { TableModelColumn { display: "name" } TableModelColumn { display: "color" } rows: [ { "name": "cat", "color": "black" }, { "name": "dog", "color": "brown" }, { "name": "bird", "color": "white" } ] } delegate: Rectangle { implicitWidth: 100 implicitHeight: 50 border.width: 1 Text { text: display anchors.centerIn: parent } } } Rectangle { id: addItemToStockList width: swipeView.width height: column1.width color: "yellow" border.width: 0 } } } } Item { id: __materialLibrary__ } }

Denna kod ger detta. Som ni ser så vill jag att tabellen följer med också. Men den gör inte det...varför?

Det jag måste ändra är denna del.

delegate: Rectangle { implicitWidth: 100 implicitHeight: 50 border.width: 1 Text { text: display anchors.centerIn: parent } }

Hur vad ska jag skriva så att bredden (width) och höjden (height) blir responsiv?

Permalänk
Hedersmedlem

En metod verkar vara att sätta columnWidthProvider/rowHeightProvider samt anropa forceLayout()

import QtQuick import QtQuick.Controls 6.3 import QtQuick.Layouts 6.3 import QtQuick.Controls.Windows 6.0 import QtQuick3D 6.3 import Qt.labs.qmlmodels 1.0 Window { id: window width: 250 height: 480 visible: true title: qsTr("Hello World") onWidthChanged: tv1.forceLayout() onHeightChanged: tv1.forceLayout() Row { id: row width: window.width height: window.height Column { id: column1 width: 50 height: window.height topPadding: 0 spacing: 0 Rectangle { id: rectangle width: column1.width height: column1.width color: "#fc0909" border.width: 0 } Rectangle { id: rectangle1 width: column1.width height: column1.width color: "#0d01ff" border.width: 0 } } SwipeView { id: swipeView width: window.width - column1.width height: window.height Column { id: column x: 175 y: 0 width: swipeView.width height: window.height TableView { width: column.width height: window.height - addItemToStockList.height columnSpacing: 1 rowSpacing: 1 clip: true id: tv1 columnWidthProvider: function (column) { return swipeView.width/2 } rowHeightProvider: function (row) { return (swipeView.height - 5- addItemToStockList.height)/3 } model: TableModel { TableModelColumn { display: "name" } TableModelColumn { display: "color" } rows: [ { "name": "cat", "color": "black" }, { "name": "dog", "color": "brown" }, { "name": "bird", "color": "white" } ] } delegate: Rectangle { border.width: 1 Text { text: display anchors.centerIn: parent } } } Rectangle { id: addItemToStockList width: swipeView.width height: column1.width color: "yellow" border.width: 0 } } } } Item { id: __materialLibrary__ } }

Permalänk
Skrivet av Elgot:

En metod verkar vara att sätta columnWidthProvider/rowHeightProvider samt anropa forceLayout()

import QtQuick import QtQuick.Controls 6.3 import QtQuick.Layouts 6.3 import QtQuick.Controls.Windows 6.0 import QtQuick3D 6.3 import Qt.labs.qmlmodels 1.0 Window { id: window width: 250 height: 480 visible: true title: qsTr("Hello World") onWidthChanged: tv1.forceLayout() onHeightChanged: tv1.forceLayout() Row { id: row width: window.width height: window.height Column { id: column1 width: 50 height: window.height topPadding: 0 spacing: 0 Rectangle { id: rectangle width: column1.width height: column1.width color: "#fc0909" border.width: 0 } Rectangle { id: rectangle1 width: column1.width height: column1.width color: "#0d01ff" border.width: 0 } } SwipeView { id: swipeView width: window.width - column1.width height: window.height Column { id: column x: 175 y: 0 width: swipeView.width height: window.height TableView { width: column.width height: window.height - addItemToStockList.height columnSpacing: 1 rowSpacing: 1 clip: true id: tv1 columnWidthProvider: function (column) { return swipeView.width/2 } rowHeightProvider: function (row) { return (swipeView.height - 5- addItemToStockList.height)/3 } model: TableModel { TableModelColumn { display: "name" } TableModelColumn { display: "color" } rows: [ { "name": "cat", "color": "black" }, { "name": "dog", "color": "brown" }, { "name": "bird", "color": "white" } ] } delegate: Rectangle { border.width: 1 Text { text: display anchors.centerIn: parent } } } Rectangle { id: addItemToStockList width: swipeView.width height: column1.width color: "yellow" border.width: 0 } } } } Item { id: __materialLibrary__ } }

Så man kan säga att du gjorde bara en funktion som anropar grundat på en händelse. Okej, kan man verkligen göra så.

Hur hade du gjort om du skulle göra som jag? Hade du valt en sida per separat .qml fil?

En annan fråga: Kan jag skapa en QT applikation utan använda mig av C++? För jag tycker C++ är lite jobbigt att använda så fort projektet börjar bli stort. Det blir många filer. Hade C++ skippat headerfilerna och haft mer som C# och Java så skulle C++ vara skitbra.

Permalänk
Hedersmedlem
Skrivet av heretic16:

Så man kan säga att du gjorde bara en funktion som anropar grundat på en händelse. Okej, kan man verkligen göra så.

columnWidthProvider (liksom den andra) är en egenskap som är avsedd just för att peka på en funktion som returnerar önskad bredd, om man inte nöjer sig med standardvärdet. Man måste sedan säga åt tabellen att uppdatera sig, och det kopplade jag till händelserna för storleksändring, men det skulle kunna ske på andra sätt också.

Skrivet av heretic16:

En annan fråga: Kan jag skapa en QT applikation utan använda mig av C++? För jag tycker C++ är lite jobbigt att använda så fort projektet börjar bli stort. Det blir många filer. Hade C++ skippat headerfilerna och haft mer som C# och Java så skulle C++ vara skitbra.

Jag har aldrig testat själv (tror jag), men det skall väl finnas hyggligt stöd för python också?
Annars är det kanske moduler du väntar på (liksom resten av c++-världen). De är på gång, men som vanligt tar det ett tag att enas om hur de skall fungera. Och sedan måste ju alla börja använda dem också.