Qt画动态饼状图和环形

1.重绘事件

void paintEvent(QPaintEvent *event)
{
	Q_UNUSED(event);  //当你在函数中声明了一个参数但没有在函数体内使用它时，编译器会发出警告，提示该参数未被使用。通过使用Q_UNUSED宏，可以告诉编译器这个参数在函数体内确实没有被使用，从而避免编译器警告‌


	drawPie();
	drawArc();

	QPainter painterText(this);
	int side = qMin(width(), height());
	painterText.setViewport((width() - side) / 2, (height() - side) / 2, side, side);
	painterText.setWindow(-100, -100, 200, 200);
	painterText.setPen(Qt::black);

	QRectF textRect(-25, -8.75, 50, 50);
	// painterText.drawRect(textRect);
	int percent = angle / 3.6;
	//qDebug() << percent;
	painterText.drawText(textRect, Qt::AlignHCenter, QString::number(percent) + "%");
}

2.饼状图

void drawPie()
{
	QPainter painter(this);
	painter.setRenderHint(QPainter::Antialiasing);// 设置抗锯齿，使图形更平滑

	// 计算窗口的最小边长，确保饼状图是正方形的
	int side = qMin(width(), height());
	// 设置视口，使饼状图居中显示(设备坐标系: 也是物理坐标系。即真实的的物理坐标系(单位为像素),拉大窗口中，看上去图会小)
	painter.setViewport((width() - side) / 2, (height() - side) / 2, side, side);
	// 设置窗口坐标系,逻辑坐标系(世界坐标系也是逻辑坐标系): 即用户坐标系。也就是说日常大家使用Qt的时候的坐标系。拉大窗口中，图会变大
	//貌似是占视口矩形的百分比，起点为视口的原点
	// painter.setWindow(-500,-500,1000,1000);
	painter.setWindow(-100, -100, 200, 200);

	// 绘制第一个扇形
	painter.setPen(Qt::NoPen);// 设置无边框

	// 创建锥形渐变（QConicalGradient）
	 QConicalGradient conicalGradient(50,50, 0);  // 中心点(50,50)，起始角度为0
	 conicalGradient.setColorAt(1.0, QColor(0, 255, 0));  
	 conicalGradient.setColorAt(0.75, QColor(0, 255, 0));
	 conicalGradient.setColorAt(0.5, QColor("yellow")); 
	 conicalGradient.setColorAt(0.25, QColor("yellow"));
	 conicalGradient.setColorAt(0.0, QColor(255, 0, 0));  

	// conicalGradient.setColorAt(0/6, QColor("red"));
	// conicalGradient.setColorAt(1/6, QColor("yellow"));
	// conicalGradient.setColorAt(2/6, QColor("lime"));
	// conicalGradient.setColorAt(3/6, QColor("aqua"));
	// conicalGradient.setColorAt(4/6, QColor("blue"));
	// conicalGradient.setColorAt(5/6, QColor("magenta"));
	// conicalGradient.setColorAt(1, QColor("red"));

	// 线性渐变
	 //QLinearGradient linearGradient(0, 0, 100, 100);  // 从(0,0)到(100,100)的线性渐变
	 //linearGradient.setColorAt(0.0, Qt::green);
	 //linearGradient.setColorAt(0.5, Qt::yellow);
	 //linearGradient.setColorAt(1.0, Qt::red);
	 //painter.setBrush(linearGradient);

	// 径向渐变
	//QRadialGradient radialGradient(50,50, 50);  // 中心点(50,50)，半径50
	//radialGradient.setColorAt(0, QColor("red"));
	//radialGradient.setColorAt(0.5, QColor("yellow"));
	//radialGradient.setColorAt(1, QColor("purple"));
	//radialGradient.setColorAt(0.0, Qt::red);
	//radialGradient.setColorAt(0.8, Qt::blue);


	// 设置渐变画刷
	painter.setBrush(conicalGradient);

	//painter.setBrush(QColor(255, 0, 0));// 设置填充颜色为红色
	// 绘制扇形，参数分别为：矩形左上角坐标、宽度、高度（这个大小是按照窗口的比例算的），起始角度、跨度角度
	//painter.drawPie(-50, -50, 100, 100, -0 * 16, -angle * 16);
	painter.drawPie(0, 0, 100, 100, -0 * 16, -angle * 16);//（这两个角度必须为16的倍数）

	// 绘制第二个扇形
	painter.setBrush(Qt::gray);  // 设置填充颜色为灰色
	// 绘制扇形，剩余部分为灰色
	painter.drawPie(0, 0, 100, 100, -angle * 16, -(360 - angle) * 16);
}

3.环形

void drawArc()
{
	QPainter painter(this);
	painter.setRenderHint(QPainter::Antialiasing);// 设置抗锯齿，使图形更平滑

	// 计算窗口的最小边长，确保饼状图是正方形的
	int side = qMin(width(), height());
	// 设置视口，使饼状图居中显示(设备坐标系: 也是物理坐标系。即真实的的物理坐标系(单位为像素),拉大窗口中，看上去图会小)
	painter.setViewport((width() - side) / 2, (height() - side) / 2, side, side);
	// 设置窗口坐标系,逻辑坐标系(世界坐标系也是逻辑坐标系): 即用户坐标系。也就是说日常大家使用Qt的时候的坐标系。拉大窗口中，图会变大
	//貌似是占视口矩形的百分比，起点为视口的原点
	// painter.setWindow(-500,-500,1000,1000);
	painter.setWindow(-100, -100, 200, 200);


	QPen pen;
	pen.setWidth(12);
	/*设置圆弧连接处为圆形*/
	pen.setJoinStyle(Qt::RoundJoin);
	pen.setCapStyle(Qt::RoundCap);
	pen.setBrush(Qt::gray);
	painter.setPen(pen);
	painter.drawArc(-100, -100, 100, 100, 0, 360 * 16);//（这两个角度必须为16的倍数）
	
	pen.setWidth(10);
	/*设置圆弧连接处为圆形*/
	pen.setJoinStyle(Qt::RoundJoin);
	pen.setCapStyle(Qt::RoundCap);
	

	//int percent = angle / 3.6;
	//if (percent <= 25)
	//{
	//	//pen.setColor(Qt::green);
	//	pen.setBrush(Qt::green);
	//}
	//else if (percent > 25 && percent <= 75)
	//{
	//	pen.setColor(Qt::yellow);
	//}
	//else
	//{
	//	pen.setColor(Qt::red);
	//}

	// 线性渐变
	 QLinearGradient linearGradient(100, 100, -100, -100);  // 从(100,100)到(-100,-100)的线性渐变
	 linearGradient.setColorAt(0.0, QColor("#ffffff"));
	 linearGradient.setColorAt(1.0, QColor("#33FF00"));
	 pen.setBrush(linearGradient);

	painter.setPen(pen);

	//painter.drawArc(-50, -50, 100, 100, -0 * 16, -angle * 16);
	painter.drawArc(-100, -100, 100, 100, -0 * 16, -angle * 16);//（这两个角度必须为16的倍数）

	//painter.drawArc(-40, -40, 80, 80, 0 * 16, angle * 16);
}

4.角度变化

void updateAngle()
{
	angle += 10;// 每次更新角度增加10度

	if (angle > 360)
		angle = 0;// 如果角度超过360度，重置为0度

	update();// 调用update()函数，触发重绘事件
}