Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Animate QTableWidget



  • How can I animate the deletion/insertion of a row in a QTableWidget?


  • Lifetime Qt Champion

    Hi
    In what way animate?
    The items are tightly controlled by the QTableWidget so we cant move them
    around or anything like that.



  • Well I have created rowInsert() and rowDelete() functions and i would like the deleted/inserted rows to be animated when they appear/disappear. I would like animation like for example one on their height property (from 0->100 when it appears, from
    100->0 when it disappears).
    Edit: https://www.youtube.com/watch?v=bOl5MIti7n0 I found this video as an example of how I want it to appear.


  • Lifetime Qt Champion

    Hi
    You can do like this

    class RowAnimator : public QObject
    {
        Q_OBJECT
    private:
        QRect mRect;
        QPropertyAnimation *animation;
        QTableWidget *table = nullptr;
    public:
        Q_PROPERTY(QRect ItemRect READ ItemRectRead WRITE ItemRectWrite)
    
        QRect ItemRectRead() const
        {
            return mRect;
        }
    
        void ItemRectWrite(const QRect &rect)
        {
            mRect = rect;
        }
    
        RowAnimator(QObject *parent, QTableWidget *tableTarget) : QObject (parent), table(tableTarget)
        {
            animation = new QPropertyAnimation(this, "ItemRect");
            //animation->setEasingCurve(QEasingCurve::InBack);
        }
    
        virtual ~RowAnimator() {}
    
    public slots:
        void AnimateRow(int row, int start, int end)
        {
            animation->setDuration(500);
            animation->setStartValue(QRect(0, 0, 0, start));
            animation->setEndValue(QRect(0, 0, 0, end));
            animation->start();
            connect(animation, &QPropertyAnimation::valueChanged, [ = ](const QVariant & value) {
                QRect rect = value.toRect();
                table->setRowHeight(row, rect.height());
            });
        }
    
    };
    

    and call Ra->AnimateRow(4,start height ,end height );

    alt text

    you might want to add a signal for animation finished so you know when its ok to
    actually, remove the row.
    Also if you tweak it a bit and use an easing curve it should look pretty ok.



  • Can you please help me with what coordinates you put in startHeight and endHeight, because no matter what coordinate i put in the resize stops halfway. The animation itself runs until the value of rectangle goes endHeight, but no resizing happens. I think it happens because table.setRowHeight fails for some reason but I don't understand why.


  • Lifetime Qt Champion

    @imaqt-0
    Hi
    I tested with both small and large values and seems to work.

      connect(ui->pbGo, &QPushButton::released, this, [Ra](){
        Ra->AnimateRow(4,500,0);
        });
    
        connect(ui->pbCome, &QPushButton::released, this, [Ra](){
        Ra->AnimateRow(4,0,500);
        });
    
    

    what values did you use ?



  • Hi
    I used

    int begin = table.rowHeight(table.currentRow());
    int end = 0;
    int row = table.currentRow();
    

    as values for animation begin and end.
    I have this piece of code

    connect(anim, &QPropertyAnimation::valueChanged, [&table, row]
    (const QVariant & value) {
       	QRect rect = value.toRect();
       	qDebug() << rect<<"\t";
       	table.setRowHeight(row, rect.height());
       	qDebug() << table.rowHeight(table.currentRow())<<endl;
       	}
    

    which produces this debug info:

    QRect(0,0 0x29)
    29
    
    QRect(0,0 0x28)
    28
    
    QRect(0,0 0x27)
    27
    
    QRect(0,0 0x26)
    26
    
    QRect(0,0 0x25)
    25
    
    QRect(0,0 0x24)
    24
    
    QRect(0,0 0x23)
    23
    
    QRect(0,0 0x22)
    23
    
    QRect(0,0 0x21)
    23
    

    This is what makes me think that it might be a problem with QTableWidget::setRowHeight.


  • Lifetime Qt Champion

    Hi
    Hmm so it only runs to 23 as minimum row height.
    Odd.
    What if you directly set it to say 10?



  • I have tried setting it directly even to 0 and it works. Maybe there's a limit to number of resizes?


  • Lifetime Qt Champion

    @imaqt-0
    Hmm
    It seems to have a minimum size.
    if i do

      ui->tableWidget->setRowHeight(4,1);
      qDebug() << ui->tableWidget->rowHeight(4);
    

    it says 23.

    ah, its linked to
    ui->tableWidget->verticalHeader()->setMinimumSectionSize(1);
    alt text



  • @mrjj said in Animate QTableWidget:

    ui->tableWidget->verticalHeader()->setMinimumSectionSize(1);

    Yes this was it thank you very much, its smooth now!



  • Yes,agreed....Lots of confusions in cordinates of startHeight and endHeight. It just stucks in mysystem after going halfway.Saw couple of codes but all in vain www.mybkexperience.com


Log in to reply