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. UI expnader component

UI expnader component

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
7 Posts 3 Posters 1.8k Views
  • 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.
  • J Offline
    J Offline
    Jehyeok
    wrote on 23 May 2016, 07:26 last edited by
    #1

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

    R 1 Reply Last reply 23 May 2016, 07:31
    0
    • J Jehyeok
      23 May 2016, 07:26

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

      R Offline
      R Offline
      raven-worx
      Moderators
      wrote on 23 May 2016, 07:31 last edited by
      #2

      @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
      0
      • J Offline
        J Offline
        Jehyeok
        wrote on 11 Jul 2016, 09:50 last edited by Jehyeok 7 Nov 2016, 10:11
        #3

        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 {
                    }
                }
            }
        
        R 1 Reply Last reply 11 Jul 2016, 10:03
        0
        • J Jehyeok
          11 Jul 2016, 09:50

          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 {
                      }
                  }
              }
          
          R Offline
          R Offline
          raven-worx
          Moderators
          wrote on 11 Jul 2016, 10:03 last edited by
          #4

          @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

          J 1 Reply Last reply 11 Jul 2016, 10:11
          0
          • R raven-worx
            11 Jul 2016, 10:03

            @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

            J Offline
            J Offline
            Jehyeok
            wrote on 11 Jul 2016, 10:11 last edited by
            #5

            @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
            0
            • L Offline
              L Offline
              literA2
              wrote on 11 Jul 2016, 15:43 last edited by
              #6

              You can do it like this:

              Rectangle {
                  implicitHeight: header.implicitHeight + (collapsed ? listview.contentHeight : 0)
                  Item {} // header
                  Listview {}
              }
              
              J 1 Reply Last reply 12 Jul 2016, 07:10
              0
              • L literA2
                11 Jul 2016, 15:43

                You can do it like this:

                Rectangle {
                    implicitHeight: header.implicitHeight + (collapsed ? listview.contentHeight : 0)
                    Item {} // header
                    Listview {}
                }
                
                J Offline
                J Offline
                Jehyeok
                wrote on 12 Jul 2016, 07:10 last edited by Jehyeok 7 Dec 2016, 07:10
                #7

                @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
                0

                • Login

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