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. Buttons become transparent over images using Material Style
QtWS25 Last Chance

Buttons become transparent over images using Material Style

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
7 Posts 2 Posters 778 Views
  • 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.
  • aarelovichA Offline
    aarelovichA Offline
    aarelovich
    wrote on last edited by
    #1

    I want my application to use an image as a Background. So I use this code:

    In my ApplicationWindow:

    Image {
        id: bkgImage
        source: "qrc:/images/bkg.jpg"
        anchors.centerIn: parent
    }
    

    To add a button

    Button {
        id: btnAsistencia
        text: qsTr("ASISTENCIA")
        font.pixelSize: fhButttonTextSize
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.top: btnInscripcion.bottom
        anchors.topMargin: parent.height*0.1
    }
    

    The code above is for the second button, but I added one before in the exact same way. This is the result:

    alt text

    The second button becomes transparent over the image. How can I prevent this?

    ekkescornerE 1 Reply Last reply
    0
    • aarelovichA aarelovich

      I want my application to use an image as a Background. So I use this code:

      In my ApplicationWindow:

      Image {
          id: bkgImage
          source: "qrc:/images/bkg.jpg"
          anchors.centerIn: parent
      }
      

      To add a button

      Button {
          id: btnAsistencia
          text: qsTr("ASISTENCIA")
          font.pixelSize: fhButttonTextSize
          anchors.horizontalCenter: parent.horizontalCenter
          anchors.top: btnInscripcion.bottom
          anchors.topMargin: parent.height*0.1
      }
      

      The code above is for the second button, but I added one before in the exact same way. This is the result:

      alt text

      The second button becomes transparent over the image. How can I prevent this?

      ekkescornerE Offline
      ekkescornerE Offline
      ekkescorner
      Qt Champions 2016
      wrote on last edited by
      #2

      @aarelovich you can customize the background of your Button
      https://doc.qt.io/qt-5.9/qtquickcontrols2-customize.html#customizing-button

      ekke ... Qt Champion 2016 | 2024 ... mobile business apps
      5.15 --> 6.8 https://t1p.de/ekkeChecklist
      QMake --> CMake https://t1p.de/ekkeCMakeMobileApps

      1 Reply Last reply
      2
      • aarelovichA Offline
        aarelovichA Offline
        aarelovich
        wrote on last edited by
        #3

        I ended up doing that, but I wanted to use the standard colors for the Material.Dark Theme. Thanks for the reply.

        ekkescornerE 1 Reply Last reply
        0
        • aarelovichA aarelovich

          I ended up doing that, but I wanted to use the standard colors for the Material.Dark Theme. Thanks for the reply.

          ekkescornerE Offline
          ekkescornerE Offline
          ekkescorner
          Qt Champions 2016
          wrote on last edited by
          #4

          @aarelovich please open a bug report

          ekke ... Qt Champion 2016 | 2024 ... mobile business apps
          5.15 --> 6.8 https://t1p.de/ekkeChecklist
          QMake --> CMake https://t1p.de/ekkeCMakeMobileApps

          aarelovichA 1 Reply Last reply
          0
          • ekkescornerE ekkescorner

            @aarelovich please open a bug report

            aarelovichA Offline
            aarelovichA Offline
            aarelovich
            wrote on last edited by
            #5

            @ekkescorner

            I don't understand, what exactly is the bug here? Just because something does not behave like I'd like, it is not necessarily a bug, right?

            ekkescornerE 1 Reply Last reply
            0
            • aarelovichA aarelovich

              @ekkescorner

              I don't understand, what exactly is the bug here? Just because something does not behave like I'd like, it is not necessarily a bug, right?

              ekkescornerE Offline
              ekkescornerE Offline
              ekkescorner
              Qt Champions 2016
              wrote on last edited by
              #6

              @aarelovich then I misunderstood. thought it's not working as expected from Google Material Guidelines.

              ekke ... Qt Champion 2016 | 2024 ... mobile business apps
              5.15 --> 6.8 https://t1p.de/ekkeChecklist
              QMake --> CMake https://t1p.de/ekkeCMakeMobileApps

              aarelovichA 1 Reply Last reply
              0
              • ekkescornerE ekkescorner

                @aarelovich then I misunderstood. thought it's not working as expected from Google Material Guidelines.

                aarelovichA Offline
                aarelovichA Offline
                aarelovich
                wrote on last edited by
                #7

                @ekkescorner Ok, that might be. Thanks!

                1 Reply Last reply
                0

                • Login

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