Different behavior of ChartView LineSeries in Qt5.15 and 6.2 - qt

I use the following code in Qt 5.15.0 and Qt 6.2.0.
import QtQuick 2.15
import QtQuick.Window 2.15
import QtCharts 2.15
Window {
width: 640
height: 480
visible: true
title: qsTr("Hello World")
ChartView {
title: "Line"
anchors.fill: parent
antialiasing: true
LineSeries {
name: "LineSeries"
XYPoint { x: 0; y: 0 }
XYPoint { x: 1.1; y: 2.1 }
XYPoint { x: 1.9; y: 3.3 }
XYPoint { x: 2.1; y: 2.1 }
XYPoint { x: 2.9; y: 4.9 }
XYPoint { x: 3.4; y: 3.0 }
XYPoint { x: 4.1; y: 3.3 }
}
}
}
If I run with Qt 5.15.0 MSVC2019 64bit build:
And if run with Qt 6.2.0 MSVC2019 64bit build:
So the question is, why is there such a difference and how does it show up in Qt 6.2.0 the same as in Qt 5.15.0?

Related

Module VirtualKeyboard not available in Qt Quick UI-Prototype? Err-Msg: not installed

I want to create a Qt Quick UI. So I started a new Qt Quick UI-Prototyp-Project. I got standard template but compilatoin already fails with Err-Message.
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.VirtualKeyboard 2.15
Window {
id: window
width: 640
height: 480
visible: true
title: qsTr("Hello World")
InputPanel {
id: inputPanel
z: 99
x: 0
y: window.height
width: window.width
states: State {
name: "visible"
when: inputPanel.active
PropertyChanges {
target: inputPanel
y: window.height - inputPanel.height
}
}
transitions: Transition {
from: ""
to: "visible"
reversible: true
ParallelAnimation {
NumberAnimation {
properties: "y"
duration: 250
easing.type: Easing.InOutQuad
}
}
}
}
}
file:///.../VKTest/VKTest.qml:12 Type InputPanel unavailable qrc:/QtQuick/VirtualKeyboard/content/InputPanel.qml:127 Type Keyboard unavailable qrc:/QtQuick/VirtualKeyboard/content/components/Keyboard.qml:38 module "QtQuick.VirtualKeyboard.Plugins" is not installed
But creating new Qt Quick Application with standard template - equal to UI-Prototype template - compiles fine.
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.VirtualKeyboard 2.15
Window {
id: window
width: 640
height: 480
visible: true
title: qsTr("Hello World")
InputPanel {
id: inputPanel
z: 99
x: 0
y: window.height
width: window.width
states: State {
name: "visible"
when: inputPanel.active
PropertyChanges {
target: inputPanel
y: window.height - inputPanel.height
}
}
transitions: Transition {
from: ""
to: "visible"
reversible: true
ParallelAnimation {
NumberAnimation {
properties: "y"
duration: 250
easing.type: Easing.InOutQuad
}
}
}
}
}
but with main application:
#include <QGuiApplication>
#include <QQmlApplicationEngine>
int main(int argc, char *argv[])
{
qputenv("QT_IM_MODULE", QByteArray("qtvirtualkeyboard"));
#if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)
QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
#endif
QGuiApplication app(argc, argv);
QQmlApplicationEngine engine;
const QUrl url(QStringLiteral("qrc:/main.qml"));
QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
&app, [url](QObject *obj, const QUrl &objUrl) {
if (!obj && url == objUrl)
QCoreApplication::exit(-1);
}, Qt::QueuedConnection);
engine.load(url);
return app.exec();
}
Does anybody also had this problem or know a reason? I tried it witha clean Ubuntu+QT5.15 (QtVirtaulKeayboard checked) and Windows. Maybe Virtual Keyboard doesn't work with a UI-Prototype?

QML Tableview change row color depending on row content

I'm new to qml and I need to write a simple list with 3 columns and an undefined number of rows showing the output of a log using a tableview. The first column shows the type (error, warning, info). Depending on this keywords I need to change the color of that row. I found code where I was able to change the color of all rows, but not individually depending on the data content. This is my starting point:
import QtQuick 2.13
import QtQuick.Window 2.11
import QtQuick.Layouts 1.3
import QtQuick.Controls 2.4
import QtQuick.Controls 1.4 as QtC1
import QtQuick.Dialogs 1.2
ApplicationWindow {
id: applicationWindow
visible: true
width: 640
height: 480
title: qsTr("Log")
ListModel {
id: listModel
ListElement { category: 'warning'; type: "DEVICE IN USE"; comment: "Device with ID: PS-0002 is in use by Line with ID: L-0001A" }
ListElement { category: 'error'; type: "DEVICE IS OFFLINE"; comment: "Cannot reach device with ID: PS-0006 IP: 192.169.0.112 Port: 788" }
ListElement { category: 'info'; type: "DEVICE STATUS"; comment: "Device PS-00013 is ready for use." }
ListElement { category: 'info'; type: "DEVICE STATUS"; comment: "Device PS-00014 is ready for use." }
ListElement { category: 'info'; type: "DEVICE STATUS"; comment: "Device PS-00015 is ready for use." }
ListElement { category: 'info'; type: "DEVICE STATUS"; comment: "Device PS-00016 is ready for use." }
}
ColumnLayout
{
anchors.fill: parent
transformOrigin: Item.Center
Label {
id: logLabel
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
font.pixelSize: 22
text: qsTr("Summary")
Layout.topMargin: 13
}
QtC1.TableView {
id: tv
Layout.fillHeight: true
Layout.preferredHeight: 18
Layout.preferredWidth: 9
Layout.fillWidth: true
rowDelegate: Rectangle {
color: styleData.value ? "blue":"white"
}
/* Create columns */
QtC1.TableViewColumn
{
id: tv_category
horizontalAlignment: Text.AlignLeft
role: qsTr("category")
title: qsTr("Category")
width: 100
}
QtC1.TableViewColumn
{
id: tv_type
horizontalAlignment: Text.AlignLeft
role: qsTr("type")
title: qsTr("Type")
width: 100
}
QtC1.TableViewColumn
{
id: tv_comment
horizontalAlignment: Text.AlignRight
role: qsTr("comment")
title: qsTr("Comment")
width: contentWidth
}
model: listModel
}
}
}
Any help would be appreciated.
Martin
In the rowDelegate you have access to the row index (using styleData.row). Just use it to get the item from the list model like this:
rowDelegate: Rectangle {
color: {
var item = listModel.get(styleData.row)
if (item.category === "info")
return "skyblue"
else if (item.category === "warning")
return "yellow"
else if (item.category === "error")
return "red"
return "skyblue"
}
}

How to make text or label selectable?

Let's say I have text component:
Text {
text: "Hello"
wrapMode: Text.WordWrap
}
How to make it selectable?
That is a bug reported: QTBUG-14077, and the workaround is to use TextEdit in read-only mode:
TextEdit {
text: "Hello"
readOnly: true
wrapMode: Text.WordWrap
selectByMouse: true
}

QML ListView - Limit the number of items displayed in the list

I have a ListView ListModel with 10 ListElements, I want the ListView to display the first ListElement from the model.
Is there a way to limit the number of ListElement items that are displayed, or select the ListElement to display from an ID in the data?
Example ListModel:
ListModel {
id: homeMenuModelData
ListElement {
name: "Sam Wise Is A Very Wise Man"
number: "555 0473"
}
ListElement {
name: "Bill Smith"
number: "555 3264"
}
ListElement {
name: "John Brown"
number: "555 8426"
}
}
The ListView:
ListView {
anchors.fill: parent
interactive: false
model: HomeMenuModel
delegate: homeMenuDelegate
highlight: Rectangle { color: "lightsteelblue"; radius: 5 }
focus: true
}
I'm thinking something like this would be useful to me:
model.clear();
for( var i=0; i < bookList.length ; ++i ) {
model.append(bookList[i]);
}
****** Updated ******
Props to #folibis (below comments) for the suggestion, good explanation here of using DelegateModel and filterOnGroup: Is it possible to show only certain indexes of a QML listview?

QML: Set Property of Nested ListElement

I have a ListModel like the following:
ListModel {
id: liveFeedModel
ListElement {
modelSrc: [
ListElement { src: "../img/pano.jpg" },
ListElement { src: "../img/pano1.jpg" },
ListElement { src: "../img/pano2.jpg" },
ListElement { src: "../img/pano3.jpg" }
]
name: "Cookies"
temp: "456 °C"
time: "--:--"
}
ListElement {
modelSrc: [
ListElement { src: "../img/pano2.jpg" }
]
name: "Sourdough Roll"
temp: "123 °F"
time: "--:--"
}
}
And I would like to set the value of the nested ListElements within modelSrc.
I am looking for something similar to:
liveFeedModel.get(0).modelSrc.get(2).src
except with set, setProperty, or something along those lines, instead of get
Thanks in advance
use:
myListView.model.get(0).modelSrc.setProperty(0, "src", "../img/pano2.jpg");
simple as that!

Resources