Animated Button Border



  • How can we make a Button's Border Animated in QML like shown below:

    [Snake like Movement]

    0_1523361242532_Animated GIF-downsized(1).gif


  • Moderators

    There is no straightforward API for this. I see several possibilities:

    • custom painting in QQuickPaintedItem
    • custom painting in QQuickItem
    • custom painting via GL shaders
    • custom painting in QML Canvas
    • a set of 4 animated Rectangle components, simulating the line. An ugly solution, but probably the easiest to do

    Perhaps BorderImage component can be forced to do an animation like that, but I doubt it.