How to extend button size on hover event?

  • For example, there is some kind of docked application. It is pinned to the right border of the screen after launching. It contains only a list of buttons/icons. When the user hovers on the icon it should be extended, for example

    alt text

    At the end, the user can click on it and appropriate dialog should appear on the screen.

    How do you think what Qt features I should use to do it?

  • Lifetime Qt Champion

    If you want a nice effect, then use QAnimation to extend it.
    If placed in layout you can animate minimum size or else simply use resize.
    It should not be super complicated to program.

  • @mrjj,

    Ok, thank you!

    I am going to check it. If you saw some kind of such examples I would be appreciated you.

  • Lifetime Qt Champion

    Well this might be starting point.

    include <QtGui>
    include <QPushButton>
    include <QPropertyAnimation>
    include <QDebug>
    int main(int argc, char *argv[]) {
       QApplication a(argc, argv);
       QWidget w;
       QPushButton button("B",&w);
       QPropertyAnimation animation(&button, "geometry");
       animation.setDuration(5000);  //2000 miliseconds = 2 seconds
       animation.setStartValue(QRect(0,0, button.width(),button.height()));
       animation.setEndValue(QRect(180,180, button.width(),button.height()));
       return a.exec();

    Note its just sample i found fast. not tested :)
    If you move code to other function, be sure to NEW the QPropertyAnimation as else it runs out of scope.
    (ask if u dont know what i mean)

Log in to reply