Uploaded image for project: 'Qt'
  1. Qt
  2. QTBUG-9008

A Rectangle with radius doesn't clip a child Image in rounded corners

    XMLWordPrintable

Details

    Description

      When using an Image element inside a Rectangle with a radius for rounded corners, and the Image fills anchors to the Rectangle - the Image corners are not clipped. The following example shows a blue rectangle with rounded corners, hosting an image that once loaded over the network will fill the entire rectangle;

      import Qt 4.6
      
      Rectangle {
          width: 300
          height: 100
      
          Row {
              width: parent.width
              height: 60
              Rectangle {
                  id: rectangle2
                  height: parent.height
                  width: 60
                  color: "#4682b4"
                  radius: 10
                  clip: true
      
                  Image {
                      anchors.fill: parent
                      source: "http://chaos.troll.no/~hhartz/hhartz_mirror_small.png"
                  }
              }
      
              Text {
                  id: text1
                  height: parent.height
                  text: "Shady, Slim"
                  verticalAlignment: "AlignVCenter"
                  horizontalAlignment: "AlignHCenter"
              }
          }
      }
      

      Attachments

        Issue Links

          For Gerrit Dashboard: QTBUG-9008
          # Subject Branch Project Status CR V

          Activity

            People

              srutledg Shawn Rutledge
              hhartz Henrik Hartz (closed Nokia identity) (Inactive)
              Votes:
              0 Vote for this issue
              Watchers:
              2 Start watching this issue

              Dates

                Created:
                Updated:
                Resolved:

                Gerrit Reviews

                  There is 1 open Gerrit change