Qt Forum

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

    Update: Forum Guidelines & Code of Conduct


    Qt World Summit: Early-Bird Tickets

    Solved Spinbox of QtQuick control2 looks weird in TableView

    QML and Qt Quick
    1
    2
    321
    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.
    • tham
      tham last edited by

      As the title mentioned, it looks weird

      #include <QApplication>
      #include <QQuickWidget>
      #include <QQuickStyle>
      
      int main(int argc, char *argv[])
      {
          QApplication a(argc, argv);
      
          QQuickStyle::setStyle("Universal");
          QUrl const url("qrc:/main.qml");
      
          QQuickWidget widget(url);
          widget.show();
      
          return a.exec();
      }
      

      QQuickStyle::setStyle("Universal");

      main.qml

      import QtQuick 2.9
      import QtQuick.Controls 1.4 as Control1
      import QtQuick.Controls 2.2 as Control2
      
      import QtQuick.Layouts 1.3
      
      Rectangle{
          id: root
      
          width: 600
          height: 480
      
      
          ListModel {
              id: sourceModel
      
              ListElement{ imageSelector: 0}
          }
      
          ColumnLayout{
              anchors.fill: parent
      
              Control1.TableView {
                  id: tableView
      
                  frameVisible: false
                  sortIndicatorVisible: false
      
                  Layout.minimumWidth: 400
                  Layout.minimumHeight: 240
                  Layout.preferredWidth: 600
                  Layout.preferredHeight: 400
                  Layout.fillWidth: true
      
                  rowDelegate: Item{
                      width: 150
                      height: 50
                  }
      
                  Control1.TableViewColumn {
                      id: imageSelector
                      title: qsTr("Select face(s)")
                      role: "imageSelector"
                      movable: false
                      resizable: true
                      width: 150
                      delegate: Control2.SpinBox{
                          from: 0
                          to: 10
                          value: styleData.value
                      }
                  }
      
                  model: sourceModel
              }
          }
      }
      

      Tried to adjuts the size of rowDelegate, but it do not fix the issue.

      The result:

      alt text

      It become normal again if I resize the column manually(by mouse)

      alt text

      How could I solve this issue?Thanks

      ps : resizeColumnsToContents() do not work as expected

      tham 1 Reply Last reply Reply Quote 0
      • tham
        tham @tham last edited by

        @tham Found a solution, wrap the spinBox by RowLayout can solve this issue

        Control1.TableViewColumn {
                        id: imageSelector
                        title: qsTr("Select face(s)")
                        role: "imageSelector"
                        movable: false
                        resizable: true
                        width: 150
                        delegate: RowLayout{
                            Control2.SpinBox{
                                from: 0
                                to: 10
                                value: styleData.value
                            }
                        }
                    }
        
        1 Reply Last reply Reply Quote 1
        • First post
          Last post