Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. Designing a custom timeline with mouse interaction

Designing a custom timeline with mouse interaction

Scheduled Pinned Locked Moved Unsolved General and Desktop
13 Posts 3 Posters 5.1k 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.
  • MarKSM MarKS

    @mrjj this is amazing. thank you for pointing me in right direction.

    mrjjM Offline
    mrjjM Offline
    mrjj
    Lifetime Qt Champion
    wrote on last edited by mrjj
    #4

    @MarKS
    Np :)
    Note for the resizing of the Items in the GfxView, you can have a look at
    http://www.davidwdrell.net/wordpress/?page_id=46
    IMHO it gave a good starting point even if not perfect.

    to make it compile add
    QT += widgets
    to the .pro file.

    ps. download the zip. the code shown is broken due to html escaping.

    MarKSM 1 Reply Last reply
    0
    • mrjjM mrjj

      @MarKS
      Np :)
      Note for the resizing of the Items in the GfxView, you can have a look at
      http://www.davidwdrell.net/wordpress/?page_id=46
      IMHO it gave a good starting point even if not perfect.

      to make it compile add
      QT += widgets
      to the .pro file.

      ps. download the zip. the code shown is broken due to html escaping.

      MarKSM Offline
      MarKSM Offline
      MarKS
      wrote on last edited by
      #5

      @mrjj i already have resizing handles implemented for QGraphicsItem i would try to add it to line on my QGraphicsScene. Thanks for pointing out though. I am just wondering how can i add row like features to the view and may be add a QHeaderView like in QTableView to the timeline showing numbers (in my case, frames)?

      mrjjM 1 Reply Last reply
      0
      • MarKSM MarKS

        @mrjj i already have resizing handles implemented for QGraphicsItem i would try to add it to line on my QGraphicsScene. Thanks for pointing out though. I am just wondering how can i add row like features to the view and may be add a QHeaderView like in QTableView to the timeline showing numbers (in my case, frames)?

        mrjjM Offline
        mrjjM Offline
        mrjj
        Lifetime Qt Champion
        wrote on last edited by
        #6

        @MarKS
        Hi
        Ok. so you know QGraphicsView already. that will be huge help.

        Regarding the rows.
        We could maybe use
        https://doc.qt.io/qt-5/qgraphicsview.html#drawBackground
        since the row is mostly a visual cue and not really interactive as such.
        But when you draw the black lines, we want to stay inside a row so if its just
        drawn in the background im not sure how easy it is to keep it inside but
        if they have a fixed height then it might work.

        For the Time position "ruler" i think i would make a custom widget to draw such ruler as im not sure
        QHeaderView can be tweak that much.
        Basically its like a ruler widget but with a sliding window/section.
        Should not be that complicated to program.

        MarKSM 1 Reply Last reply
        0
        • mrjjM mrjj

          @MarKS
          Hi
          Ok. so you know QGraphicsView already. that will be huge help.

          Regarding the rows.
          We could maybe use
          https://doc.qt.io/qt-5/qgraphicsview.html#drawBackground
          since the row is mostly a visual cue and not really interactive as such.
          But when you draw the black lines, we want to stay inside a row so if its just
          drawn in the background im not sure how easy it is to keep it inside but
          if they have a fixed height then it might work.

          For the Time position "ruler" i think i would make a custom widget to draw such ruler as im not sure
          QHeaderView can be tweak that much.
          Basically its like a ruler widget but with a sliding window/section.
          Should not be that complicated to program.

          MarKSM Offline
          MarKSM Offline
          MarKS
          wrote on last edited by
          #7

          @mrjj Exactly! Thanks for the pointer to drawBackground(). Yes! Row would be just the visual cue (may be alternating light and dark colors as shown in the image) to the user but when a user clicks on that row, the line should propagate only in that row. I want my rows height to be fixed though.

          I need to figure out how to make this ruler widget.

          mrjjM 1 Reply Last reply
          0
          • MarKSM MarKS

            @mrjj Exactly! Thanks for the pointer to drawBackground(). Yes! Row would be just the visual cue (may be alternating light and dark colors as shown in the image) to the user but when a user clicks on that row, the line should propagate only in that row. I want my rows height to be fixed though.

            I need to figure out how to make this ruler widget.

            mrjjM Offline
            mrjjM Offline
            mrjj
            Lifetime Qt Champion
            wrote on last edited by
            #8

            @MarKS
            Hi
            yeah if user must click on the row to activate im not 100% sure we can fake it using drawBG as we then need to calculate which row that must be./from a global click) But it might work.

            • I need to figure out how to make this ruler widget.
              https://kernelcoder.wordpress.com/tag/ruler-in-qgraphicsview/

            Could be used as base. I didn't run it but it looks ok looking at code.

            MarKSM 1 Reply Last reply
            0
            • mrjjM mrjj

              @MarKS
              Hi
              yeah if user must click on the row to activate im not 100% sure we can fake it using drawBG as we then need to calculate which row that must be./from a global click) But it might work.

              • I need to figure out how to make this ruler widget.
                https://kernelcoder.wordpress.com/tag/ruler-in-qgraphicsview/

              Could be used as base. I didn't run it but it looks ok looking at code.

              MarKSM Offline
              MarKSM Offline
              MarKS
              wrote on last edited by
              #9

              @mrjj Yes! i found something similar here https://github.com/Qt-Widgets/IRuler. Should be a good starting point. Let me start writing some code and see how it shows up. If stuck, hopefully i can come back here to ask more questions. thank you for your help. If you come up with something more interesting please drop in here. That would be useful.

              mrjjM 1 Reply Last reply
              1
              • MarKSM MarKS

                @mrjj Yes! i found something similar here https://github.com/Qt-Widgets/IRuler. Should be a good starting point. Let me start writing some code and see how it shows up. If stuck, hopefully i can come back here to ask more questions. thank you for your help. If you come up with something more interesting please drop in here. That would be useful.

                mrjjM Offline
                mrjjM Offline
                mrjj
                Lifetime Qt Champion
                wrote on last edited by
                #10

                @MarKS
                Ah that looks nice and simply. I wonder if it can scroll.

                Also just as a note.
                https://www.shotcut.org/
                https://github.com/mltframework/shotcut

                MarKSM 1 Reply Last reply
                0
                • mrjjM mrjj

                  @MarKS
                  Ah that looks nice and simply. I wonder if it can scroll.

                  Also just as a note.
                  https://www.shotcut.org/
                  https://github.com/mltframework/shotcut

                  MarKSM Offline
                  MarKSM Offline
                  MarKS
                  wrote on last edited by
                  #11

                  @mrjj Yah scrolling might be an issue. Maybe i resize the ruler widget based on the position of the scrollbar on QGraphicsView?
                  I have seen this Shotcut thing earlier, i would love something like that but they are using qml and .js to achieve that i suppose.

                  1 Reply Last reply
                  0
                  • SGaistS Offline
                    SGaistS Offline
                    SGaist
                    Lifetime Qt Champion
                    wrote on last edited by
                    #12

                    Hi,

                    You might also want to check kdenlive.

                    Interested in AI ? www.idiap.ch
                    Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

                    MarKSM 1 Reply Last reply
                    0
                    • SGaistS SGaist

                      Hi,

                      You might also want to check kdenlive.

                      MarKSM Offline
                      MarKSM Offline
                      MarKS
                      wrote on last edited by
                      #13

                      @SGaist this looks awesome as well. I am afraid, i don't know qml and no idea about c++ and qml interactions.

                      1 Reply Last reply
                      0

                      • Login

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