Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

How and where to start Qt5


  • Moderators

    @tomy said:

    Thank you all very much. You are really nice guys and I'm happy to be a member of here programming in Qt :)

    You're welcome! :)

    I like to first learn to write code for creating iOS and Android apps (applicable on smartphones). It is my first goal. After that I like to create programs for MS Windows.

    I think it's easier to learn how to create programs for Windows than for Android and iOS. Because of this, I recommend you first spend a few days learning how to build a simple Qt program for Windows. This experience will help you learn how to write and build Qt programs for Android and iOS.

    This is the sequence I recommend:

    1. Follow http://doc.qt.io/qt-5/gettingstartedqt.html closely. This teaches you how to use the Qt Creator IDE and build a small program for Windows.
    2. Follow http://doc.qt.io/qt-5/androidgs.html. This teaches you how to set up your system for creating Android apps.
    3. Follow http://doc.qt.io/qtcreator/creator-mobile-app-tutorial.html. This teaches you how to build a small program for Android and run it on your device.
    4. Follow http://doc.qt.io/qtcreator/creator-developing-ios.html. This teaches you how to set up your system for creating iOS apps.
    5. Go back to #3 and run the same program on your iOS device. (Note: You need to use OS X to develop iOS apps)

    Another note: In #1, you will use the C++ language and the Qt Widgets module. In #3, you will use the QML language and the Qt Quick module. Qt Widgets is easier for beginners to learn (especially if you already know C++), but Qt Quick is more suitable for mobile apps.

    Dear JKSH suggested a start point. Now, for example, how to start from http://doc.qt.io/qt-5/index.html and then find a link that points to http://doc.qt.io/qt-5/gettingstartedqt.html?
    That is, it's not clear how to use the documentation, at least in my experience.

    The Qt documentation uses a reference format. As you have found out, you shouldn't try to read it from start to finish like a book.

    Instead, use a search engine to find information about the topics that you are interested in. For example, you can fo to http://doc.qt.io/qt-5/index.html and type "getting started" into the search box.

    First I want (if you agree) to start from http://doc.qt.io/qt-5/index.html (because I think I should be familiar with Qt that what the Qt is at all) then find a link there that leads to http://doc.qt.io/qt-5/gettingstartedqt.html? (if it's good for my first directions that is being able to write iOS and Android apps).

    Personally, I think http://doc.qt.io/qt-5/index.html is not a good place to start. It leads to too many advanced topics, but It doesn't lead to http://doc.qt.io/qt-5/gettingstartedqt.html easily.



  • I thank both of you very much. I'm sorry for asking those many questions.
    According to what I understood from your explanations, I'm going to do the following works, respectively. If any work is not suitable for me or you don't recommend it to me, please aware me of that.

    1- First I go to qt-unified-windows-x86-online.exe. and install Qt creator in default mode. Although I have MS VS 2015 licensed installed on my Windows machine, but I don't like Qt creator as an add-in to it. I like to have Qt creator as a complete IDE on my system.

    2- Then after installing Qt creator I go through number 1 to number 5 of the last post of JKSH. I try to completely read and do the tasks/codes written there.

    3- Then, I install a Mac OS on as virtual machine on my Windows machine. I think I should install another Qt creator on it to begin to write codes for iOS. Am I right?

    4- And at the end, if I have any problem or question, I'll try to create a new thread about that or post the matter here.

    Do you guys agree with these please?



  • Don't know about your point number 3 (I don't develop for OS X and iOS) but the rest sounds like a good plan. And don't hesitate to ask the forum. Good luck, young Padawan! ;-)


  • Lifetime Qt Champion

    " I'm sorry for asking those many questions."

    Well we kind lurk around here hoping people will in fact, ask questions :)

    One note for 1:
    You can use VS with Creator. as its compiler. So its also a full solution.
    That said. Its less fuss just to use mingw
    and install and have all just work out of the box.



  • @Wieland said:

    Don't know about your point number 3 (I don't develop for OS X and iOS) but the rest sounds like a good plan. And don't hesitate to ask the forum. Good luck, young Padawan! ;-)

    Thanks. I appreciate your helps :-)

    @mrjj said:

    " I'm sorry for asking those many questions."
    Well we kind lurk around here hoping people will in fact, ask questions :)

    Thank you. :-) That's very kind of you.

    @mrjj said:

    One note for 1:
    You can use VS with Creator. as its compiler. So its also a full solution.
    That said. Its less fuss just to use mingw
    and install and have all just work out of the box.

    I'm sorry I didn't understand the above part completely. I'm not an English native speaker. :(
    Do you mean that I can use Qt creator with VS 2015? Is it like an add-in item? Can it offer all of the stuff the Qt creator as a separate program offer? If so and you recommend it to me, where and how can I install it on my VS please?


  • Lifetime Qt Champion

    note part 1:
    I was trying to say that using visual studio can also be good.
    However, vs 2015 is so new that im not sure there is good support yet.
    So I suggest just use the standard setup so U can get going fast.
    sorry for the confusion.



  • @mrjj said:

    note part 1:
    I was trying to say that using visual studio can also be good.
    However, vs 2015 is so new that im not sure there is good support yet.
    So I suggest just use the standard setup so U can get going fast.

    OK. I tried to install Qt creator in its normal way (connecting to the Qt resources) but faced an error. It's in the link below:
    http://uploads.im/QXBsp.png
    Is there any other way to download that Qt creator completely as a file please?

    @mrjj said:

    sorry for the confusion.

    Not at all, that's fine :-)


  • Lifetime Qt Champion

    hi
    http://download.qt.io/official_releases/qt/5.5/5.5.1/qt-opensource-windows-x86-mingw492-5.5.1.exe
    Note: this is full packet and do not use visual studio but mingw compiler.



  • @mrjj said:

    http://download.qt.io/official_releases/qt/5.5/5.5.1/qt-opensource-windows-x86-mingw492-5.5.1.exe

    Thanks. I'm downloading it now. But one small question! In the normal method (downloading through Qt) that installation would occupy about 3.8 GB on the computer but this file's size is even less than 1 GB! should I update/add the missed stuff to that smaller one after installing?


  • Lifetime Qt Champion

    hi u get a maintenance tool that can update stuff/add elements.



  • Thank you.


  • Lifetime Qt Champion

    @tomy
    as final remark.
    this book
    http://www.bogotobogo.com/cplusplus/files/c-gui-programming-with-qt-4-2ndedition.pdf
    i found pretty ok when starting with qt.
    Its for qt4 but much of it still the same in Qt5.5.


  • Lifetime Qt Champion

    To develop for iOS and OS X you will indeed need to install Qt Creator on your Mac machine (be it virtual or not) but you will be using the same for both platform. Xcode is mandatory to develop for OS X and iOS. It provides the SDKs and emulators needed as well as the software stack needed to connect to your device and make your application available through the App Store.



  • @mrjj said:

    @tomy
    as final remark.
    this book
    http://www.bogotobogo.com/cplusplus/files/c-gui-programming-with-qt-4-2ndedition.pdf
    i found pretty ok when starting with qt.
    Its for qt4 but much of it still the same in Qt5.5.

    I have that book but haven't read it still! I like to start straightly with Qt5. Anyway, thanks for your remarks :-)

    @SGaist said:

    To develop for iOS and OS X you will indeed need to install Qt Creator on your Mac machine (be it virtual or not) but you will be using the same for both platform. Xcode is mandatory to develop for OS X and iOS. It provides the SDKs and emulators needed as well as the software stack needed to connect to your device and make your application available through the App Store.

    Thanks, these are great info. Now I've VmWare workstation containing Win XP, Win 10, Linux(Ubuntu) and FreeBSD installed on my Win 7 machine. I'll add another virtual machine (the Mac OS) on it before starting developing iOS apps.
    Thanks. :-)



  • Hi guys,

    Along the way I chose for starting to learn Qt 5, I went to create a Qt Quick Application in here: http://doc.qt.io/qtcreator/qtcreator-transitions-example.html
    Now one of my problems is that I cannot find that (Export) button (said in item #11 of Creating the Main View section of the above link) in the navigator pane on my Qt creator IDE :-(
    Can anybody please help me?



  • @tomy This button is aside the "eye" button for each element listed in the navigator pane.
    In the example, in the bottom left, you will see the navigator panel. The panel contains Item which contains "Icon" and at the end of this "Icon" row you will find the toggle property export and toggle visibity controls.
    Hope this helps. If not just send me a screenshot and I will return it to you with a marking.



  • @Charby said:

    @tomy This button is aside the "eye" button for each element listed in the navigator pane.
    In the example, in the bottom left, you will see the navigator panel. The panel contains Item which contains "Icon" and at the end of this "Icon" row you will find the toggle property export and toggle visibity controls.
    Hope this helps. If not just send me a screenshot and I will return it to you with a marking.

    Thanks for the reply.
    I retried that application creation for 5 times from beginning to the end, but neither that export button appeared nor my code (the one below) is exactly like this (http://doc.qt.io/qtcreator/qtcreator-transitions-mainform-ui-qml.html) :-(
    I don't know how I can learn Qt from the documentation if I have those many problems at the first step! :-( Very disappointing.

    import QtQuick 2.5
    import QtQuick.Controls 1.4
    import QtQuick.Layouts 1.2

    Item {
    id: item1
    width: 640
    height: 480

    property alias button1: button1
    property alias button2: button2
    
    Image {
        id: icon
        x: 10
        y: 20
        source: "qt-logo.PNG"
    }
    
    Rectangle {
        id: topLeftRect
        width: 46
        height: 55
        color: "#00000000"
        radius: 6
        anchors.left: parent.left
        anchors.leftMargin: 10
        anchors.top: parent.top
        anchors.topMargin: 20
        border.color: "#808080"
        
        MouseArea {
            id: mouseArea1
            anchors.fill: parent
        }
    }
    
    Rectangle {
        id: middleRightRect
        x: -9
        y: -7
        width: 46
        height: 55
        color: "#00000000"
        radius: 6
        anchors.right: parent.right
        anchors.rightMargin: 10
        anchors.horizontalCenter: parent.horizontalCenter
        border.color: "#808080"
        MouseArea {
            id: mouseArea2
            anchors.fill: parent
        }
    }
    
    Rectangle {
        id: bottomLeftRect
        y: 1
        width: 46
        height: 55
        color: "#00000000"
        radius: 6
        anchors.left: parent.left
        anchors.leftMargin: 10
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 20
        border.color: "#808080"
        MouseArea {
            id: mouseArea3
            anchors.fill: parent
        }
    }
    

    }

    Apparently uploading images to the posts is not allowed so I uploaded my design page of the IDE of that code here: http://uploads.im/ip2hb.png


  • Moderators

    @tomy said:

    I uploaded my design page of the IDE of that code here: http://uploads.im/ip2hb.png

    The "Export" button is a new feature in Qt Creator 3.6. It looks like you are using Qt Creator 3.5 (which is the version that was bundled with Qt 5.5.1)

    If you want to use that tutorial as a starting point, you have 2 options:

    1. Use the older version of the documentation. In Qt Creator 3.5, click Help -> Index and search for "Creating a Qt Quick Application", OR
    2. Go to http://www.qt.io/download-open-source/ and download Qt Creator 3.6 (Note: This means you will have 2 copies of Qt Creator on your system)


  • As a rank beginner myself I'm following this thread with some interest.
    Please view this post as beginner's notes to add to advice you receive from experts.

    I had to jump through the same hoops in getting Qt 5.5.1 up and running.
    Recently I started on my Qt 5+ learning curve by first installing the older version of Qt 4 from Ubuntu Software Centre. But I soon realised that I needed Qt 5.5.1.
    So I uninstalled all older versions of Qt to avoid conflicts and started afresh.
    It seems that you are on Windows 64 and previously you installed Qt 5.1.0.
    My experiences are on Linux Ubuntu 14.04 32bit.
    However I see that you have installed several OS virtual machines including Ubuntu so you could use Ubuntu VM to try the following Qt 5.5.1 installation workflow.

    http://softmemos.blogspot.co.uk/2015/11/qt551-on-ubuntu-1404-at-virtualbox.html

    Note: VirtualBox is similar to VMWare.

    I followed just Step 2A: The easy way
    and Qt 5.5.1 was installed successfully in directory /opt/qt55 (I didn't use /opt/qt5.5.1 as suggested).

    More details here on Qt 5.5.1 PPA installation on Ubuntu ..
    https://launchpad.net/~beineri/+archive/ubuntu/opt-qt551-trusty

    After installation run terminal commands

    qtchooser -print-env
    and
    qmake -v

    Now since I wanted Python bindings and to use eric6 Python IDE I next installed PyQt5.
    https://www.riverbankcomputing.com/software/pyqt/download5
    Prerequisites .. qscintilla and eric6 installation advice found here ...
    http://stackoverflow.com/questions/30730288/how-do-i-compile-qscintilla-and-eric6-on-linux

    After all this I now have under Applications > Programming these launchers

    eric6
    Qt 5.5 Assistant
    Qt 5.5 Creator (this is Qt Creator 3.6.0 based on Qt 5.5.1)
    Qt 5.5 Designer
    Qt 5.5 Linguist

    I use Sublime Text 3 as my editor.

    eric6 launches Qt 5.5 Designer from its IDE.
    ...

    Regarding getting into Qt 5.5.1 I refer to examples in Qt Creator to get an idea of the app layout.
    Qt 5 + documentation does seem to be scattered around so it helps to keep notes.
    I use CherryTree from http://www.giuspen.com/cherrytree/ as notes manager.
    ...

    This book can be added to your reading list.
    https://qmlbook.github.io/



  • Thank you very much eureka for your comprehensive explanations. I want to firstly go for Qt on Windows. Some later time I may go for it on Linux. At that time I will follow and do your instructions carefully. :-)

    Thank you JKSH.
    I went for your link and the system is downloading it. But apparently this one is also Qt creator 5.5! Further more, I had tried downloading the Qt using that file before. And I had faced an error when downloading. The error at the time was: http://uploads.im/QXBsp.png
    But this I hope it can be downloaded successfully.

    If that version be downloaded, is it the most recent version (Qt creator 3.6) please?


  • Moderators

    @tomy said:

    I went for your link and the system is downloading it. But apparently this one is also Qt creator 5.5!

    It is useful to know the difference between Qt and Qt Creator:

    • Qt is the library. Qt contains the C++ classes that you can use in your app. The latest version is Qt 5.5.1.
    • Qt Creator is the Integrated Development Environment (IDE). Qt Creator lets you manage multiple compilers and multiple versions of Qt. It also lets you write code and compile your app. The latest version is Qt Creator 3.6.0.

    If you install Qt, it gives you the Qt library AND the Qt Creator IDE. However, Qt 5.5.1 only comes with Qt Creator 3.5.1.

    If you install Qt Creator, you only get the IDE.

    Right now, you already have Qt 5.5 and Qt Creator 3.5 in your system. You want to install Qt Creator 3.6, so you don't need to download Qt anymore.

    Go to http://www.qt.io/download-open-source/ and click on "Qt Creator". Then, click on "Qt Creator 3.6.0 for Windows (80 MB)".


  • Moderators

    After you install Qt Creator 3.6.0, you need to do some setup, because does not know about the previous version that you installed:

    1. See Adding Compilers to tell Qt Creator where to find your compiler.
    2. See Adding Qt Versions to tell Qt Creator where to find the Qt binaries.
    3. Finally, see Adding Kits to tell Qt Creator how to combine your compiler with the Qt binaries.


  • @JKSH said:

    However, Qt 5.5.1 only comes with Qt Creator 3.5.1.

    I my Qt 5.5.1 installation (Ubuntu 14.04) when I click on Qt 5.5 Creator > Help
    I see ... "Qt Creator 3.6.0
    Based on Qt 5.5.1 (GCC 4.8.4, 32 bit)"

    just to add to the confusion.



  • @JKSH said:
    Right now, you already have Qt 5.5 and Qt Creator 3.5 in your system.

    But surely the version of Qt shown in this link refers to Qt 5.1.0 .. not Qt 5.5?
    http://uploads.im/QXBsp.png
    /qt5/qt.510.win64_msvc2012_64 ... etc


  • Moderators

    @eureka said:

    @JKSH said:

    However, Qt 5.5.1 only comes with Qt Creator 3.5.1.

    I my Qt 5.5.1 installation (Ubuntu 14.04) when I click on Qt 5.5 Creator > Help
    I see ... "Qt Creator 3.6.0
    Based on Qt 5.5.1 (GCC 4.8.4, 32 bit)"

    just to add to the confusion.

    Did you use the Online installer? That lets you install multiple versions of Qt, and lets you upgrade Qt Creator to the latest version.

    The Offline installer doesn't provide that. It only contains one fixed version of Qt and one fixed version of Qt Creator.

    But surely the version of Qt shown in this link refers to Qt 5.1.0 .. not Qt 5.5?
    http://uploads.im/QXBsp.png
    /qt5/qt.510.win64_msvc2012_64 ... etc

    Yes, that image shows an attempt to download Qt 5.1.0 via the Online installer.

    But before that, @tomy already installed Qt 5.5.1 + Qt Creator 3.5.1 (using the Offline installer): https://forum.qt.io/topic/63499/how-and-where-to-start-qt5/21



  • @JKSH said:

    After you install Qt Creator 3.6.0, you need to do some setup, because does not know about the previous version that you installed:

    1. See Adding Compilers to tell Qt Creator where to find your compiler.
    2. See Adding Qt Versions to tell Qt Creator where to find the Qt binaries.
    3. Finally, see Adding Kits to tell Qt Creator how to combine your compiler with the Qt binaries.

    Since I had the file qt-opensource-windows-x86-mingw492-5.5.1 (size = 997 MB) on my system so first I uninstalled it and tried to install Qt creator though the online method via that small file. And then when you said it's not needed to download/install Qt creator that way because I had it already, so I canceled the process and reinstalled the file above (997 MB) and then went for Qt Creator 3.6.0 for Windows (80 MB). Now I have two Qt creator icons on my desktop named Qt Creator 3.6.0 and Qt Creator (Community).
    PS: When I installed the Qt creator (the 997 MB one) I selected all the options:
    http://uploads.im/RuZQ9.png

    Now the tasks I have done are:
    For the #1 (Adding Compilers) whatever I could to do is in the link below:
    http://uploads.im/5K23g.png
    The Compiler path field and Platform codegen flags field are empty. I don't know the path of what file I should insert into those paths.

    For the #2 (Adding Qt Versions) I did this: http://uploads.im/mgBTo.png
    And for the #3 (Adding Kits) I did this: http://uploads.im/kufsC.png

    Then I recreated the project and the Export icons appeared this time :-)
    Isn't there any wrong done task in my works please?
    And which one of the Qt creator apps should I use for my projects, Qt Creator 3.6.0 or Qt Creator (Community) from now on please?


  • Moderators

    @tomy said:

    Since I had the file qt-opensource-windows-x86-mingw492-5.5.1 (size = 997 MB) on my system so first I uninstalled it and tried to install Qt creator though the online method via that small file. And then when you said it's not needed to download/install Qt creator that way because I had it already, so I canceled the process and reinstalled the file above (997 MB) and then went for Qt Creator 3.6.0 for Windows (80 MB).

    That's fine.

    Now I have two Qt creator icons on my desktop named Qt Creator 3.6.0 and Qt Creator (Community).

    Yes, that's expected.

    The ideal way is to use the online installer. However, since you are experiencing errors, we won't use that. (There is a way to work around that error, but it involves lots of extra work)

    PS: When I installed the Qt creator (the 997 MB one) I selected all the options:
    http://uploads.im/RuZQ9.png

    That's fine.

    Now the tasks I have done are:
    For the #1 (Adding Compilers) whatever I could to do is in the link below:
    http://uploads.im/5K23g.png
    The Compiler path field and Platform codegen flags field are empty. I don't know the path of what file I should insert into those paths.

    For the #2 (Adding Qt Versions) I did this: http://uploads.im/mgBTo.png
    And for the #3 (Adding Kits) I did this: http://uploads.im/kufsC.png

    Isn't there any wrong done task in my works please?

    Everything looks good! I don't see anything wrong.

    And which one of the Qt creator apps should I use for my projects, Qt Creator 3.6.0 or Qt Creator (Community) from now on please?

    Use Qt Creator 3.6.0, since it has more features and bugfixes.

    (http://code.qt.io/cgit/qt-creator/qt-creator.git/tree/dist/changes-3.6.0.md?h=3.6 shows you all the improvements that Qt Creator 3.6.0 has, compared to Qt Creator 3.5.1)

    Then I recreated the project and the Export icons appeared this time :-)

    Great! :)



  • Thank you very much dear JKSH.

    After finishing the design part. I went to the Adding Application Logic section of this attempt. And continued until #7 and pressed Ctrl+R to run the application.
    I got these from the Application Output window:

    *The program has unexpectedly finished.
    C:\Users\CS\Documents\build-test1-Desktop-Debug\debug\test1.exe crashed
    
    Starting C:\Users\CS\Documents\build-test1-Desktop-Debug\debug\test1.exe...
    QML debugging is enabled. Only use this in a safe environment.
    QQmlApplicationEngine failed to load component
    qrc:/main.qml:25 Type MainForm unavailable
    qrc:/MainForm.ui.qml:73 Syntax error
    
    The program has unexpectedly finished.
    C:\Users\CS\Documents\build-test1-Desktop-Debug\debug\test1.exe crashed
    
    Starting C:\Users\CS\Documents\build-test1-Desktop-Debug\debug\test1.exe...
    QML debugging is enabled. Only use this in a safe environment.
    QQmlApplicationEngine failed to load component
    qrc:/main.qml:25 Type MainForm unavailable
    qrc:/MainForm.ui.qml:73 Syntax error
    
    The program has unexpectedly finished.
    C:\Users\CS\Documents\build-test1-Desktop-Debug\debug\test1.exe crashed
    
    Starting C:\Users\CS\Documents\build-test1-Desktop-Debug\debug\test1.exe...
    QML debugging is enabled. Only use this in a safe environment.
    QQmlApplicationEngine failed to load component
    qrc:/main.qml:25 Type MainForm unavailable
    qrc:/MainForm.ui.qml:73 Syntax error
    
    The program has unexpectedly finished.
    C:\Users\CS\Documents\build-test1-Desktop-Debug\debug\test1.exe crashed
    Starting C:\Users\CS\Documents\build-test1-Desktop-Debug\debug\test1.exe...
    QML debugging is enabled. Only use this in a safe environment.
    QQmlApplicationEngine failed to load component
    qrc:/main.qml:25 Type MainForm unavailable
    qrc:/MainForm.ui.qml:12 Invalid alias reference. Unable to find id "mouseArea3"*
    

    And this is the code for my MainForm.ui.qml file:

    import QtQuick 2.5
    import QtQuick.Controls 1.4
    import QtQuick.Layouts 1.2
    
    Item {
        id: item1
        width: 640
        height: 480
        property alias bottomLeftRect: bottomLeftRect
        property alias topLeftRect: topLeftRect
        property alias icon: icon
        property alias mouseArea3: mouseArea3
        property alias mouseArea2: mouseArea2
        property alias middleRightRect: middleRightRect
        property alias mouseArea1: mouseArea1
    
        Image {
            id: icon
            x: 10
            y: 20
            source: "qt-logo.PNG"
        }
    
        Rectangle {
            id: topLeftRect
            width: 46
            height: 55
            color: "#808080"
            radius: 6
            anchors.left: parent.left
            anchors.leftMargin: 10
            anchors.top: icon.bottom
            anchors.topMargin: 20
    
            MouseArea {
                onClicked: stateGroup.state = ' '
            }
        }
    
        Rectangle {
            id: middleRightRect
            x: -4
            y: 9
            width: 46
            height: 55
            color: "#808080"
            radius: 6
            anchors.right: parent.right
            anchors.rightMargin: 10
            anchors.horizontalCenter: parent.horizontalCenter
            MouseArea {
                 onClicked: stateGroup.state = 'State1'
            }
        }
    
        Rectangle {
            id: bottomLeftRect
            x: -1
            y: -3
            width: 46
            height: 55
            color: "#808080"
            radius: 6
            anchors.bottom: parent.bottom
            anchors.bottomMargin: 20
            MouseArea {
               onClicked: stateGroup.state = 'State2'
            }
            anchors.left: parent.left
            anchors.leftMargin: 10
        }
        StateGroup {
               id: stateGroup
               states: [
                   State {
                       name: "State1"
    
                       PropertyChanges {
                           target: page.icon
                           x: page.middleRightRect.x
                           y: page.middleRightRect.y
                       }
                   },
                   State {
                       name: "State2"
    
                       PropertyChanges {
                           target: page.icon
                           x: page.bottomLeftRect.x
                           y: page.bottomLeftRect.y
                       }
                   }
               ]
        }
     }
    

    And this one is the code for my main.qml file:

    import QtQuick 2.5
    import QtQuick.Controls 1.4
    import QtQuick.Dialogs 1.2
    
    ApplicationWindow {
        visible: true
        title: qsTr("Transitions")
        width: 330
        height: 330
    
        menuBar: MenuBar {
            Menu {
                title: qsTr("File")
                MenuItem {
                    text: qsTr("&Open")
                    onTriggered: console.log("Open action triggered");
                }
                MenuItem {
                    text: qsTr("Exit")
                    onTriggered: Qt.quit();
                }
            }
        }
    
        MainForm {
            anchors.fill: parent
                    id: page
        }
    
        MessageDialog {
            id: messageDialog
            title: qsTr("May I have your attention, please?")
    
            function show(caption) {
                messageDialog.text = caption;
                messageDialog.open();
            }
        }
    }
    
    

    I tried to do my best according to the instructions given by that program, but I don't know how to solve the issues.
    Would you guys please help me?


  • Moderators

    @tomy said:

    qrc:/MainForm.ui.qml:12 Invalid alias reference. Unable to find id "mouseArea3"

    What happens if you delete the line, property alias mouseArea3: mouseArea3 ? (In fact, delete the lines for mouseArea1 and mouseArea2 too)



  • Just as usual, your advice helped me. Thanks :-)

    It ran, but who was the faulty? Was it me? That is, as I said, I did my best when following the instructions (and most of the work is remained still), so why did I get that error?

    I asked this because my purpose is learning Qt and I need to write and run many many programs in Qt (as I have experienced it in C++ using the MS VS compiler) and I should learn them so that I be able to handle the errors for my programs.

    And there should be some way to get used to dealing with those codes. I have learnt using functions, pointers, references, exceptions, classes, templates and ... from C++ but the Qt codes don't seem to be much like C++!



  • @tomy For what it worth, I have learnt QML without the editor, as I thing it help to have a better understanding of it. Furthermore the QML together with its declarative paradigm is so simple that I still never use the UI designer...Regarding your problem, it was clearly the property aliases pointing to not existing anymore elements...



  • @Charby said:

    Regarding your problem, it was clearly the property aliases pointing to not existing anymore elements...

    But those mouseAreas still exist in the design mode!
    And why didn't the instruction tell me that they are redundant and I should remove them please!?



  • I went for doing the Adding Animation to the View part. There were problems. The more time I spend on these tutorials the more I be sure that they are not well designed (of course to me).

    I appreciate all the helps of you nice guys and also even the designers of the Documentations. I think they are not a good point to start for beginners. I'm sorry for saying that but it's what I experienced through these days reading them and working on applications.

    I think I had better use a book.


  • Moderators

    @tomy said:

    Just as usual, your advice helped me. Thanks :-)

    You're welcome :)

    It ran, but who was the faulty? Was it me? That is, as I said, I did my best when following the instructions (and most of the work is remained still), so why did I get that error?

    It wasn't you.

    Unfortunately, it looks like there is a bug in the Qt Quick Designer... it should not have left mouseArea1, mouseArea2, and mouseArea3 in MainForm.ui.qml...

    the Qt codes don't seem to be much like C++!

    That's because you were using QML, not C++. See http://doc.qt.io/qt-5/qmlapplications.html. QML is a new language, invented by Nokia, for creating mobile phone applications.

    Back in https://forum.qt.io/topic/63499/how-and-where-to-start-qt5/13 I recommended that you start with http://doc.qt.io/qt-5/gettingstartedqt.html -- this uses C++ (although it also has a C++ widgets designer).

    I'm sorry for saying that but it's what I experienced through these days reading them and working on applications.

    I think I had better use a book.

    No need to apologize. You genuinely had a bad experience from that tutorial, and personally I also think it's more complex than necessary.

    In fact, even http://doc.qt.io/qt-5/gettingstartedqt.html is a bit more complex than necessary.

    The best C++ Qt tutorial I've seen is https://doc.qt.io/archives/4.3/tutorial-t1.html -- it starts out very simple and gradually adds more features. It doesn't use a Designer, everything is pure C++ code. They even have a line-by-line walkthrough, where they explain what every bit of code does. It's a shame they removed this tutorial from recent versions of Qt.

    Would you still be willing to give https://doc.qt.io/archives/4.3/tutorial-t1.html a chance? It was back in Qt 4.3, but it is still perfectly valid for Qt 5.5. If you're willing, here's what you should do:

    1. In Qt Creator, go to File -> New File or Project... -> Projects -> Application -> Qt Widgets Application (not Qt Quick Controls Application)
    2. Remove all the code from main.cpp. Replace it with the tutorial's code.
    3. At the bottom of the tutorial, ignore the instructions about using qmake. Instead, just press "Ctrl+R" like you did with the 1st tutorial.
    4. Try to do the "Exercises" part at the bottom of the tutorial.
    5. Continue to do Chapters 2, 3, 4, 5, 6 and 7. (Chapter 8 onwards isn't as useful)


  • @JKSH said:

    No need to apologize. You genuinely had a bad experience from that tutorial, and personally I also think it's more complex than necessary.

    I do agree with you. I don't know why the designers of the documentations have arranged them that way. To me, they can very easily confuse any beginner.

    In fact, even http://doc.qt.io/qt-5/gettingstartedqt.html is a bit more complex than necessary.

    Exactly. I'd like to suggest the designers to have a look at the one you named "the best C++ tutorial" and rearrange their valuable contents that way to be as much useful as they can be.

    The best C++ Qt tutorial I've seen is https://doc.qt.io/archives/4.3/tutorial-t1.html -- it starts out very simple and gradually adds more features. It doesn't use a Designer, everything is pure C++ code.

    Yes, it really is. Thanks so much for introducing it to me. :-)
    I'm in chapter 6 now and the codes are really straightforward and easy to follow. And since they are in C++, dealing with them for me is very easy and just as usual with my previous coding on MS VS while using C++.

    They even have a line-by-line walkthrough, where they explain what every bit of code does. It's a shame they removed this tutorial from recent versions of Qt.

    Yes. I read them and also have done all of the exercises until now. :-)

    Would you still be willing to give https://doc.qt.io/archives/4.3/tutorial-t1.html a chance? It was back in Qt 4.3, but it is still perfectly valid for Qt 5.5. If you're willing, here's what you should do:

    1. In Qt Creator, go to File -> New File or Project... -> Projects -> Application -> Qt Widgets Application (not Qt Quick Controls Application)
    2. Remove all the code from main.cpp. Replace it with the tutorial's code.

    As I said, I looked and have read this tut so far. I think I should thank you so much that you cared about me and gave me another change to work on Qt while being connected with this website. :-) You are a really nice person. :-)

    1. At the bottom of the tutorial, ignore the instructions about using qmake. Instead, just press "Ctrl+R" like you did with the 1st tutorial.

    But why please?
    I ran cmd.exe by the start menu (of my Windows machine) then gave the path of Qt creator 3.6.0 (instead of Qt creator community) to that command prompt and then for each chapter of the tut I typed the following commands each one followed by hitting the enter key:
    qmake -project
    qmake

    But I don't know what happened afterwards!
    I read some about it but it isn't clear for me still. Let me please ask some questions on qmake!

    1- Why should (not) I use qmake?
    2- What is its use for?
    3- When and how can I use it and get its benefits?

    1. Try to do the "Exercises" part at the bottom of the tutorial.
    2. Continue to do Chapters 2, 3, 4, 5, 6 and 7. (Chapter 8 onwards isn't as useful)

    OK but what after chapter 7 please? Those codes are very exciting!
    I also found this. Do you recommend that I go about reading it then?


  • Moderators

    @tomy said:

    I'd like to suggest the designers to have a look at the one you named "the best C++ tutorial" and rearrange their valuable contents that way to be as much useful as they can be.

    You can submit suggestions to https://bugreports.qt.io/ (log in with the same account as you use for this forum). If you do, please post a link here so that others can follow it.

    I'm in chapter 6 now and the codes are really straightforward and easy to follow.
    ...
    I read them and also have done all of the exercises until now. :-)

    Wow, you're fast. Well done!

    I ran cmd.exe by the start menu (of my Windows machine) then gave the path of Qt creator 3.6.0 (instead of Qt creator community) to that command prompt and then for each chapter of the tut I typed the following commands each one followed by hitting the enter key:
    qmake -project

    This command asks qmake to produce a *.pro file.

    qmake

    This command asks qmake to read the *.pro file, and use it to produce a Makefile.

    After this, you can use nmake (from Visual Studio) or mingw32-make (from MinGW) to use the Makefile to compile your program.

    But I don't know what happened afterwards!
    ...
    1- Why should (not) I use qmake?

    See my answer for #3 below.

    2- What is its use for?

    See my answers above ("This command asks qmake to...")

    3- When and how can I use it and get its benefits?

    Qt Creator already gives you the benefits automatically:

    • When you created a new project, Qt Creator already produced a *.pro file for you (see the top-left corner of your window when you are editing your code). So, you don't need to call qmake -project yourself.
    • When you press Ctrl+R, Qt Creator calls qmake for you. first, and then runs nmake/mingw32-make for you. So, you don't need to call qmake yourself.

    If you want to see this in action, create a new Qt Widgets Application project and press Ctrl+R. Then, click "Window" -> "Output Panes -> "Compile Output". Read what's there -- this is like a "command prompt".

    OK but what after chapter 7 please? Those codes are very exciting!

    It's great to see your enthusiasm :)

    If you want to continue Chapters 7 - 14, you can. I think it is still valuable experience for learning Qt's C++ API style. However, these chapters use the Graphics View Framework (see http://doc.qt.io/qt-5/graphicsview.html for info).

    I think you will not likely use the Graphics View Framework in a real project. For a desktop project, Qt Widgets are great. However, for Android/iOS projects, you should learn Qt Quick/QML.

    I also found this. Do you recommend that I go about reading it then?

    The updated version of this manual is at http://doc.qt.io/qt-5/qtdesigner-manual.html . This manual tells you about the Qt Widgets Designer. I don't think it's useful to read it from start to finish.

    Instead, I suggest the following:

    1. Do http://doc.qt.io/qtcreator/creator-writing-program.html. This is a very simple tutorial that teaches you how to use the Designer.
    2. Do http://doc.qt.io/qt-5/gettingstartedqt.html. I think you should be ready to follow this tutorial without problems.
    3. (Simple Exercise) Re-implement MyWidget from https://doc.qt.io/archives/4.3/tutorial-t5.html using the Qt Designer, instead of typing pure C++ code.
    4. (Advanced Exercise) Re-implement LCDRange AND MyWidget from https://doc.qt.io/archives/4.3/tutorial-t6.html using Qt Designer, instead of typing pure C++ code.
    5. Think about your experiences so far. Which do you like better: Writing pure C++ code, or using Qt Designer? Can you see any advantages in the method that you don't like?


  • This is the link of the thread I posed the problem of the documentations on the bugreports.
    https://bugreports.qt.io/browse/QTBUG-50944
    I did it and hope they make some changes. :-)

    Thanks for the explanations on qmake.
    If I think that you know my purposes on learning Qt, in what step(s) of my road-map do you think I will need to use qmake?

    Do http://doc.qt.io/qtcreator/creator-writing-program.html. This is a very simple tutorial that teaches you how to use the Designer.

    I did those instructions just like what have been said. The project was good. I had no real difficulty. Although my problem is usually with the functions that are used in the source codes, but I understood all of them in this project well.
    Thanks for introducing it.

    Do http://doc.qt.io/qt-5/gettingstartedqt.html. I think you should be ready to follow this tutorial without problems.

    This one also a good one. The outcome (of my experience) was like the previous project. But some point: I haven't learnt to use qmake still (unfortunately)! And I couldn't do the part Building and Running from the Command Line :-( The instructions are not simple and clear apparently.
    If you teach me (of course if it's possible) how to use it for that project, I'll learn it for the rest.

    (Simple Exercise) Re-implement MyWidget from https://doc.qt.io/archives/4.3/tutorial-t5.html using the Qt Designer, instead of typing pure C++ code.

    Yes, I did it. It was just dealing with the Widgets and Properties on the Design mode. For the Signal and Slot for Lcd and Slider, I used the Edit Signals/Slots (f4) button on the toolbar and didn't wrote any code for it! I don't know it was the method you wanted I use or not.

    (Advanced Exercise) Re-implement LCDRange AND MyWidget from https://doc.qt.io/archives/4.3/tutorial-t6.html using Qt Designer, instead of typing pure C++ code.
    Hint 1: You will need to create 2 separate classes in Qt Designer. Go to File -> New File or Project... -> Files and Classes -> Qt -> Qt Designer Form Class
    Hint 2: You will need to Promote a widget. See http://doc.qt.io/qt-5/designer-using-custom-widgets.html

    I tried several ways to build a class below the other one. I also tried to understand the link and do what is needed. Since I hadn't learnt a lesson on solving exercises like this before, I couldn't rely on my guesses too much. Although I found many traces but was not able finally. The solution was somewhat vague for me. Sorry anyway.

    Think about your experiences so far. Which do you like better: Writing pure C++ code, or using Qt Designer? Can you see any advantages in the method that you don't like?

    I like to answer to these when I solve the advanced exercise. To be honest, I don't fear the hard exercises but what I need is to be familiar with an instance of some exercise then solve the harder one :-)

    Thanks so much for your time. I'm really uncomfortable if I'm bothering you by those many questions and problems.


  • Moderators

    @tomy said:

    This is the link of the thread I posed the problem of the documentations on the bugreports.
    https://bugreports.qt.io/browse/QTBUG-50944
    I did it and hope they make some changes. :-)

    Thanks for submitting!

    in what step(s) of my road-map do you think I will need to use qmake?

    I don't think you need to learn how to run qmake from the command line.

    I haven't learnt to use qmake still (unfortunately)! And I couldn't do the part Building and Running from the Command Line :-( The instructions are not simple and clear apparently.
    If you teach me (of course if it's possible) how to use it for that project, I'll learn it for the rest.

    You already ran qmake. You did it when you pressed Ctrl+R in your project.

    (Simple Exercise) Re-implement MyWidget from https://doc.qt.io/archives/4.3/tutorial-t5.html using the Qt Designer, instead of typing pure C++ code.

    Yes, I did it. It was just dealing with the Widgets and Properties on the Design mode. For the Signal and Slot for Lcd and Slider, I used the Edit Signals/Slots (f4) button on the toolbar and didn't wrote any code for it! I don't know it was the method you wanted I use or not.

    Yes, that's what I meant.

    I tried several ways to build a class below the other one. I also tried to understand the link and do what is needed. Since I hadn't learnt a lesson on solving exercises like this before, I couldn't rely on my guesses too much. Although I found many traces but was not able finally. The solution was somewhat vague for me. Sorry anyway.

    1. Create a LCDRange Qt Designer Form Class (lcdrange.ui).
    2. Fully implement LCDRange like you did in the Simple Exercise.
    3. Create a MyWidget Qt Designer Form Class (mywidget.ui).
    4. Open MyWidget in Qt Designer. Drag a blank QWidget onto the MyWidget.
    5. Right-click the blank QWidget and select "Promote to..."
    6. Under "New Promoted Class", add
      • Base class name: "QWidget"
      • Promoted class name: "LCDRange"
      • Header file: "lcdrange.h"
      • Global include: YES
    7. Click "Add"
    8. Select "Promoted Classes" -> "LCDRange" and click "Promote".
    9. In main.cpp, create a MyWidget object and show() it.
    10. Press Ctrl+R to build and run your project. Does your LCDRange appear?
    11. Open MyWidget in Qt Designer again.
    12. Add 8 more blank QWidgets and promote them to LCDRanges. Put them in a grid layout.
    13. Press Ctrl+R to build and run your project. Do all 9 LCDRanges appear?

    I like to answer to these when I solve the advanced exercise. To be honest, I don't fear the hard exercises but what I need is to be familiar with an instance of some exercise then solve the harder one :-)

    That's a good way to learn

    Thanks so much for your time. I'm really uncomfortable if I'm bothering you by those many questions and problems.

    No, you are not bothering me. I'm happy to teach you because you work hard. :)



  • Select "Promoted Classes" -> "LCDRange" and click "Promote".

    OK until here.

    In main.cpp, create a MyWidget object and show() it.

    But there is no main.cpp there.
    There are only mywidget.cpp and lcdrange.cpp C++ files there!
    I tried to add the code snippet below into the mywidget.cpp and then run it but all of the run and build related buttons are grayed out!
    I think it happend because we haven't created a complete Qt Widget Application project yet.

    int main(int argc, char *argv[])
     {
         QApplication app(argc, argv);
         MyWidget widget;
         widget.show();
         return app.exec();
     }
    

  • Moderators

    @tomy said:

    I think it happend because we haven't created a complete Qt Widget Application project yet.

    Yes, that's the reason. You should create a Qt Widgets Application project, and then add the Qt Designer Form Classes to that project.


Log in to reply