QML QQuickText: Cannot anchor to an item that isn't a parent or sibling - qt

When I use TumblerColumn in my Tumbler, I get QML QQuickText: Cannot anchor to an item that isn't a parent or sibling, When I use Tumbler alone the error doesn't appear. I can't figure out what is the problem with TumblerColumn.
Here is my Dialog code
import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Dialogs 1.2
import QtQuick.Extras 1.2
Dialog {
id: customTimerInputDialog
title: "Custom timer"
height: 150
width: 300
standardButtons: StandardButton.Ok | StandardButton.Cancel
onAccepted: {
}
onRejected: {
console.log("Rejected")
}
Column {
anchors.fill: parent
Text {
text: "Timer"
height: 40
}
Tumbler {
id: tumbler
TumblerColumn {
model: 10
}
TumblerColumn {
model: 60
}
}
}
}
TumblerColumn (TumblerStyle.qml) complete source code
...
// line 294
property Component delegate: Item {
implicitHeight: (control.height - padding.top - padding.bottom) / tumblerStyle.visibleItemCount
Text {
id: label
text: styleData.value
color: "#666666"
opacity: 0.4 + Math.max(0, 1 - Math.abs(styleData.displacement)) * 0.6
font.pixelSize: Math.round(TextSingleton.font.pixelSize * 1.25)
anchors.centerIn: parent
}
}
...
Error message
UPDATE
I get the same error with Popup QML Type
Popup {
id: popup
x: 100
y: 100
width: 200
height: 300
modal: true
focus: true
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent
Tumbler {
id: intervalPicker
TumblerColumn {
model: 10
}
TumblerColumn {
model: 60
}
}
}

You are mixing Qt Quick Controls 1 and 2. In your Dialog/Popup you import
QtQuick.Controls 2.2 and QtQuick.Extras 1.2. Both imports define a Tumbler, but the one from Qt Quick Extras is made to work with Qt Quick Controls 1 (see the imports in TumblerStyle.qml).
If you want to use TumblerColumn and TumblerStyle, you have to use the Tumbler from Qt Quick Extras 1.2.
If you want to use the Tumbler from Qt Quick Controls 2, you cannot use any of the tumbler facility from Qt Quick Extras 1.2.
If you need to have both Qt Quick Extras 1.2 and Qt Quick Controls 2 imported in a qml file, you need to use the as qualifier:
import QtQuick.Extras 1.2 as Extra
import QtQuick.Controls 2.2 as Controls2
...
Extra.Tumbler
{
...
}
Controls2.Tumbler
{
...
}
...

Related

Qml menu popup latency

When my mouse event happened,the menu can popup,but not immediately,it seems a little latency. this is my code, is anything wrong?
My Qt version is 5.15, my system is Windows 10.
import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12
import QtQuick.Controls 1.4
import QtQuick.Layouts 1.12
Window {
visible: true
width: 450
height: 350
title: qsTr("ListView")
property bool refreshFlag: false
Rectangle {
id: rightview
width: 60
height: 300
x: 100
color: "#EEEEEE"
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.RightButton | Qt.LeftButton
onClicked: {
console.log(width)
if (mouse.button === Qt.RightButton)
contextMenus.popup()
}
Menu {
id: contextMenus
MenuItem { text: "open" }
MenuItem { text: "save " }
MenuItem { text: "else..." }
}
}
Text {
font.pointSize: 12
text: "content"
}
}
}
this is my screenshot
A couple of issues with your program snippet:
Don't mix QtQuick.Controls 1.x with QtQuick.Controls 2.x
Recommend you update all your references to versions to 2.15
Do not declare Menu inside MouseArea, it doesn't make sense
The MouseArea can be optimized to only accept the RightButton
Declare the Menu at the "top level"
Here's a cleanup of your code:
import QtQuick 2.15
import QtQuick.Controls 2.15
Page {
anchors.fill: parent
Rectangle {
x: 100
width: 60
height: 300
color: "#EEEEEE"
Text {
font.pointSize: 12
text: "content"
}
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.RightButton
onClicked: contextMenus.popup()
}
}
Menu {
id: contextMenus
MenuItem { text: "open" }
MenuItem { text: "save " }
MenuItem { text: "else..." }
}
}
You can Try it Online!
There appears to be no performance issue when I run the above snippet using qmlonline. I don't think the code is an issue. I think we need to get an understanding of:
Your version of Qt
Your platform (i.e. OS, hardware, etc)

How to set an item property of one qml from main.qml

I waste my time to find how set the visible property to false, the delegate being in an another qml file.
For instance here is a simple example based on Places Map.
Marker.qml
import QtQuick 2.0
import QtLocation 5.6
MapQuickItem {
id: idPointsMarker
sourceItem: Loader{sourceComponent: idRect}
visible: true //if set manually to false, everything works correctly
Component{
id: idRect
Rectangle{
width: 20
height: 20
color: "blue"
}
}
}
and the main.qml
import QtQuick 2.0
import QtQuick.Window 2.0
import QtLocation 5.6
import QtPositioning 5.6
Window {
width: 512
height: 512
visible: true
PositionSource {
...
}
property variant locationOslo: QtPositioning.coordinate( 59.93, 10.76)
PlaceSearchModel {
...
}
Map {
id: map
anchors.fill: parent
plugin: Plugin {name: "osm"}
center: locationOslo
zoomLevel: 13
MouseArea {
id : mouseMap
anchors.fill: parent
onDoubleClicked: {
console.log("DoubleClicked")
Marker.idPointsMarker.visible = false // pb is here
}
}
MapItemView {
model: searchModel
delegate: Marker{
coordinate: place.location.coordinate
}
}
}
}
I wish to toggle the visibility to false on doubleclick. I am not able to access the property anyhow the way i write it. What is the correct syntax?
Sorry for a so simple question. Thanks for help.
You do not have to set the property in main.qml, you must do it in Marker.qml, since the elements of Marker.qml can access all the elements of main.qml. One solution is to establish a property of type bool that manages the visibility and that changes in the double click:
main.qml
Map {
[...]
property bool isVisibleItems: true
MouseArea {
id : mouseMap
anchors.fill: parent
onDoubleClicked: map.isVisibleItems = !map.isVisibleItems
}
[...]
Marker.qml
import QtQuick 2.0
import QtLocation 5.6
MapQuickItem {
id: idPointsMarker
sourceItem: Loader{sourceComponent: idRect}
visible: map.isVisibleItems
Component{
id: idRect
Rectangle{
width: 20
height: 20
color: "blue"
}
}
}
In the following link there is an example

Access QML nested variable member from custom Label

I have the following custom Label:
import QtQuick 2.3
import QtQuick.Controls 1.4
Label
{
anchors.centerIn: parent
text: "DashboardLabel!"
font.pixelSize: 22
font.italic: true
color: "steelblue"
Rectangle
{
id: rectangle
}
}
I'm trying to change the position of the label by accessing the x and y variables from rectangle:
import QtQuick 2.3
import QtQuick.Controls 1.4
import CustomGraphics 1.0
Item
{
anchors.centerIn: parent
CustomLabel
{
id: customLabel
width: 100
height: 100
rectangle.x: 200
}
}
It doesn't seem to be working since my custom Label is not moved. Should I use the property feature? Here is the error I'm getting:
Cannot assign to non-existent property "rectangle"
EDIT: I've just tried to add property alias rect: rectangle in order to access x with rect.x. I do not get any errors but nothing appears on the window.
You can't access the private properties of the child element like that. You have to create alias in order for the subclass to access them. Try this
import QtQuick 2.3
import QtQuick.Controls 1.4
Label
{
property alias childRect: rectangle
anchors.centerIn: parent
text: "DashboardLabel!"
font.pixelSize: 22
font.italic: true
color: "steelblue"
Rectangle
{
id: rectangle
width: 100
height: 100
}
}
and then
import QtQuick 2.3
import QtQuick.Controls 1.4
import CustomGraphics 1.0
Item
{
anchors.centerIn: parent
CustomLabel
{
id: customLabel
width: 100
height: 100
childRec.x: 200
}
}
UPDATE as OP changed the description
You haven't set width and height properties for the rectangle. See my edit.

QML2 ApplicationWindow Keys handling

Is there any way to handle key press events in ApplicationWindow of QtQuick.Controls component? Documentation of Qt5.3 does not provide any way to do this. Also, it says that Keys is only exists in Item-objects . When I try to handle key press event it says "Could not attach Keys property to: ApplicationWindow_QMLTYPE_16(0x31ab890) is not an Item":
import QtQuick 2.2
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.1
import QtQuick.Window 2.1
ApplicationWindow {
id: mainWindow
visible: true
width: 720
height: 405
flags: Qt.FramelessWindowHint
title: qsTr("test")
x: (Screen.width - width) / 2
y: (Screen.height - height) / 2
TextField {
id: textField
x: 0
y: 0
width: 277
height: 27
placeholderText: qsTr("test...")
}
Keys.onEscapePressed: {
mainWindow.close()
event.accepted = true;
}
}
ApplicationWindow {
id: mainWindow
Item {
focus: true
Keys.onEscapePressed: {
mainWindow.close()
event.accepted = true;
}
TextField {}
}
}
Maybe this will help some.
Using a Shortcut doesn't require focus to be set.
ApplicationWindow {
id: mainWindow
Shortcut {
sequence: "Esc"
onActivated: mainWindow.close()
}
}
}

How to get parent button from ButtonStyle without using id?

I created a component (SidebarMenuButton) that is used in the main qml file multiple times. The button has styles that should be inherited by all it's 'instances'. Here is the SidebarMenuButton.qml:
import QtQuick 2.3
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2
Button {
width: buttonNewMessage.width
height: buttonNewMessage.height
anchors {
horizontalCenter: parent.horizontalCenter
topMargin: 5
}
style: ButtonStyle {
background: Rectangle {
color: 'transparent'
}
label: Text {
text: parent.text // undefined here
color: 'white'
font.family: 'Helvetica'
font.pixelSize: 12
font.bold: true
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
}
}
}
And a part of my main qml file:
import QtQuick 2.3
import QtQuick.Window 2.1
import QtQuick.Layouts 1.1
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2
Window {
id: main
title: 'Messenger'
width: 1024
height: 768
minimumWidth: 800
minimumHeight: 600
RowLayout {
id: layout
anchors.fill: parent
spacing: 0
Rectangle {
id: sidebar
color: '#3C3E55'
Layout.fillHeight: true
Layout.preferredWidth: 200
ButtonCompanyName {
id: buttonCompanyName
}
ButtonNewMessage {
id: buttonNewMessage
}
SidebarMenuButton {
id: buttonInbox
text: 'Inbox (1)'
anchors.top: buttonNewMessage.bottom
}
SidebarMenuButton {
id: buttonSentMessages
text: 'Sent messages'
anchors.top: buttonInbox.bottom
}
SidebarMenuButton {
id: buttonStarred
text: 'Starred'
anchors.top: buttonSentMessages.bottom
}
}
I commented the line with error. parent there doesn't refer to button so the text in all buttons is empty. I need to access parent button from there and get it's text property. The component has no id cause it's used multiple times and ids are assigned in the main qml file. So the question is: how can I get that button text without id?
There are two ways to set text in your case.
1)The Button for which you are applying the style is available as control property in ButtonStyle class. You can set the the text as text:control.text
Reference:control property(ButtonStyle)
2)You can give an id to the Button in SidebarMenuButton type and access its textproperty.
Button
{
id:button
.
.
.
text: button.text
}
You can assign an id inside your component file that would not conflict with the id you use when you instantiate the component somewhere else. I use the same value for the id of most of my QML components: container so that I can easily reference properties from the root of the item.
import QtQuick 2.3
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2
Button {
id: container
style: ButtonStyle {
background: Rectangle {
color: 'transparent'
}
label: Text {
text: container.text
}
}
}
Then when you instantiate this component in another file you set whichever id you want and it would still work

Resources