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. Spinbox of QtQuick control2 looks weird in TableView
Forum Updated to NodeBB v4.3 + New Features

Spinbox of QtQuick control2 looks weird in TableView

Scheduled Pinned Locked Moved Solved QML and Qt Quick
2 Posts 1 Posters 471 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.
  • thamT Offline
    thamT Offline
    tham
    wrote on last edited by
    #1

    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

    thamT 1 Reply Last reply
    0
    • thamT tham

      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

      thamT Offline
      thamT Offline
      tham
      wrote on last edited by
      #2

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

      • Login

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