龙岗企业网站制作公司,梅林 建站 wordpress,怎么创造免费网站,杭州高端品牌网站建设1.ui页面设计技巧 最外面的widget#xff1a; 上下左右的margin都置相同的值 这里有4个widget#xff0c;做好一个后#xff0c;后面3个可以直接复制.ui文件#xff0c;然后进行微调即可。
2.现阶段实现的效果#xff1a; 3.程序结构#xff1a; btn1---btn btn1---…1.ui页面设计技巧 最外面的widget 上下左右的margin都置相同的值 这里有4个widget做好一个后后面3个可以直接复制.ui文件然后进行微调即可。
2.现阶段实现的效果 3.程序结构 btn1---btn btn1---btn2 btn1---btn3 btn1---btn4 movable_widget---widget widget包含page1,page2 page1包含boot_time,cpu_usage_rate,power,wifi,widget1 boot_time包含progress_bar cpu_usage_rate包含dashboard power包含cell wifi包含speed_detection widget1包含widget3 page2包含security_defense_system,line_chart security_defense_system包含btn4,warning line_chart包含circle 4.实现下面的按钮效果 #ifndef BTN3_H
#define BTN3_H#include btn1.h
class btn3 : public btn1
{Q_OBJECT
public:btn3(QWidget * parent nullptr);
protected:void paintEvent(QPaintEvent *) override;
};#endif // BTN3_H#include btn3.h
#include QPainter
#include QDebug
btn3::btn3(QWidget * parent ): btn1(parent)
{this-setCheckable(1);this-setChecked(1);
}void btn3::paintEvent(QPaintEvent *)
{QPainter painter(this);painter.setRenderHints(QPainter::Antialiasing | QPainter::SmoothPixmapTransform | QPainter::TextAntialiasing, true);//qDebug()this-isChecked();//画背景painter.save();painter.setPen(Qt::NoPen);painter.setBrush(QBrush(QColor(255,255,255)));painter.drawRect(rect());painter.restore();//画圆角矩形painter.save();painter.setPen(Qt::NoPen);if(this-isChecked()){painter.setBrush(QBrush(QColor(51, 94, 255)));}else{painter.setBrush(QBrush(QColor(204, 204, 204)));}double sideqMin(width(),height());painter.drawRoundedRect(rect(),side/2,side/2);painter.restore();//画白色圆圈painter.save();painter.setPen(Qt::NoPen);painter.setBrush(QBrush(QColor(255,255,255)));double rside*3/5/2;QRect circle(-r,-r,2*r,2*r);//宽1,2,2,1if(this-isChecked()){painter.translate(3*width()/4,height()/2);}else{painter.translate(1*width()/4,height()/2);}painter.drawEllipse(circle);painter.restore();
}5.实现下面的按钮效果 #ifndef BTN4_H
#define BTN4_H#include btn1.h
class btn4 : public btn1
{Q_OBJECT
public:btn4(QWidget * parent nullptr);void set_normal_icon(QString icon);void set_hover_icon(QString icon);
protected:void paintEvent(QPaintEvent *) override;void enterEvent(QEvent *event) override;void leaveEvent(QEvent *event) override;
private:QPixmap normal_icon;QPixmap hover_icon;bool hover;
};#endif // BTN4_H#include btn4.h
#include QPainter
#pragma execution_character_set(utf-8)
btn4::btn4(QWidget * parent):btn1(parent)
{hover0;
}void btn4::set_normal_icon(QString icon)
{normal_iconQPixmap(icon);
}void btn4::set_hover_icon(QString icon)
{hover_iconQPixmap(icon);
}void btn4::paintEvent(QPaintEvent *)
{QPainter painter(this);painter.setRenderHints(QPainter::Antialiasing | QPainter::SmoothPixmapTransform | QPainter::TextAntialiasing, true);//画背景painter.save();painter.setPen(Qt::NoPen);painter.setBrush(QBrush(QColor(255,255,255)));painter.drawRect(rect());painter.restore();//画图标painter.save();painter.translate(width()/3,height()/2);QPixmap image;if(hover){imageQPixmap(hover_icon);}else{imageQPixmap(normal_icon);}QPixmap img image.scaled(this-width()/5, height()*5/6,Qt::IgnoreAspectRatio);painter.drawPixmap(-img.width()-5,-img.height()/2,img);painter.restore();//画文字painter.save();QFont font;font.setPointSize(10);font.setBold(true);painter.setFont(font);QPen pen;if(hover){pen.setColor(QColor(51, 94, 255));}else{pen.setColor(QColor(0,0,0));}painter.setPen(pen);painter.drawText(width()/3,0,width()*2/3,height(),Qt::AlignLeft | Qt::AlignVCenter,text());painter.restore();
}void btn4::enterEvent(QEvent *event)
{hover1;update();
}void btn4::leaveEvent(QEvent *event)
{hover0;
}5.局部样式表设计 #widget{
background-color: rgb(255, 243, 232);
border-top-left-radius:24px;
border-top-right-radius:24px;
}
QLabel{
font: 75 10pt 微软雅黑;
}
#pushButton{
border:none;
color:gray;
font: 10pt 方正小标宋简体;
}
#pushButton_2{
background-color:rgb(51, 94, 255);
border:none;
border-radius:20px;
color: rgb(255, 255, 255);
font: 10pt 方正小标宋简体;
}
#label_2{
border-image: url(:/page2/警告.png);
}
6.实现如下效果 #ifndef WARNING_H
#define WARNING_H#include QWidget
#include btn3.h
namespace Ui {
class warning;
}class warning : public QWidget
{Q_OBJECTpublic:explicit warning(QWidget *parent nullptr);~warning();void init_button(btn3 * btn);
private slots:void on_pushButton_2_clicked();void on_pushButton_clicked();private:Ui::warning *ui;btn3 * button;
};#endif // WARNING_Hvoid security_defense_system::on_pushButton_clicked()
{Warn-resize(this-width()-6,Warn-height());Warn-move(3,3);Warn-show();
}void warning::on_pushButton_2_clicked()
{//确定this-hide();button-setChecked(0);
}void warning::on_pushButton_clicked()
{//取消this-hide();button-setChecked(1);
}对于本人而言如果直接去实现这样精美的程序真的超级麻烦累。 但通过分块我每次都专注于一点点小的功能实现很有成就感同时也在一点点完善自己的小程序。 又做出一个小页面
效果图
