18——Chapter 4: Using Custom Property Types
最后更新于：2022-04-01 07:21:45
本系列所有文章可以在这里查看[http://blog.csdn.net/cloud_castle/article/category/2123873](http://blog.csdn.net/cloud_castle/article/category/2123873)
接上文[Qt5官方demo解析集17——Chapter 3: Adding Property Bindings](http://blog.csdn.net/cloud_castle/article/details/36886779)
在前面的“饼状图”Demo中，我们为这个自定义类型定义了"name"和"color"属性，他们都是基于Qt内置类型"QString"和"QColor"，这个例子则向我们演示了如何为这个PieChart添加自定义类型的属性。使用自定义类型的属性，更方便我们模块化编程。
这个项目中多了一个pieslice类，它用于饼状图的实际绘制，而PieChart仅用来提供框架：
piechart.h:
~~~
#ifndef PIECHART_H
#define PIECHART_H
#include <QtQuick/QQuickItem>
class PieSlice;
//![0]
class PieChart : public QQuickItem // 由于这个类不再需要进行实际绘制，所以继承自QQuickItem就可以了
{
Q_OBJECT
Q_PROPERTY(PieSlice* pieSlice READ pieSlice WRITE setPieSlice) // 我们定义了pieSlice属性，它是一个PieSlice类的指针
//![0]
Q_PROPERTY(QString name READ name WRITE setName) // color属性被移至PieSlice中
//![1]
public:
//![1]
PieChart(QQuickItem *parent = 0);
QString name() const;
void setName(const QString &name);
//![2]
PieSlice *pieSlice() const;
void setPieSlice(PieSlice *pieSlice);
//![2]
private:
QString m_name;
PieSlice *m_pieSlice;
//![3]
};
//![3]
#endif
~~~
piechart.cpp:
~~~
#include "piechart.h"
#include "pieslice.h"
PieChart::PieChart(QQuickItem *parent)
: QQuickItem(parent)
{
}
QString PieChart::name() const
{
return m_name;
}
void PieChart::setName(const QString &name)
{
m_name = name;
}
PieSlice *PieChart::pieSlice() const
{
return m_pieSlice;
}
//![0]
void PieChart::setPieSlice(PieSlice *pieSlice)
{
m_pieSlice = pieSlice;
pieSlice->setParentItem(this); // QML的可视化组件必须拥有一个父对象，否则无法显示
}
//![0]
~~~
将具体绘制放在一个单独的类中，pieslice.h:
~~~
#ifndef PIESLICE_H
#define PIESLICE_H
#include <QtQuick/QQuickPaintedItem>
#include <QColor>
//![0]
class PieSlice : public QQuickPaintedItem // 继承这个类以重载Paint
{
Q_OBJECT
Q_PROPERTY(QColor color READ color WRITE setColor)
public:
PieSlice(QQuickItem *parent = 0);
QColor color() const;
void setColor(const QColor &color);
void paint(QPainter *painter);
private:
QColor m_color;
};
//![0]
#endif
~~~
pieslice.cpp:
~~~
#include "pieslice.h"
#include <QPainter>
PieSlice::PieSlice(QQuickItem *parent)
: QQuickPaintedItem(parent)
{
}
QColor PieSlice::color() const
{
return m_color;
}
void PieSlice::setColor(const QColor &color)
{
m_color = color;
}
void PieSlice::paint(QPainter *painter)
{
QPen pen(m_color, 2);
painter->setPen(pen);
painter->setRenderHints(QPainter::Antialiasing, true);
painter->drawPie(boundingRect().adjusted(1, 1, -1, -1), 90 * 16, 290 * 16);
}
~~~
main.cpp:
~~~
#include "piechart.h"
#include "pieslice.h"
#include <QtQuick/QQuickView>
#include <QGuiApplication>
//![0]
int main(int argc, char *argv[])
{
//![0]
QGuiApplication app(argc, argv);
qmlRegisterType<PieChart>("Charts", 1, 0, "PieChart"); // 注册这两个C++类，定义在一个命名空间中
//![1]
qmlRegisterType<PieSlice>("Charts", 1, 0, "PieSlice");
//![1]
QQuickView view;
view.setResizeMode(QQuickView::SizeRootObjectToView);
view.setSource(QUrl("qrc:///app.qml"));
view.show();
return app.exec();
//![2]
}
//![2]
~~~
app.qml:
~~~
import Charts 1.0
import QtQuick 2.0
Item {
width: 300; height: 200
PieChart {
id: chart
anchors.centerIn: parent
width: 100; height: 100
pieSlice: PieSlice { // PieSlice属性的设置
anchors.fill: parent
color: "red"
}
}
Component.onCompleted: console.log("The pie is colored " + chart.pieSlice.color) // 最后在组件完成时显示这个饼状图的RGB值
}
//![0]
~~~
