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

          relates to

          Bug - A problem which impairs or prevents the functions of the product. QTBUG-65741 Invalid event clipping

          • P2: Important - Urgent, should be fixed, but will not stop the release.
          • Reported

          Suggestion - Public suggestions QTBUG-72671 add option to QQuickRectangle to honor corner radius in contains()

          • Not Evaluated - Not yet evaluated/prioritized
          • Reported

          Bug - A problem which impairs or prevents the functions of the product. QTBUG-115179 Clip optimization in QQuickDeliveryAgentPrivate::pointerTargets is too aggressive

          • P2: Important - Urgent, should be fixed, but will not stop the release.
          • Closed

          Suggestion - Public suggestions QTBUG-72774 Rounded corners for rectangle node

          • P4: Low - Would be nice to fix, but it's not very important.
          • Reported
          resulted in

          Suggestion - Public suggestions QTBUG-98334 Support rounded corners on QtQuick Image

          • Not Evaluated - Not yet evaluated/prioritized
          • Closed
          For Gerrit Dashboard: QTBUG-9008
          # Subject Branch Project Status CR V
          381364,7 WIP allow Rectangle to clip children with radius dev qt/qtdeclarative Status: NEW -2 0
          602359,5 Add containment manual tests dev qt/qtdeclarative Status: NEW -1 0

          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 are 2 open Gerrit changes