Re: Draw circle in a qframe

[vinithr]

Hi,

I am trying to draw a Main circle in a QFrame, Inside that main circle, I have two small eclipses those two will be touching each other at the center of the main circle. Those two small eclipse position should change according to the angle provided. I can able to generate paint even and draw a circle.But that is out of frame

Could you please help me out to draw that inside the frame and other two eclipse as well.. I am attaching my project file here.

Thanks in Advence

Added after 5 minutes:

mydrawtest.ui


<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>DrawFrontPage</class>
<widget class="QMainWindow" name="DrawFrontPage">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>573</width>
<height>448</height>
</rect>
</property>
<property name="windowTitle">
<string>DrawFrontPage</string>
</property>
<widget class="QWidget" name="centralWidget">
<widget class="QFrame" name="frame">
<property name="geometry">
<rect>
<x>100</x>
<y>40</y>
<width>281</width>
<height>261</height>
</rect>
</property>
<property name="frameShape">
<enum>QFrame::StyledPanel</enum>
</property>
<property name="frameShadow">
<enum>QFrame::Raised</enum>
</property>
</widget>
</widget>
<widget class="QMenuBar" name="menuBar">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>573</width>
<height>25</height>
</rect>
</property>
</widget>
<widget class="QToolBar" name="mainToolBar">
<attribute name="toolBarArea">
<enum>TopToolBarArea</enum>
</attribute>
<attribute name="toolBarBreak">
<bool>false</bool>
</attribute>
</widget>
<widget class="QStatusBar" name="statusBar"/>
</widget>
<layoutdefault spacing="6" margin="11"/>
<resources/>
<connections/>
</ui>

main.cpp


#include <QtGui/QApplication>
#include "drawfrontpage.h"

int main(int argc, char *argv[])
{
QApplication a(argc, argv);
DrawFrontPage w;
w.show();

return a.exec();
}


mydrawtest.cpp


#include "drawfrontpage.h"
#include "ui_drawfrontpage.h"


#include"QFrame"


DrawFrontPage::DrawFrontPage(QWidget *parent) :
QMainWindow(parent),
ui(new Ui::DrawFrontPage)
{
ui->setupUi(this);

}

DrawFrontPage::~DrawFrontPage()
{
delete ui;
}


void DrawFrontPage::paintEvent ( QPaintEvent * event ){
//QFrame::paintEvent( event );
//int m_radius = 4;
//if ( m_radius > 0 )
//{

QRectF rectangle(10.0, 20.0, 150.0, 150.0);

QPainter painter(this);
painter.drawEllipse(rectangle);


}

[Talei]

Instead of passing to drawEllipse() rect pass center and width/height.
Or calculate position based on the rect.

[ChrisW67]

Your code doesn't draw on a QFrame at all: you override the QMainWindow paint event, so you are drawing in the client area of the main window. Here's an example that draws a circle inside a frame that is a part of a main window:


#include <QtGui>

class MyFrame: public QFrame
{
Q_OBJECT
public:
explicit MyFrame(QWidget *p = 0): QFrame(p) {
setFrameStyle(QFrame::Box);
}
protected:
void paintEvent(QPaintEvent *event) {
QFrame::paintEvent(event);

int radius = qMin(event->rect().width(), event->rect().height()) / 2;

QPainter p(this);
p.drawEllipse(event->rect().center(), radius, radius);
}

};

int main(int argc, char **argv)
{
QApplication app(argc, argv);
QMainWindow m;
MyFrame *f = new MyFrame(&m);
m.setCentralWidget(f);
m.resize(150, 150);
m.show();
return app.exec();
}
#include "main.moc"


You can use Designer to put MyFrame into your UI using the Promotion feature.

[vinithr]

Thanks for your reply and your valuable time.

i have one more requirement in this regard.

I need to draw a plate kind of thing that will change according to the angle that we have provided say in lineEdit. 7831


The requirement is attached as screen shot image

Could you please help me out to draw this according to angle provided..


Thanks
Vinithr

[ChrisW67]

Why don't you take my example code and add some code:

To fill the circle, see QPainter::setBrush()
To draw two ellipses along the x or y axis (you already know how to draw an ellipse)
To allow setting a member variable containing the angle that the ellipses should be drawn at


Then read the Analog Clock Example to see how you might rotate the ellipses using QPainter::translate() and QPainter::rotate().

[vinithr]

Thanks for your reply.

I will check out and let you know the result.

Again thanks for your help and time.

Regards
vinithr

[vinithr]

Thanks for your help. But I did not reached that what i need. i tried to integrate the code that you are given. I attached the output that i got7834

Since i am new to Qt . i couldnt able to create a Event for the QFrame

In the image that i have attached, i have a frame In that frame only i need to draw the circle.
i have added the source code for your reference .



//Drawfrontpage.h



#ifndef DRAWFRONTPAGE_H
#define DRAWFRONTPAGE_H

#include <QMainWindow>
#include"QtGui"
#include"qpainter.h"
#include"QFrame"

namespace Ui {
class DrawFrontPage ;
}

class DrawFrontPage : public QMainWindow
{
Q_OBJECT

public:
explicit DrawFrontPage(QWidget *parent = 0);
~DrawFrontPage();


public:
void paintEvent ( QPaintEvent * event );
// void QFrame::paintEvent( QPaintEvent * event );



private:
Ui::DrawFrontPage *ui;
};


#endif // DRAWFRONTPAGE_H



//drawfrontpage.cpp


#include "drawfrontpage.h"
#include "ui_drawfrontpage.h"


#include"qframe.h"


DrawFrontPage:: DrawFrontPage(QWidget *parent) :
QMainWindow(parent),
ui(new Ui:: DrawFrontPage)
{
ui->setupUi(this);


}

DrawFrontPage::~DrawFrontPage()
{
delete ui;
}


void DrawFrontPage::paintEvent ( QPaintEvent * event ){

QFrame *myframe =new QFrame;
// QFrame::paintEvent(event);

int radius = qMin(event->rect().width(), event->rect().height()) / 2;
QPainter painter(this);
painter.drawEllipse(event->rect().center(), radius, radius);
/*
QRectF rectangle(10.0, 20.0, 150.0, 150.0);

QPainter painter(this);
painter.drawEllipse(rectangle);
*/

}
//}

//main.cpp


#include <QtGui/QApplication>
#include "drawfrontpage.h"

int main(int argc, char *argv[])
{
QApplication a(argc, argv);
DrawFrontPage w;
/* DrawFrontPage m;

QFrame *f = new QFrame(&m);

m.setCentralWidget(f);

// m.resize(150, 150);

m.show();
*/
w.show();

return a.exec();
}

Drafrontpage.ui


<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>DrawFrontPage</class>
<widget class="QMainWindow" name="DrawFrontPage">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>573</width>
<height>448</height>
</rect>
</property>
<property name="windowTitle">
<string>DrawFrontPage</string>
</property>
<widget class="QWidget" name="centralWidget">
<widget class="QFrame" name="myframe">
<property name="geometry">
<rect>
<x>270</x>
<y>50</y>
<width>281</width>
<height>261</height>
</rect>
</property>
<property name="frameShape">
<enum>QFrame::StyledPanel</enum>
</property>
<property name="frameShadow">
<enum>QFrame::Raised</enum>
</property>
</widget>
</widget>
</widget>
<layoutdefault spacing="6" margin="11"/>
<resources/>
<connections/>
</ui>



Could you please tell me how to create a QFrame Paint event in this code .

Thanks in advance
Regards
vinithr

[wysota]

Did you remember to take a look at the analog clock example? And as we're at it... Did you remember to actually read the post of your pre-poster with understanding? You have practically posted the same code again, totally ignoring what you were told.

[ChrisW67]

Could you please tell me how to create a QFrame Paint event in this code .

You don't. Qt generates paint events on a widget when the widget needs to be repainted. This happens, for example, if the widget is resized, exposed after being hidden, or program code calls QWidget::update() on a widget or one of its parents. Put a debug message inside my example's paintEvent() to see when it is called... then minimise, maximise, resize, partially hide and generally play with the window.

The idea of creating a custom widget with a custom paintEvent() to draw your circles is that the widget looks after drawing itself. In order to use the custom MyWidget you need to put it in your UI. You have not done that. There is a section in the Designer manual as to how you do that.

[vinithr]

Sorry for the late reply.

i draw whatever the things ineed to display. But Thats coming in the widget not in the frame.. If i am giving setcentralwidget the frame size get changed and its occupying the whole mainwindow.

Since i am new to Qt,i could nt able to proceed further. Could you please look in to the code that i have attached and could you please help me out to sort this issue.

i have added my output image also. In that image one frame is visible. In that frame only i need to draw that whole thing.
7929

Main.cpp


#include <QtGui/QApplication>
#include "drawfrontpage.h"

int main(int argc, char *argv[])
{
QApplication a(argc, argv);
DrawFrontPage w;
// DrawFrontPage m;

// QFrame *f = new QFrame(&m);

// m.setCentralWidget(f);

// m.resize(150, 150);

// m.show();

w.show();

return a.exec();
}


MainWindow.h



#ifndef DRAWFRONTPAGE_H
#define DRAWFRONTPAGE_H

#include <QMainWindow>
#include"QtGui"
#include"qpainter.h"
#include"QFrame"

namespace Ui {
class DrawFrontPage ;
}

class DrawFrontPage : public QMainWindow
{
Q_OBJECT

public:
explicit DrawFrontPage(QWidget *parent = 0);
~DrawFrontPage();


public:
void paintEvent ( QPaintEvent * event );
// void QFrame::paintEvent( QPaintEvent * event );



private:
Ui::DrawFrontPage *ui;
};


#endif // DRAWFRONTPAGE_H



Mainwindow.cpp



#include "drawfrontpage.h"
#include "ui_drawfrontpage.h"


#include"qframe.h"


int Direction=1; //0-> clockwise 1->anti Colockwise
int Angle=10;
int Temp1;
int Temp2;

DrawFrontPage:: DrawFrontPage(QWidget *parent) :
QMainWindow(parent),
ui(new Ui:: DrawFrontPage)
{
ui->setupUi(this);


}

DrawFrontPage::~DrawFrontPage()
{
delete ui;
}


void DrawFrontPage::paintEvent ( QPaintEvent * event ){

QFrame *myframe =new QFrame(this);
// QFrame::paintEvent(event);
// ui->myframe->setSizeIncrement(10,10);
// setCentralWidget(myframe)
// setCentralWidget(myframe);
int radius = qMin(event->rect().width(), event->rect().height()) / 2;
// QPainter painter(this);

/*
QRectF rectangle(10.0, 20.0, 150.0, 150.0);

QPainter painter(this);
painter.drawEllipse(rectangle);

*/
//fix the direction for the blade

if(Direction == 0)
{
if(Angle <=180)
{
Temp1 = 0 + Angle;
Temp2= 180+ Angle;
}
else
{
Temp1 = 0 + Angle;
Temp2= 0 + (Angle-180);

}
}
else
{
if(Angle <=180)
{
Temp1 = 360 - Angle;
Temp2= 180 - Angle;
}
else
{
Temp1 = 360 -Angle;
Temp2= 360 -(Angle-180);

}
}

static const QPoint hourHand[3] = {
QPoint(7, 8),
QPoint(-7, 8),
QPoint(0, -100)
};
static const QPoint minuteHand[3] = {
QPoint(7, 8),
QPoint(-7, 8),
QPoint(0, -100)
};

QColor hourColor(127, 0, 127);
QColor minuteColor(127, 0, 127);

int side = qMin(width(), height());

QPainter painter(this);
painter.drawEllipse(event->rect().center(), radius, radius);

painter.setRenderHint(QPainter::Antialiasing);

painter.translate(width() / 2, height() / 2);

painter.scale(side / 200.0, side / 200.0);

painter.setPen(Qt::NoPen);

painter.setBrush(hourColor);

painter.save();

painter.rotate(Temp1);
painter. drawConvexPolygon(hourHand, 3);
painter.restore();

painter.setPen(hourColor);


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

painter.save();
painter.rotate(Temp2);
painter.drawConvexPolygon(minuteHand, 3);
painter.restore();

painter.setPen(minuteColor);
}


Mainwindow.ui

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>DrawFrontPage</class>
<widget class="QMainWindow" name="DrawFrontPage">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>573</width>
<height>448</height>
</rect>
</property>
<property name="windowTitle">
<string>DrawFrontPage</string>
</property>
<widget class="QWidget" name="centralWidget">
<widget class="QFrame" name="myframe">
<property name="geometry">
<rect>
<x>270</x>
<y>50</y>
<width>281</width>
<height>261</height>
</rect>
</property>
<property name="frameShape">
<enum>QFrame::StyledPanel</enum>
</property>
<property name="frameShadow">
<enum>QFrame::Raised</enum>
</property>
</widget>
</widget>
</widget>
<layoutdefault spacing="6" margin="11"/>
<resources/>
<connections/>
</ui>


Thanks for your response and looking forward to close this issue ASAP

Regards
vinithr

[ChrisW67]

Get rid of the references to a QFrame in your custom widget code. You can probably also dispense with whatever Designer UI stuff you have associated with your custom widget and inherit from QWidget rather than QMainWindow. Put an instance of your custom widget inside a QFrame instance, put that QFrame instance in the central area of a QMainWindow. Problem solved.

[vinithr]

Thanks for your reply.


Since i am new to Qt and C++ , Could you please tell me in the beginer understanding format.


And could you please tell me what are the things i need to put in that QFrame class and How do i need to call that QFrame class from MainWindow.

Thanks in Advance.

Regards
Vinithr

[ChrisW67]

And could you please tell me what are the things i need to put in that QFrame class
You do not need to subclass or extend QFrame at all. You need to use a QFrame instance to contain your circle drawing widget. You need to create the container (a QFrame), create the contained widget (a MyCircleDrawingWidget), add the contained widget to a layout and set the layout on the container.

How do i need to call that QFrame class from MainWindow.
Just like any other widget.

I am not going to write the entire solution for you.