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. Rectangle radius property not working with RadialGradient
Forum Updated to NodeBB v4.3 + New Features

Rectangle radius property not working with RadialGradient

Scheduled Pinned Locked Moved Solved QML and Qt Quick
rectanglesradiusradialgradient
2 Posts 2 Posters 926 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.
  • A Offline
    A Offline
    AliReza Beytari
    wrote on 15 Jan 2016, 11:55 last edited by
    #1

    Hey guys!
    This is my code:

    import QtQuick 2.4
    import QtQuick.Controls 1.2
    import QtGraphicalEffects 1.0
    
    ApplicationWindow {
        title: "Upload Form"
        width: 800
        height: 650
    
        RadialGradient {
            anchors.fill: parent
            gradient: Gradient {
                GradientStop { position: 0.0; color: "#ebebec" }
                GradientStop { position: 0.5; color: "#b4b4b4" }
            }
            opacity: 0.5
        }
    
        Rectangle {
            id: uploadForm
            width: 310
            height: 280
            anchors.centerIn: parent
            antialiasing: true
    		
    		radius: 10 // not working !!
    
            RadialGradient {
                anchors.fill: parent
                gradient: Gradient {
                    GradientStop { position: 0.0; color: "#373a3d" }
                    GradientStop { position: 0.5; color: "#313437" }
                }
                verticalOffset: -155
                angle: 90
            }
        }
    }
    

    But radius property of Rectangle not working when I use RadialGradient!!
    How to fix this bug?!

    1 Reply Last reply
    0
    • ? Offline
      ? Offline
      A Former User
      wrote on 15 Jan 2016, 12:53 last edited by
      #2

      Hi!
      The following works:

      import QtQuick 2.4
      import QtQuick.Controls 1.2
      import QtGraphicalEffects 1.0
      
      ApplicationWindow {
          title: "Upload Form"
          width: 800
          height: 650
          visible: true
      
      
          Item {
              id: myFunkyRectangle
      
              width: 300
              height: 300
      
              RadialGradient {
                  id: gradient
                  anchors.fill: parent
                  gradient: Gradient {
                      GradientStop { position: 0.0; color: "white" }
                      GradientStop { position: 0.5; color: "black" }
                  }
                  visible: false
              }
      
              Rectangle {
                  id: mask
                  anchors { fill: parent; margins: 18 }
                  color: "black"
                  radius: 30
                  clip: true
                  visible: false
              }
      
              OpacityMask {
                  anchors.fill: mask
                  source: gradient
                  maskSource: mask
              }
          }
      }
      
      1 Reply Last reply
      1

      2/2

      15 Jan 2016, 12:53

      • Login

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