In qt 5.15.2 version's Qt3D, I use the property name "components" occur error! is there anyone know?
the modules I have imported to this file and .pro file sign the modules reference to the qt3d project,
this all I can do as a new learner of qml. oh that's so obscure to learn qt3d.is that mean Scene3D type have no property name "components"? but the code is used by many project.
import QtQuick 2.9
import QtQuick.Controls 2.15
import QtQuick.Window 2.2
import Qt3D.Core 2.15
import Qt3D.Render 2.15
import Qt3D.Extras 2.15
import Qt3D.Logic 2.15
import Qt3D.Input 2.15
import Qt3D.Animation 2.15
import QtQuick.Scene3D 2.15
ApplicationWindow {
id:root
signal valchange(int val)
visible: true
width: 640
height: 480
title: qsTr("Scroll")
Rectangle {
anchors.fill: parent
color: "darkred"
Scene3D {
id: scene3d
anchors.fill: parent
Camera {
id: camera
projectionType: CameraLens.PerspectiveProjection
fieldOfView: 45
aspectRatio: 16/9
nearPlane: 0.1
farPlane: 1000
position: Qt.vector3d(200, 300, 300)
upVector: Qt.vector3d(0, 1, 0)
viewCenter: Qt.vector3d(0,0,0)
}
components: [
RenderSettings {
activeFrameGraph: ForwardRenderer {
clearColor: Qt.rgba(0, 0.5, 1,1)
camera: camera
}
},
InputSettings {
}
]
PhongMaterial {
id: material
}
TorusMesh {
id: torusMesh
radius: 5
minorRadius: 1
rings: 100
slices: 20
}
Entity {
id: torusEntity
components: [torusMesh, material]
}
}
}
}```
Related
This question is similar to - but no the same as Moving qml Item out of left side of window, because my question is about Dialogs, instead of Items in general. The difference is explained below.
I have a Qt Dialog which I want to enter the screen from the left.
The first approach I took was setting the dialogs x property to -width and then adding a Behavior on x or a manually triggered NumberAnimation.
This approach however failed, because setting negative x values is not allowed and the value gets changed to 0 immediately.
This post provides a solution for this issue, by using anchors and AnchorChanges and transitions - but only for Items.
However, the Dialog type does neither provide states, nor anchors but only coordinates.
So my question stands: How can I have a QML Dialog animate from the left outside the screen into view?
Here's a minimal code sample, that demonstrate the x property being reset to 0:
import QtQuick 2.7
import QtQuick.Controls 2.3
ApplicationWindow {
visible: true
width: 640
height: 480
title: qsTr("Dialog Demo")
Dialog {
id: dialog
width: 200
height: 200
x: -width
Text {
anchors.centerIn: parent
text: "Ok?"
}
standardButtons: Dialog.Ok
onOpened: x = 100
Behavior on x { NumberAnimation{ duration: 1000 } }
}
Component.onCompleted: dialog.open()
}
You can use the enter-transition that is inherited from Popup:
import QtQuick 2.9
import QtQuick.Window 2.0
import QtQuick.Controls 2.3
Window {
id: window
visible: true
width: 600
height: 600
Dialog {
id: dialog
width: 300
height: 300
enter: Transition {
NumberAnimation { properties: "x,y"; from: -300; to: 150 }
}
}
Button {
anchors.centerIn: parent
onClicked: dialog.open()
}
}
There seems to be a Bug with the Dialog. As soon as the Dialog has some content, it fails. I have not discovered all depths of it, but wrapping everything in an Item seems to help. Compare for this:
import QtQuick 2.9
import QtQuick.Window 2.0
import QtQuick.Controls 2.3
ApplicationWindow {
id: window
visible: true
width: 600
height: 600
Dialog {
id: dialog
width: 300
height: 300
enter: Transition {
NumberAnimation { properties: "x,y"; from: -300; to: 150; duration: 5000 }
}
// HAVE A BUTTON IN THE DIALOG -> POSITIONING FAILS
Button {
anchors.centerIn: parent
}
}
Button {
text: 'open'
anchors.centerIn: parent
onClicked: dialog.open()
}
}
and
import QtQuick 2.9
import QtQuick.Window 2.0
import QtQuick.Controls 2.3
ApplicationWindow {
id: window
visible: true
width: 600
height: 600
Dialog {
id: dialog
width: 300
height: 300
enter: Transition {
NumberAnimation { properties: "x,y"; from: -300; to: 150; duration: 5000 }
}
Item { // WRAP IT IN THE ITEM -> WORKS FOR ME
anchors.fill: parent
Button {
anchors.centerIn: parent
}
}
}
Button {
text: 'open'
anchors.centerIn: parent
onClicked: dialog.open()
}
}
I have a ToolButton in QML with an image with size 48x48 pixels:
ToolButton {
contentItem: Image {
source: "Icons/idea48.png"
}
}
if I set width and height nothing changes:
ToolButton {
contentItem: Image {
source: "Icons/idea48.png"
width: 5
height: 5
}
}
on the screen it is still 48x48.
And even adding fill Mode does not help:
ToolButton {
visible: scene.serviceMode
contentItem: Image {
source: "Icons/idea48.png"
width: 10
height: 10
fillMode: Image.Stretch
sourceSize: {
width: 48
height: 48
}
}
}
the sourceSize should be 48 to render image with high pixel density.
I also tried to put Image inside Item, but with no success:
ToolButton {
contentItem: Item {
width: 24
height: 24
Image {
source: "Icons/idea48.png"
fillMode: Image.Stretch
sourceSize: {
width: 48
height: 48
}
}
}
}
Qt Quick Controls 2.3 (Qt 5.10) adds built-in support for button icons. By default, different styles may request different icon sizes, according to their design guidelines, but you can easily override the icon size.
ToolButton {
icon.width: 24
icon.height: 24
icon.source: "Icons/idea48.png"
}
What comes to high-DPI support, consider providing #Nx versions like the Gallery example does: http://code.qt.io/cgit/qt/qtquickcontrols2.git/tree/examples/quickcontrols2/gallery/icons/gallery?h=5.10
Answer 1
Set the sourceSize of the Image in order to influence its implicitWidth and implicitHeight, which are used by the ToolButton to determine the size of the contentItem.
import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3
ApplicationWindow {
visible: true
width: 640
height: 480
header: ToolBar {
RowLayout {
anchors.fill: parent
ToolButton {
contentItem: Image {
source: "Icons/idea48.png"
sourceSize.width: 10
sourceSize.height: 10
fillMode: Image.Pad
}
}
}
}
}
Answer 2
Put the Image inside an Item so that the Image is not resized by the ToolButton and its dimensions remain exactly as specified by width and height.
import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3
ApplicationWindow {
visible: true
width: 640
height: 480
header: ToolBar {
RowLayout {
anchors.fill: parent
ToolButton {
contentItem: Item {
Image {
source: "Icons/idea48.png"
width: 10
height: 10
}
}
}
}
}
}
Answer 3
Force the size of the contentItem.
import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3
ApplicationWindow {
visible: true
width: 640
height: 480
header: ToolBar {
RowLayout {
anchors.fill: parent
ToolButton {
contentItem: Image {
source: "Icons/idea48.png"
}
Component.onCompleted: {
contentItem.width = 10
contentItem.height = 10
}
}
}
}
}
I am making a music player application. i have a DownRect which has a slider and a playSection which has a button. this button has a audio. when button is clicked audio is played and i want the slider to set it's value by the audio duration. (the button is add dynamically from ButtonD.qml file). what i want to do is to connect DownRect's slider to playSection's button.
//DownRect.qml
Rectangle{
id: downRectangle
width: parent.width
height: parent.height
x:0
y:750
color: "#c62828"
smooth: true
Slider{
id: sliderDownRect
x: 300
y: 25
width: 650
from: 0
// to: play.duration
stepSize: 100
value: 0
Material.accent : Material.background
Material.foreground: Material.background
onValueChanged:{
}
}
}
and here is the ButtonD.qml file which i'd like to connect to DownRect.qml
//ButtonD.qml
Button{
id: buttonD
width:900
height: 46
flat: true
Audio{
id: playing
}
}
You make sure that the duration (and other relevant properties of Audio) are exposed in ButtonD.qml, e.g. by adding aliases like such:
Button {
id: buttonD
property alias duration: playing.duration
...
}
The same goes for the Slider's value.
Rectangle {
id: downRectangle
property alias duration: sliderDownRect.to
...
}
In the file that instantiates both, you use Binding-objects to create a bidirectional binding between the both. Those Binding-objects excell at working with dynamically instantiated objects.
Basically, if you'd include the files into one file, this should look something like this:
main.qml
import QtQuick 2.7
import QtQuick.Controls 2.0
import QtMultimedia 5.5
ApplicationWindow {
id: myWindow
visible: true
width: 600
height: 600
color: 'white'
property Item dynamicallyCreatedItem
Button {
x: 102
text: 'create'
onClicked: {
dynamicallyCreatedItem = Qt.createComponent('AudioButton.qml').createObject(myWindow.contentItem)
}
}
DownRect {
y: 50
id: rect
}
Binding {
target: rect
property: 'maxValue'
value: dynamicallyCreatedItem ? dynamicallyCreatedItem.duration : 0
when: dynamicallyCreatedItem
}
Binding {
target: rect
property: 'value'
value: dynamicallyCreatedItem ? dynamicallyCreatedItem.position : 0
when: dynamicallyCreatedItem
}
}
AudioButton.qml
import QtQuick 2.0
import QtQuick.Controls 2.0
import QtMultimedia 5.5
Button {
id: audioButton
onClicked: audio.play()
property alias duration: audio.duration
property alias position: audio.position
Audio {
id: audio
source: 'airhorn.wav'
}
}
DownRect.qml
import QtQuick 2.0
import QtQuick.Controls 2.0
Rectangle {
id: rect
width: parent.width
height: 50
property alias value: slider.value
property alias maxValue: slider.to
Slider {
id: slider
anchors.fill: parent
}
}
I have a problem with Layout.fillWidth property in the following code:
import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0
import QtQuick.Controls.Material 2.0
RowLayout {
spacing: 40
Rectangle {
color:"#39c605"
height:width
Layout.fillWidth: true
}
Rectangle {
color:"#39c605"
Layout.fillWidth: true
height:width
}
Rectangle {
color:"#39c605"
Layout.fillWidth: true
height:width
}
}
I can see the rectangles only when I change size of the window, but it'n't visible when the app is started.
Help me, please, to resolve this issue
Add:
main.qml
import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0
import QtQuick.Controls.Material 2.0
import "pages/"
ApplicationWindow {
id:mainWindows
visible: true
width:1280
height:720
title:qsTr("abc")
Material.theme: Material.Light
Material.accent: Material.LightGreen
Material.primary: Material.Blue
StackView {
id:homeView
anchors.fill: parent
initialItem:DataList{
}
}
}
QT 5.8
I have a QML singleton for use in styling defined as follows:
pragma Singleton
import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Controls.Styles 1.1
QtObject {
property ProgressBarStyle progressBarErrorStyle: ProgressBarStyle {
background: Rectangle {
radius: 2
color: "lightgray"
border.color: "gray"
border.width: 1
implicitWidth: 200
implicitHeight: 20
}
progress: Rectangle {
color: "orangered"
border.color: "red"
}
}
}
I'm able to import the object and use it, however progressBarErrorStyle is always given the type ProgressBarStyle_QMLTYPE_17. If I change it to a Rectangle, then it is correctly typed as QQuickRectangle.
The QtQuick.Controls.Styles import defines ProgressBarStyle, and in QtCreator I'm not getting any syntax errors... so why is my object given the wrong type at runtime?
You should use Component as the property type:
import QtQuick 2.2
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2
Rectangle {
property Component progressBarErrorStyle: ProgressBarStyle {
background: Rectangle {
radius: 2
color: "lightgray"
border.color: "gray"
border.width: 1
implicitWidth: 200
implicitHeight: 20
}
progress: Rectangle {
color: "orangered"
border.color: "red"
}
}
ProgressBar {
id: progressBar
NumberAnimation {
target: progressBar
property: "value"
to: 1
running: true
duration: 2000
}
style: progressBarErrorStyle
}
}
The components for styles are used in Loader items internally, which create instances of the components when they need to, just like delegates in Qt Quick's ListView, for example.