Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. How to create a splash screen using QML
Forum Updated to NodeBB v4.3 + New Features

How to create a splash screen using QML

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
3 Posts 3 Posters 6.3k Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • S Offline
    S Offline
    startimeahmet
    wrote on 15 Jul 2018, 19:55 last edited by
    #1

    Hi, I am trying to develop an android application using QT. I want to show a splash screen at the start of the application. Splash screen will stay there for 2 seconds then main page of the app will be shown. For this I have created 2 .qml files.

    Splash.qml

    import QtQuick 2.9
    import QtQuick.Controls 2.2
    import QtQuick.Window 2.3
    
    Window {
        id: window
        visible: true
        width: Screen.width
        height: Screen.height
        signal timeout
    
        Image {
            id: image
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.verticalCenter: parent.verticalCenter
            width: 300
            height: 300
            source: "qrc:/../Desktop/photo_2018-03-21_19-53-06.jpg"
        }
    
        Text {
            id: text1
            y: image.height + image.y + 20
            text: qsTr("@startimeahmet Presents")
            anchors.horizontalCenter: parent.horizontalCenter
            font.pixelSize: 25
        }
    
        Timer {
            interval: 2000; running: true; repeat: false
            onTriggered: {
                visible = false
                window.timeout()
            }
        }
    }
    

    main.qml

    import QtQuick 2.9
    import QtQuick.Controls 2.2
    import QtQuick.Window 2.3
    
    ApplicationWindow {
        id: root
        visible: false
        width: Screen.width
        height: Screen.height
    
        Splash {
            onTimeout: root.visible = true
        }
    }
    

    But this doesn't work. Any help on this is really appreciated!

    p.s. I am using QT 5.11.1 with QT Creator 4.6.2

    D A 2 Replies Last reply 16 Jul 2018, 04:11
    0
    • S startimeahmet
      15 Jul 2018, 19:55

      Hi, I am trying to develop an android application using QT. I want to show a splash screen at the start of the application. Splash screen will stay there for 2 seconds then main page of the app will be shown. For this I have created 2 .qml files.

      Splash.qml

      import QtQuick 2.9
      import QtQuick.Controls 2.2
      import QtQuick.Window 2.3
      
      Window {
          id: window
          visible: true
          width: Screen.width
          height: Screen.height
          signal timeout
      
          Image {
              id: image
              anchors.horizontalCenter: parent.horizontalCenter
              anchors.verticalCenter: parent.verticalCenter
              width: 300
              height: 300
              source: "qrc:/../Desktop/photo_2018-03-21_19-53-06.jpg"
          }
      
          Text {
              id: text1
              y: image.height + image.y + 20
              text: qsTr("@startimeahmet Presents")
              anchors.horizontalCenter: parent.horizontalCenter
              font.pixelSize: 25
          }
      
          Timer {
              interval: 2000; running: true; repeat: false
              onTriggered: {
                  visible = false
                  window.timeout()
              }
          }
      }
      

      main.qml

      import QtQuick 2.9
      import QtQuick.Controls 2.2
      import QtQuick.Window 2.3
      
      ApplicationWindow {
          id: root
          visible: false
          width: Screen.width
          height: Screen.height
      
          Splash {
              onTimeout: root.visible = true
          }
      }
      

      But this doesn't work. Any help on this is really appreciated!

      p.s. I am using QT 5.11.1 with QT Creator 4.6.2

      D Offline
      D Offline
      Diracsbracket
      wrote on 16 Jul 2018, 04:11 last edited by
      #2

      Hi, @startimeahmet

      When I needed the same thing, I found these two resources very useful:

      https://falsinsoft.blogspot.kr/2017/07/qml-show-android-native-splash-screen.html

      https://medium.com/@benlaud/complete-guide-to-make-a-splash-screen-for-your-qml-android-application-567ca3bc70af

      1 Reply Last reply
      3
      • S startimeahmet
        15 Jul 2018, 19:55

        Hi, I am trying to develop an android application using QT. I want to show a splash screen at the start of the application. Splash screen will stay there for 2 seconds then main page of the app will be shown. For this I have created 2 .qml files.

        Splash.qml

        import QtQuick 2.9
        import QtQuick.Controls 2.2
        import QtQuick.Window 2.3
        
        Window {
            id: window
            visible: true
            width: Screen.width
            height: Screen.height
            signal timeout
        
            Image {
                id: image
                anchors.horizontalCenter: parent.horizontalCenter
                anchors.verticalCenter: parent.verticalCenter
                width: 300
                height: 300
                source: "qrc:/../Desktop/photo_2018-03-21_19-53-06.jpg"
            }
        
            Text {
                id: text1
                y: image.height + image.y + 20
                text: qsTr("@startimeahmet Presents")
                anchors.horizontalCenter: parent.horizontalCenter
                font.pixelSize: 25
            }
        
            Timer {
                interval: 2000; running: true; repeat: false
                onTriggered: {
                    visible = false
                    window.timeout()
                }
            }
        }
        

        main.qml

        import QtQuick 2.9
        import QtQuick.Controls 2.2
        import QtQuick.Window 2.3
        
        ApplicationWindow {
            id: root
            visible: false
            width: Screen.width
            height: Screen.height
        
            Splash {
                onTimeout: root.visible = true
            }
        }
        

        But this doesn't work. Any help on this is really appreciated!

        p.s. I am using QT 5.11.1 with QT Creator 4.6.2

        A Offline
        A Offline
        ambershark
        wrote on 16 Jul 2018, 05:07 last edited by
        #3

        @startimeahmet Here's an answer I gave someone on the forums... seemed to have worked for him:

        https://forum.qt.io/topic/90954/proper-way-to-create-splash-screen-in-qt-quick2

        My L-GPL'd C++ Logger github.com/ambershark-mike/sharklog

        1 Reply Last reply
        3

        1/3

        15 Jul 2018, 19:55

        • Login

        • Login or register to search.
        1 out of 3
        • First post
          1/3
          Last post
        0
        • Categories
        • Recent
        • Tags
        • Popular
        • Users
        • Groups
        • Search
        • Get Qt Extensions
        • Unsolved