（QT-UI）八、实现一个时间轴，包含刻度和文字显示

本系列预计实现

①刻度上方文字显示，

②时间轴拖动效果，

③时间轴刻度缩放，

④时间轴和其他控件联动显示，

⑤鼠标放置到时间轴，显示具体时间。

⑥通过定时器，实时更新时间轴

⑦时间轴上绘制时间片

完整代码可见https://github.com/754816/QT_TimeLine

1、基础思路

时间刻度轴，本文采用在QWidget类中调用PaintEvent函数的方式来实现，主要为按照间隔绘制一根根短线。

这里参考时钟，可以规划出整个时间轴长度上，可以分成12大块，每大块代表1小时长度，每大块里面再细分成6小块，时间上10分钟为一个刻度，每整点1小时显示一组文字信息，把10分钟的刻度画成短竖线，把1小时画成长竖线，就实现了时间轴的基础信息绘制。

展示效果如下

2、基础的时间刻度绘制

先将Widget的长度分为12块，再用width除12得到，每个大块的长度，并且绘制时，则是需要绘制出12+1根长竖线，其中长竖线是从height的一半，绘制到底部

然后将大块继续细分成6小块，这次绘制其中5根短竖线，短竖线是从height的3/4绘制到底部。

void MyWidget::GetLines(const QVector<QLine>& lines)
{
    int BlockCount = 12;
    int TimeLineWidth  = this->size()->width();
    int TimeLineHeight =  this->