Qt Forum

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Unsolved

    Call for Presentations - Qt World Summit

    Solved How do I elide Rectangle that is wider than its parent Rectangle?

    QML and Qt Quick
    3
    5
    207
    Loading More Posts
    • 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.
    • M
      mirro last edited by mirro

      1 Reply Last reply Reply Quote 0
      • E
        ebatsin last edited by ebatsin

        Elision is only related to text.

        If you want to "hide" the part of a rectangle that overflows out of its parent, you can use the clip property:

        Rectangle {
            width: 50
            height: 50
            clip: true
        
            Rectangle {
                width: 100
                height: 100
            }
        }
        

        Note that using clip should be your last solution, on big items, this can be bad for performances.

        Instead you should try to prevent your child item from being bigger than its parent so you don't have to use clip.

        1 Reply Last reply Reply Quote 0
        • A
          Allon last edited by

          Hi,
          Why do you not write
          width: parent.width ?
          Regards,
          Emmanuel

          M 1 Reply Last reply Reply Quote 0
          • M
            mirro @Allon last edited by

            @Allon Is there a similar elide:Text.ElideRight method?

            A 1 Reply Last reply Reply Quote 0
            • E
              ebatsin last edited by ebatsin

              Elision is only related to text.

              If you want to "hide" the part of a rectangle that overflows out of its parent, you can use the clip property:

              Rectangle {
                  width: 50
                  height: 50
                  clip: true
              
                  Rectangle {
                      width: 100
                      height: 100
                  }
              }
              

              Note that using clip should be your last solution, on big items, this can be bad for performances.

              Instead you should try to prevent your child item from being bigger than its parent so you don't have to use clip.

              1 Reply Last reply Reply Quote 0
              • A
                Allon @mirro last edited by

                @mirro Hi,
                Your question was not "how to elide a rectangle but, how do I elide the text contained in a rectangle? Am I right?
                Regards

                1 Reply Last reply Reply Quote 0
                • First post
                  Last post