Qt for WebAssembly Checkboxes and Comboboxes displayed wrong - c++

I coded a small application with QtQuick and QML to afterwards transpile it (in this case into a WebApplication) with Qt for Webassembly, which uses Emscripten internally.
When opening it, the checkboxes, and ComboBoxes look like the following:
I assume it's a HighDPI error. I've already added
QApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
to my code but this changed nothing. And I've already tried changing the size.
Code:
CheckBox {
id : contour_box
text: qsTr("Contour Lines")
height : 30;
}
ComboBox {
width : source.width/3.4;
model: [ "200ms", "500ms", "1s", "2s", "5s", "10s", "20s"]
currentIndex: 4;
}

Related

How to make QFileSystemModel work with a ListView

I am unable to make the QFileSystemModel go along with the ListView. All the examples and documentation that I found would use QFileSystemModel with the TreeView (which works fine), but this is not what I need.
I do not want to use FolderListModel QML type either because I want to add extra roles to my model later and edit/delete files and folders from the application.
I used DelegateModel to be able to set an other root index. For some reason, my files are correctly displayed for a fraction of a second and then the view jumps to the root of my filesystem. I'm not sure what happens, maybe the indexes are invalidated somehow.
Below is a sample of my code:
main.cpp
QFileSystemModel *fsm = new QFileSystemModel(&engine);
fsm->setRootPath(QDir::homePath());
fsm->setResolveSymlinks(true);
engine.rootContext()->setContextProperty("displayFileSystemModel", fsm);
engine.rootContext()->setContextProperty("rootPathIndex", fsm->index(fsm->rootPath()));
fsview.qml
ListView {
width: 300
height: 400
model: DelegateModel {
model: displayFileSystemModel
rootIndex: rootPathIndex
delegate: Rectangle {
width: 200; height: 25
Text {
text: model.filePath
Component.onCompleted: {
console.log(text)
}
}
}
}
}
What am I doing wrong?
UPDATE
So, apparently QFileSystemModel uses a separate thread to populate itself and shoots a directoryLoaded signal once the the thread has finished to load the path.
I tried connecting my view to only set the root index once the path has been properly loaded by adding the following code to my listview
Connections {
target: displayFileSystemModel
function onDirectoryLoaded(path) { delegatemodel.rootIndex = rootPathIndex }
}
However, this does not solve the problem. A dirty workaround was to set a timer to try set the rootIndex after a period of time.
Timer {
interval: 100
running: true
onTriggered: delegatemodel.rootIndex = examPathIndex
}
And this "solves" the problem but of course is far from a satisfactory solution. Any idea?
UPDATE 2
Turns out every time the model is updated (and the directoryLoaded signal is triggered), the view resets. Even trying to reassign the rootIndex every time new data is loaded doesn't work.

QML TableView Model Silently Failing?

edit: added some clarification
Using QML 5.14
It seems the model attribute of TableView does not want to display a QList<int>, or any variation of int, be it qint8, qint32, etc. I can make it work with unsigned QList<uint>, however I need to keep the negative range of values in my application.
I've found that the information is making it to the qml layer, because when i call:
console.log("cfs.amounts is " + cfs.amounts)
console.log("model is " + model)
console.log("modellength is " + model.length)
I actually am getting the expected console output of:
qml: cfs.amounts is 11,12
qml: model is 11,12
qml: modellength is 2
I've ensured the TableView is functional by directly passing it data, i.e. model: [11, 22] and it displays correctly, i.e. it displays the indexes 0, 1. However I can't get it to display anything at all when I pass it the cfs.amounts, which is a QList<int> in c++. So according to the console.log, the model data is there, it is correct, it's getting passed from c++ to qml without issues, and the length is good -- the TableView is just failing to display it.
The only thing I can think of, is that the TableView is silently failing to display arrays of signed integers. However I may also be completely wrong, because I can't get a Repeater item to recognize it in its model, neither. I've searched but I can't find any bug reports on this subject. Does anyone have any suggestion on how to get the qml model to recognize the passed QList<int> ? This is all in QML 5.14.
cashflowschedule.h
#ifndef CASHFLOWSCHEDULE_H
#define CASHFLOWSCHEDULE_H
#include "QObject"
#include "QList"
class CashFlowSchedule : public QObject
{
Q_OBJECT
Q_PROPERTY(QList<int> amounts READ amounts)
public:
CashFlowSchedule() {};
QList<int> amounts() { return {11,12}; }
};
#endif // CASHFLOWSCHEDULE_H
main.qml
import QtQuick 2.14
import QtQuick.Window 2.14
import cpps 1.0
Window {
visible: true
width: 640
height: 480
CashFlowSchedule { id: cfs }
TableView {
anchors.fill: parent
model: cfs.amounts
delegate: Text { text: index }
Component.onCompleted: {
console.log("cfs.amounts is " + cfs.amounts)
console.log("model is " + model)
}
}
}
included in the main.cpp
#include "cashflowschedule.h"
...
qmlRegisterType<CashFlowSchedule>("cpps", 1, 0, "CashFlowSchedule");
...
QList<int> is not one of the official supported C++ types used for models (see the list here). A bug report exists to clarify the documentation on that point. A QVariantList is a good alternative to use.

QGraphicsScene, QTextEdit and lost focus

QTextEdit and similar widgets embedded in QGraphicsScene lose focus after using standard context menu (copy/paste), i. e. you need to click on QTextEdit again to continue editing. Scene emits focusItemChanged with newFocusItem==0.
First question: Is it a bug or standard behavior?
My investigation shows that function QGraphicsItemPrivate::setVisibleHelper() clears focus here:
if (hasFocus && scene) {
// Hiding the focus item or the closest non-panel ancestor of the focus item
QGraphicsItem *focusItem = scene->focusItem();
bool clear = true;
if (isWidget && !focusItem->isPanel()) {
do {
if (focusItem == q_ptr) {
clear = !static_cast<QGraphicsWidget *>(q_ptr)->focusNextPrevChild(true);
break;
}
} while ((focusItem = focusItem->parentWidget()) && !focusItem->isPanel());
}
if (clear)
clearFocusHelper(/* giveFocusToParent = */ false, hiddenByPanel);
}
QGraphisItem has undocumented (internal) flag QGraphicsItem::ItemIsFocusScope. If the flag is set for QTextEdit's proxy-item it gets focus back after menu, but in any case focus cleared at first and after that Item receives it again or not.
Second Question: What is flag QGraphicsItem::ItemIsFocusScope for?
Looks like QGraphicsItem::ItemIsFocusScope is for FocusScope QML item. QtQuick1 is QGraphicsScene based and used that flag.
I'm not sure about side effects but that helps:
auto edit = new QLineEdit();
auto item = scene->addWidget(edit);
item->setFlag(QGraphicsItem::GraphicsItemFlag::ItemIsPanel);
Tested on Qt 5.9, Linux
EDIT
For me looks as bug:
add QLineEdit to scene
click to focus QLineEdit
hit ContextMenu key to show context menu
hit Esc key to exit context menu
try to type
Expected: QLineEdit is focused and text appears
Actual: QLineEdit lost input focus
Please find it or report with Qt bug tracker
So it's OK to have workaround using QGraphicsItem::ItemIsFocusScope flag for example.
#if (QT_VERSION < QT_VERSION_CHECK(<fixed in Qt version>))
// it's workaround of bug QTBUG-...
# if (QT_VERSION == QT_VERSION_CHECK(<version you are develop with>)
item.setFlag(QGraphicsItem::ItemIsFocusScope);
# else
# error("The workaround is not tested on this version of Qt. Please run tests/bug_..._workaround_test")
# endif

BlackBerry 10 development- TextField

Guys I am developing the basic app in BlackBerry 10 and I want to get text which is in TextField (in cpp). I am trying to find method for that but not getting the right one .So can anyone please tell me how to get the value from TextField in cpp (not in qml) ???
Well, the first thing you need to do is expose your QML TextField to C++. This is done with an object name property ala:
TextField {
objectName: "myTextField"
...
}
Next, find this child from your C++:
QmlDocument *qml = QmlDocument::create("asset:///my.qml");
Container *root = qml->createRootObject<bb::cascades::Container>(); //or whatever the root control is
TextField *textField = root->findChild<TextField*>("myTextField");
From then on, simply use textField->text().
We have 3 parts in this problem
First on in Qml your text area and bottom when clicked send text area to function in c++
TextField {
id: n2
}
Button {
id: button
text: "send text"
onClicked: {
app.sendtext(n2.text)
}
Second part your c++ function in your ApplicationUI to receive this text
QString ApplicationUI::sendtext(QString txtarea)
{
QString text = txtarea;
return text;
}
Third and final part in your ApplicationUI.h u must make this function INVOKABLE to access it in Qml
so u will need this line
Q_INVOKABLE QString sendtext(QString txtarea);

Settings menu UI implementation

I'm trying to implement a BB10 settings menu, looking like the one in the Calendar app for example. The question here is, which components should I use? Using a ListView with an XML model looks great, but is incompatible with translation. Using a C++ model looks overkill for a simple menu with a couple of entries…
There's probably an established pattern somewhere, but I can't find it.
Screenshot of the Calendar app settings view
What you want is the expendable content property of the title bar:
I would create a QML object that you can re-use for each entry with properties for title and image.
So for example, something perhaps like this:
SettingEntry.qml
Container {
property alias title:title.Text
signal click()
TextView {
id: title
text: "[title goes here]"
}
gestureHandlers: [
TapHandler {
onTapped: {
click();
}
}
]
}
Then in your settings page you would use it like a normal object:
Page {
Container {
SettingEntry {
title: "General"
onClick: {
//open general page
}
}
SettingEntry {
title: "Invitation Settings"
}
}
}
The above is obviously very simplified, you would want to include an icon image, add translation code and add visual adjustments like filling the width and padding.
It should however give you a good idea of where to start.
I also included a gesturehandler and signal to show you how to handle events such as a click.