Ing.

Ricardo Castañeda

UNIVERSIDAD NACIONAL DE INGENIERÍA

FACULTAD DE INGENIERÍA MECÁNICA

CURSO MB544 – COMPUTACION II

Clase 13

2015

13. GRAFICOS EN VISUAL “C”

13.1. La clase CDC permite definir una clase de objetos denominados “ contextos
de dispositivo” (DC). Cuando se quiere dibujar en un dispositivo gráfico como una
pantalla o una impresora, primero hay que obtener un identificador de un contexto
de dispositivo que represente al dispositivo físico y que delimite el área donde se
puede pintar. Esto es porque una aplicación Windows no accede directamente al
1
Ing. Ricardo Castañeda

hardware de un dispositivo gráfico cuando quiere presentar un gráfico o texto

formateado, sino que utiliza una interfaz de dispositivo gráfico (GDI) que permite
realizar la presentación gráfica de una forma sencilla.
De la clase CDC se derivan las clases CClientDC, CwindowDC, CpaintDC y
CMetaFileDC, cada una de ellas con fines específicos para dar solución al proceso
en curso.
Para utilizarla hay cuatro pasos:
 Obtener el DC de un objeto determinado (ventana, impresora, etc.)
 Establecer los atributos de dibujo (color, plumas).
 Utilizar la API de Windows para dibujos en el DC.
 Liberar el DC una vez que se haya terminado de dibujar.
13.2. Tipos de contexto de dispositivo.
La obtención del contexto es algo fundamental. Windows proporciona una amplia
gama, como: Contexto para dibujar en pantalla, para acceder a la impresora, otro
para recabar información.
 DC de pantalla El DDC o Display Device Context se utiliza para acceder a los
objetos existentes en pantalla . Para crear este tipo de contexto se utiliza dos
funciones: BeginPaint() y GetDC(), para la liberación tenemos: EndPaint() y
ReleaseDC().
 Dc de Impresora El PDC o Printer Device Context es el DC que se utiliza para
acceder a cualquier tipo de
13.3. La clase CPaintDC se utiliza con la función OnPaint . para visualizar texto o
gráficos en el área de trabajo de una ventana en respuesta a un mensaje
VM_PAINT( se ejecuta la función OnPaint) hay que crear un objeto DC
perteneciente a la clase CpaintDC o una clase derivada de ella.
13.4. La clase Cbrush permite definir el pincel a utilizar con las funciones de dibujo.
Esta herramienta afecta a la forma en la que es pintado el interior de las figuras
cerradas. Cuando crea un contexto de dispositivo, existe un pincel por defecto que
pinta de blanco el interior de las figuras cerradas.
13.5. La clase Cpen permite definir la pluma a utilizar con las funciones de dibujo.
Esta herramienta afecta a la forma en la son dibujadas las líneas: líneas sólidas,
líneas discontinuas, etc. Cuando se crea un contexto de dispositivo, existe una
pluma por defecto que dibuja líneas negras sólidas que tienen ancho de un pixel.
APLICACIÓN DE GRAFICOS 01 Como aplicación de simple documento
desarrollemos una aplicación para dibujar un círculo:

2
Ing. Ricardo Castañeda

Siga las opciones indicadas

Finish

1) Ahora abra el archivo Graficos1Doc.h y modifique la declaración de la siguiente

manera

3
Ing. Ricardo Castañeda

class CGraficos1Doc : public CDocument

{protected: // create from serialization only
CGraficos1Doc();
DECLARE_DYNCREATE(CGraficos1Doc)
// Attributes
public:
int m_posicionx;
int m_posiciony;

// Operations
public:
// Overrides
// ClassWizard generated virtual function overrides
//{{AFX_VIRTUAL(CGraficos1Doc)
public:
virtual BOOL OnNewDocument();
virtual void Serialize(CArchive& ar);
//}}AFX_VIRTUAL
// Implementation
public:
virtual ~CGraficos1Doc();
#ifdef _DEBUG
virtual void AssertValid() const;
virtual void Dump(CDumpContext& dc) const;
#endif
protected:
// Generated message map functions
protected:
//{{AFX_MSG(CGraficos1Doc)
// NOTE - the ClassWizard will add and remove member functions here.
// DO NOT EDIT what you see in these blocks of generated code !
//}}AFX_MSG
DECLARE_MESSAGE_MAP() };

2) El siguiente paso será la declaración de los datos miembro de la clase vista, abrimos el
archivo Graficos1View.h

class CGraficos1View : public CView

{ protected: // create from serialization only
CGraficos1View();
DECLARE_DYNCREATE(CGraficos1View)
// Attributes
public:
CGraficos1Doc* GetDocument();
int m_posicionx;
int m_posiciony;

// Operations

4
Ing. Ricardo Castañeda

public:
// Overrides
// ClassWizard generated virtual function overrides
//{{AFX_VIRTUAL(CGraficos1View)
public:
virtual void OnDraw(CDC* pDC); // overridden to draw this view
virtual BOOL PreCreateWindow(CREATESTRUCT& cs);
protected:
virtual BOOL OnPreparePrinting(CPrintInfo* pInfo);
virtual void OnBeginPrinting(CDC* pDC, CPrintInfo* pInfo);
virtual void OnEndPrinting(CDC* pDC, CPrintInfo* pInfo);
//}}AFX_VIRTUAL
// Implementation
public:
virtual ~CGraficos1View();
#ifdef _DEBUG
virtual void AssertValid() const;
virtual void Dump(CDumpContext& dc) const;
#endif
protected:
// Generated message map functions
protected:
//{{AFX_MSG(CGraficos1View)
// NOTE - the ClassWizard will add and remove member functions here.
// DO NOT EDIT what you see in these blocks of generated code !
//}}AFX_MSG
DECLARE_MESSAGE_MAP()
};

3) Ahora inicialice los datos miembro de la clase de documento en la función

miembro OnNewDocument() de la clase CGraficos1Doc, para lo cual apertura el
archivo GraficosDoc.cpp y busque la función mencionada:

BOOL CGraficos1Doc::OnNewDocument()
{if (!CDocument::OnNewDocument())
return FALSE;
// TODO: add reinitialization code here
// (SDI documents will reuse this document)
m_posicionx;
m_posiciony;
return TRUE;
}
4) Ahora entre a MFC ClassWizard con CTRL+W y se le presentara la siguiente
ventana y haga clic en edit code para escribir lo siguiente:

5
Ing. Ricardo Castañeda

5) Escribir:
void CGraficos1View::OnInitialUpdate()
{ CView::OnInitialUpdate();
// Se obtiene el apuntador al documento
CGraficos1Doc* pDoc = GetDocument();
m_posicionx = pDoc->m_posicionx;
m_posiciony = pDoc->m_posiciony;

}
6) Para desplegar el circulo abra Graficos1View.cpp y localize OnDraw() y escriba el
siguiente codigo:
void CGraficos1View::OnDraw(CDC* pDC)
{ CGraficos1Doc* pDoc = GetDocument();
ASSERT_VALID(pDoc);
// TODO: add draw code for native data here
// define los limites rectangulares a dibujar
RECT rect;
rect.left = m_posicionx-20;
rect.top = m_posiciony -20;
rect.bottom = m_posiciony + 20;
rect.right = m_posicionx + 20;
// Dibuja el circulo
pDC->Ellipse(&rect);
}

7) Para dibujar el circulo abrir el MFC ClassWizard y seleccionar el siguiente evento :

Class name: CGraficos1View
ObjectID : CGraficos1View
Message: WM_LBUTTONDOWN y escriba lo siguiente:

6
Ing. Ricardo Castañeda

void CGraficos1View::OnLButtonDown(UINT nFlags, CPoint point)

{
m_posicionx = point.x;
m_posiciony = point.y;
// llamar a la funcion invalidate para ejecutar OnDraw()
Invalidate();
// Extrae el apuntador al documento
CGraficos1Doc* pDoc = GetDocument();
pDoc->m_posicionx = m_posicionx;
pDoc->m_posiciony = m_posiciony;
//Indicar que el documento fue modificado
pDoc->SetModifiedFlag(TRUE);

CView::OnLButtonDown(nFlags, point);
}

Compilar, Ejecutar y suerte.

APLICACIÓN DE GRAFICOS 02
La Clase Cfont Crear un nuevo proyecto llamado Graficos2 y dar OK a
continuación seleccionar Single Document y Finísh.
Ahora crear en la clase CGraficos2View la función que recibirá el nombre
ShowFonts(CDC +pDC), para ello hacer clic derecho sobre la clase y elegir Add Member
Function tal como se muestra:

7
Ing. Ricardo Castañeda

Y debe aparecer:

Y escribimos

void CGrafico2View::ShowFonts(CDC *pDC)

{ LOGFONT logFont;
logFont.lfHeight= 8;
logFont.lfWidth =0;
logFont.lfEscapement = 0;
logFont.lfOrientation =0 ;
logFont.lfWeight = FW_NORMAL;
logFont.lfItalic = 0;
logFont.lfUnderline = 0;
logFont.lfStrikeOut = 0;
logFont.lfCharSet = ANSI_CHARSET;
logFont.lfOutPrecision = OUT_DEFAULT_PRECIS;
logFont.lfQuality = PROOF_QUALITY;
logFont.lfPitchAndFamily = VARIABLE_PITCH| FF_ROMAN;
strcpy(logFont.lfFaceName,"Comic Sans MS");
// Inicia la posicion del texto en la ventana
UINT position = 0;
// Crea y muestra 8 fuentes de ejemplo
for ( UINT x=0; x<8;++x)
{ // Fija lanueva altura de la fuente
logFont.lfHeight = 16+(x*8);
// Crea una nueva fuente y la selecciona en el DC
CFont font;
font.CreateFontIndirect(&logFont);
CFont* oldFont = pDC->SelectObject(&font);
//Imprime el texto con lanueva fuente
position += logFont.lfHeight;
pDC->TextOut(20,position,"Texto de Ejemplo");
// restaura la fuente anterior en el DC
pDC->SelectObject(oldFont);
}

8
Ing. Ricardo Castañeda

Ahora ubique la funcion ONDraw() de la clase CGrafico2View y escribir solo lo indicado

void CGrafico2View::OnDraw(CDC* pDC)

{
CGrafico2Doc* pDoc = GetDocument();
ASSERT_VALID(pDoc); // TODO: add draw code for native data here
ShowFonts(pDC);
ShowFonts(pDC);

}
Suerte y ejecute

APLICACIÓN DE GRAFICOS 03
DESARROLLEMOS LA SERIE DE FOURIER UTILIZANDO LAS CLASES:
CBrush, CPen y CPaintDC.

Siga las opciones indicadas

9
Ing. Ricardo Castañeda

10
Ing. Ricardo Castañeda

Ingrese código en la función ON_PAINT, que se obtiene

El código escrito es:

void CF01View::OnPaint()
{
CPaintDC dc(this); // device context for painting
static DWORD dwColor [9] = {RGB(0,0,0), RGB(245,0,0), RGB(0,245,0),
RGB(0,0,245), RGB(245,245,0), RGB(245,0,245),

11
Ing. Ricardo Castañeda

RGB(0,245,245), RGB(127,127,127), RGB(245,245,245) };

int i,j,ltitulo,ang;
double y, yp;

CBrush n_brocha;
CBrush *v_brocha;
CPen n_pincel;
CPen *v_pincel;
// Crea superficie de dibujo
dc.SetMapMode(MM_ISOTROPIC); //Escala de sistema
dc.SetWindowExt(500,500);// Tamaño de la ventana
dc.SetViewportExt(m_cxClient, -m_cyClient);// Tamaño del área de dibujo
dc.SetViewportOrg(m_cxClient/20, m_cyClient/2);//establece origen de coordenadas

ang = 0;
yp = 0.0;

n_pincel.CreatePen(BS_SOLID,2,RGB(0,0,0));
v_pincel= dc.SelectObject(&n_pincel);

//dibuja los ejes de coordenadas x&y

dc.MoveTo(0,240);
dc.LineTo(0,-240);
dc.MoveTo(0,0);
dc.LineTo(400,0);
dc.MoveTo(0,0);

// Dibuja el espectro de la onda de Fourier

for( i = 0; i<= 400; i++)
{ for(j = 1; j <= nterms ; j++)
{
y = ( 150.0/((2.0*j)-1.0))* sin(((j*2.0)-1.0)*0.015708*ang);
yp = yp + y;
}
dc.LineTo(i, (int)yp);
yp-=yp;
ang++;
}
// Preparación para rellenar el interior del espectro
n_brocha.CreateSolidBrush(dwColor[7]);
v_brocha = dc.SelectObject(&n_brocha);
dc.ExtFloodFill(150,10,dwColor[0], FLOODFILLBORDER);
dc.ExtFloodFill(300,-10,dwColor[0],FLOODFILLBORDER);
// Imprime titulo
ltitulo = strlen(mititulo);
dc.TextOut(200-(ltitulo*8/2),185, _T(“50 armonicos de Fourier”),ltitulo);

//Borra los objetos

dc.SelectObject(v_brocha);
n_brocha.DeleteObject();

12
Ing. Ricardo Castañeda

// TODO: Add your message handler code here

// Do not call CView::OnPaint() for painting messages

}
A continuación para manejar el tamaño de la ventana ingrese código en la función OnSize
que se obtiene

Ingrese el siguiente código

void CF01View::OnSize(UINT nType, int cx, int cy)
{ CView::OnSize(nType, cx, cy);
m_cxClient = cx;
m_cyClient= cy;
// TODO: Add your message handler code here
}
Para completar realice las siguientes declaraciones en F01 View.cpp
#include "stdafx.h"
#include "F1.h"
#include "F1Doc.h"
#include "F1View.h"
#ifdef _DEBUG
#define new DEBUG_NEW
#undef THIS_FILE
static char THIS_FILE[] = __FILE__;
#endif
#include "math.h" // A PARTIR DE AQUÍ SON LAS DECLARACIONES
int m_cxClient,m_cyClient;
int nterms = 10;
char mititulo[80] = "10 armonicos de Fourier";
:

13