Qt Forum

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

    Update: Forum Guidelines & Code of Conduct

    Unsolved UI expnader component

    QML and Qt Quick
    3
    7
    1425
    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.
    • Jehyeok
      Jehyeok last edited by

      Is there any UI component which is like 'Expander'? (refer below)
      collapse and expand component http://www.wpftutorial.net/Expander.html

      raven-worx 1 Reply Last reply Reply Quote 0
      • raven-worx
        raven-worx Moderators @Jehyeok last edited by

        @Jehyeok
        search in google for "qml collapsible" and you will find some examples

        --- SUPPORT REQUESTS VIA CHAT WILL BE IGNORED ---
        If you have a question please use the forum so others can benefit from the solution in the future

        1 Reply Last reply Reply Quote 0
        • Jehyeok
          Jehyeok last edited by Jehyeok

          Sorry @raven-worx , I couldn't find right references.

          Actually
          I try to use 'Loader' to make similar putting Component or null in sourceComponent property.

                  Loader {
                      id: itemLoader
                      anchors.fill: parent
                      visible: !collapsed
                      sourceComponent: collapsed ? null : componentItem
                  }
          

          But, I don't think it is best. Because I need to put component in it still.

              MyExpander{
                  componentItem: Component{
                      Rectangle{
                          Text {
                          }
                  }
              }
          

          It would be nice to design as other layout components to hold children in it.
          Do you have any idea?

              GridLayout{
                  Rectangle{
                      Text {
                      }
                  }
              }
          
          raven-worx 1 Reply Last reply Reply Quote 0
          • raven-worx
            raven-worx Moderators @Jehyeok last edited by

            @Jehyeok said:

            Sorry @raven-worx , I don't get any reference from your keyword in google.

            come on... do you want me really to believe that?!

            Example 1, Example 2

            --- SUPPORT REQUESTS VIA CHAT WILL BE IGNORED ---
            If you have a question please use the forum so others can benefit from the solution in the future

            Jehyeok 1 Reply Last reply Reply Quote 0
            • Jehyeok
              Jehyeok @raven-worx last edited by

              @raven-worx You are right. I saw them in search results, but I mean it wasn't what I want. I want to have similar like groupbox component. http://doc.qt.io/qt-5/qml-qtquick-controls-groupbox.html

              1 Reply Last reply Reply Quote 0
              • L
                literA2 last edited by

                You can do it like this:

                Rectangle {
                    implicitHeight: header.implicitHeight + (collapsed ? listview.contentHeight : 0)
                    Item {} // header
                    Listview {}
                }
                
                Jehyeok 1 Reply Last reply Reply Quote 0
                • Jehyeok
                  Jehyeok @literA2 last edited by Jehyeok

                  @literA2
                  I would like to do it like this

                  MyExpander{
                    GridLayout{
                      Rectangle{
                        Text { }
                        Text { }
                      }
                      Rectangle{
                        Text { }
                        Text { }
                      }
                    }
                  }
                  

                  MyExpander is my new component. I would like to reuse this MyExpander object in other qml.
                  Under the MyExpander should be able to control its children collapsible.

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