Use QT development to draw flow graphs for multiple devices (with Project map)

First, Description:

In the actual project, the main use of QT development CS Program, of course, mainly the client. The company project has this demand is the real-time display of multiple equipment flow graph, the device will send traffic information to the server, the service end of the information through the socket to the QT client, QT client through the socket received in real-time display in a window of the program; This display is shown in the form of a graph.

Second, the interface model
After receiving this feature requirement, the interface model used as shown, the diagram is already marked clearly, I do not have more detailed description:

Third, functional analysis

1, because of more equipment, more than 100 units, so it is not possible to each device flow curve are used a color, so only select a few more obvious color as the flow curve of the device color, each come up with a device, one of the colors to draw a curve.

2. Use QSS to set style information for a part, such as foreground, background, selected, mouse move, etc.

3, use a part as a special drawing part, the part is placed in the window, so install the event filter, used to redraw the sub-part information, draw a graph.

4, processing equipment on-line/offline network messages and the device actively send dynamic traffic information; Handles connection/disconnection events between QT clients and the server.

Four, the interface effect

The resulting development is as follows:

The flow graph for all initial devices such as

Select a traffic map with the device name A5, where the flow curve of the A5 device is bold, the background translucent and other effects such as

Select a traffic map with the device name A7, where the flow curve of the A7 device is bold, the background translucent and other effects such as

Five, the main code

1//message filtering, primarily used to redraw child controls, filter paint Events 2 bool Qaprtcurwidget::eventfilter (Qobject *watched, qevent *event) 3 {4     if (watched== UI->WIDGET_RXTX && Event->type () ==qevent::P aint) 5     {6         updatewidgetrtx (); 7     }8     return Qframe::eventfilter (watched,event); 9}

1//Drawing operation 2 void Qaprtcurwidget::updatewidgetrtx () 3 {4     qpainter painter (ui->widget_rxtx); 5     Painter.setfont (Qfont ("Times", Qfont::bold)); 6     //Draw background Color 7     painterbackground (painter); 8     //Draw the leftmost dashed line, used to separate from List 9     painterleftdashline (painter );     //Draw ordinate text identifier one by one     updatevtextid (painter);     //Draw ordinate text scale and horizontal vertical axis     Updatevtextmarkandcoord ( painter);     //Draw Rx curve     paintrxlineinfo (painter);     //Draw TX curve     painttxlineinfo (painter); 18}

 1//Draw ordinate text scale and horizontal axis 2 void Qaprtcurwidget::updatevtextmarkandcoord (Qpainter &painter) 3 {4 painter.save (); 5 The actual height of the plot interval (part height-top interval-bottom interval) 6 int nactpaintheight = Ui->widget_rxtx->height ()-interval_widget_top-interval_ Widget_bottom; 7//Interval height 8 float fintervalheight = ((float) nactpaintheight)/(M_NVSINGLELINEPOINTCOUNT-1);     9 Float Fypointforzero = ui->widget_rxtx->height ()-interval_widget_bottom;10 Double ddividevalue = 0;11 if (ui->toolbutton_rxflow->ischecked ()) {Ddividevalue = (double) nrxmaxvalue)/(M_nvsinglelinepointco UNT-1)}15 if (ui->toolbutton_txflow->ischecked ()) + {Ddividevalue = ((double) ntxmaxvalue)/         (m_nvsinglelinepointcount-1);}19 for (int nindex=0;nindex<m_nvsinglelinepointcount;++nindex) 20 {21 Set text color Painter.setpen (textcolor_widget_paint), 23//To make the original font smaller, set to 824 qfont Objfont = painter.f Ont (); objfont.setpointsIze (8); Painter.setfont (Objfont); 27//Draw the text, plus 3 for the purpose of it and the horizontal line can maintain the middle level of the Painter.drawtext (Interval_vmark         _left,fypointforzero-nindex*fintervalheight+3,qcommonop::getkmstrforbit (Ddividevalue*nindex)); 29//Set horizontal line Color 30         Painter.setpen (Coordcolor_widget_paint); 31//Horizontal line (the first and last bar is solid, the middle is dashed), qpen Objpen = Painter.pen (); 33 if (0==nindex | | (m_nvsinglelinepointcount-1) ==nindex) {Objpen.setstyle (qt::solidline);}37 else3 8 {objpen.setstyle (Qt::D ashline),}41 Painter.setpen (Objpen), and float x1         = Ui->widget_rxtx->width ()-interval_widget_right;43 float y1 = fypointforzero-nindex*fintervalheight;44  Painter.drawline (interval_hcoord_left,fypointforzero-nindex*fintervalheight,x1,y1);}46 int nActPaintWidth = Ui->widget_rxtx->width ()-interval_hcoord_left-interval_widget_right;47//interval height at intervals--Landscape: note Use (float) Nactpaintwidth) asNumerator, floating point number: Fintervalwidth = ((float) nactpaintwidth)/(M_nhsinglelinepointcount-1), and (int nindex=0;nindex&l T;m_nhsinglelinepointcount;++nindex) {Wuyi Qpen Objpen = Painter.pen (); if (0==nindex | | (m_nhsinglelinepointcount-1) ==nindex) (Objpen.setstyle) (qt::solidline),}56 else5 7 {objpen.setstyle (Qt::D ashline);}60 Painter.setpen (objpen); int Nxpoi NT = interval_hcoord_left+nindex*fintervalwidth;62 Painter.drawline (nxpoint,interval_widget_top,nxpoint,ui->wi Dget_rxtx->height ()-interval_widget_bottom);}64 Painter.restore (); 65}

Use QT development to draw flow graphs for multiple devices (with Project map)