qt example – shapedclock

鉴于已经被我改的面目全非了，我也分不清原来是什么样子的了。

要做到透明效果，需要设置2个地方，一是背景色，二是把表盘无关的区域Mask掉。

shapedclock.h

#ifndef SHAPEDCLOCK_H
#define SHAPEDCLOCK_H

#include <QWidget>

class ShapedClock : public QWidget
{
    Q_OBJECT

public:
    ShapedClock(QWidget *parent = 0);
    QSize sizeHint() const;

protected:
    void mouseMoveEvent(QMouseEvent *event);
    void mousePressEvent(QMouseEvent *event);
    void paintEvent(QPaintEvent *event);
    void resizeEvent(QResizeEvent *event);

private:
    QPoint dragPosition;
};

#endif

shapedclock.cpp

#include <QtGui>

#include "shapedclock.h"

ShapedClock::ShapedClock(QWidget *parent)
    : QWidget(parent, Qt::FramelessWindowHint | Qt::WindowSystemMenuHint | Qt::WindowStaysOnTopHint)
      //窗口的种类，Frameless是透明背景必须, staysOnTop是窗口总在最前
{
    QTimer *timer = new QTimer(this);
    connect(timer, SIGNAL(timeout()), this, SLOT(update()));
    timer->start(100);
    //和原来一样的计时器

    move(1100,50);
    //这是我自己加的初始位置

    setAttribute( Qt::WA_TranslucentBackground, true);
    //背景透明

    QAction *quitAction = new QAction(tr("E&xit"), this);
    quitAction->setShortcut(tr("Ctrl+Q"));
    connect(quitAction, SIGNAL(triggered()), qApp, SLOT(quit()));
    addAction(quitAction);
    //加一个action，快捷键是Ctrl+Q，实现退出功能，我很奇怪的是设定快捷键他的类型是QString，难道可以自动识别？

    setContextMenuPolicy(Qt::ActionsContextMenu);
    setToolTip(tr("Drag the clock with the left mouse button.\n"
                  "Use the right mouse button to open a context menu."));
    setWindowTitle(tr("Shaped Analog Clock"));
    //鼠标悬置的文本提示和标题
}

void ShapedClock::mousePressEvent(QMouseEvent *event)
{
    if (event->button() == Qt::LeftButton) {
        dragPosition = event->globalPos() - frameGeometry().topLeft();
        event->accept();
    }
    //当鼠标点下的时候，得到鼠标相对窗口左上角点的相对坐标
}

void ShapedClock::mouseMoveEvent(QMouseEvent *event)
{
    if (event->buttons() & Qt::LeftButton) {
        move(event->globalPos() - dragPosition);
        event->accept();
    }
    //当鼠标移动的时候，用当时鼠标全局位置减去上面的相对坐标得到现在的角点坐标，并移动
}

void ShapedClock::paintEvent(QPaintEvent *)
{
    /* 后面的就和昨天类似了*/

    static const QPoint hourHand[3] = {
        QPoint(5, 8),
        QPoint(-5, 8),
        QPoint(0, -40)
    };
    static const QPoint minuteHand[3] = {
        QPoint(5, 8),
        QPoint(-5, 8),
        QPoint(0, -70)
    };
    static const QPoint secondHand[4] = {
	QPoint(1, 8),
	QPoint(-1, 8),
	QPoint(-1, -90),
	QPoint(1,-90)
    };
    static const QPoint background[4] = {
	QPoint( -100, -100),
	QPoint( -100, 100),
	QPoint( 100, 100),
	QPoint( 100, -100),
    };
    //多了一个画背景

    QColor hourColor(255, 0, 255);
    QColor minuteColor(0, 255, 255, 191);
    QColor secondColor(255, 255, 0);
    QColor BGColor(255, 255, 255, 5);    //这是背景色

    int side = qMin(width(), height());
    QTime time = QTime::currentTime();

    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing);
    painter.translate(width() / 2, height() / 2);
    painter.scale(side / 200.0, side / 200.0);

    painter.setPen(Qt::NoPen);
    painter.setBrush(BGColor);
    painter.save();
    painter.drawConvexPolygon(background,4);
    painter.restore();
    //画背景

    painter.setPen(Qt::NoPen);
    painter.setBrush(hourColor);

    painter.save();
    painter.rotate(30.0 * ((time.hour() + time.minute() / 60.0)));
    painter.drawConvexPolygon(hourHand, 3);
    painter.restore();

    painter.setPen(hourColor);

    for (int i = 0; i < 12; ++i) {
        painter.drawLine(88, 0, 96, 0);
        painter.rotate(30.0);
    }

    painter.setPen(Qt::NoPen);
    painter.setBrush(minuteColor);

    painter.save();
    painter.rotate(6.0 * (time.minute() + time.second() / 60.0));
    painter.drawConvexPolygon(minuteHand, 3);
    painter.restore();

    painter.setPen(minuteColor);

    for (int j = 0; j < 60; ++j) {
        if ((j % 5) != 0)
            painter.drawLine(92, 0, 96, 0);
        painter.rotate(6.0);
    }
    QPainter painter2(this);
    painter2.setRenderHint(QPainter::Antialiasing);
    painter2.translate(width() / 4, height() / 8 * 5);
    painter2.scale(side / 600.0, side / 600.0);
    painter2.setPen(Qt::NoPen);
    painter2.setBrush(secondColor);
    painter2.save();
    if(time.second()<30)
	painter2.rotate(6.0 * (time.second() + time.msec()/1000.0 ));
    else if(time.second()==30 && time.msec()<550)
	painter2.rotate(180 - 36.0 * time.msec()/100.0);

    painter2.drawConvexPolygon(secondHand,4);
    painter2.restore();

    painter2.setPen(secondColor);
    painter2.rotate(270);
    for (int j = 0; j < 30; ++j) {
	painter2.drawLine(92, 0, 96, 0);
        painter2.rotate(6.0);
    }

    QPainter painter3(this);
    painter3.setRenderHint(QPainter::Antialiasing);
    painter3.translate(width() / 4 * 3, height() / 8 * 3);
    painter3.scale(side / 600.0, side / 600.0);
    painter3.setPen(Qt::NoPen);
    painter3.setBrush(secondColor);
    painter3.save();
    if(time.second()>30)
	painter3.rotate(360 - (6.0 * (time.second()-30 + time.msec()/1000.0 )));
    else if (time.second()==0 && time.msec()<550)
	painter3.rotate(180 + 36.0 * time.msec()/100.0);
    painter3.drawConvexPolygon(secondHand,4);
    painter3.restore();
    painter3.setPen(secondColor);
    painter3.rotate(90);
    for (int j = 0; j < 30; ++j) {
	painter3.drawLine(92, 0, 96, 0);
        painter3.rotate(6.0);
    }
    //这些都和昨天一样了

}

void ShapedClock::resizeEvent(QResizeEvent * /* event */)
{
    int side = qMin(width(), height());
    QRegion maskedRegion(width() / 2 - side / 2, height() / 2 - side / 2, side,
                         side, QRegion::Ellipse);
    setMask(maskedRegion);
    //将表盘以外的Mask
}

QSize ShapedClock::sizeHint() const
{
    return QSize(200, 200);
    //默认尺寸
}

main.cpp

#include <QApplication>

#include "shapedclock.h"

int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    ShapedClock clock;
    clock.show();
    return app.exec();
}

效果图

可执行文件，说明，这次我没有编译静态库的Qt，所以这个只有装了Qt的机器才能用-_-b，静态库的估计要10几M大小吧。

就昨天写的十几行就有2个小BUG，哎-_-b