guía de trabajo ahora que esta abierto el laboratorio curso... · 2007. 7. 26. · ahora con la...

30
1 Guía de Trabajo ahora que esta abierto el Laboratorio Temas: 1.- Arcos. 2.- Rectángulos. 3.- Óvalos. 4.- Líneas. 5.- Polígonos. 1.- Arcos Para Trabajar con Arcos existen reglas específicas, las cuales define lo que haremos con nuestra gráfica. En este caso, existen dos métodos: g.drawArc(x, y, Ancho, Alto, Angulo_Inicial, Angulo_Final); X, Y: Son las coordenadas de Impresión del Arco. Alto y Ancho: Son los valores en que se ampliara la gráfica. Angulo Inicial: es el valor del ángulo donde iniciara a imprimirse. Angulo final: es hasta donde se prolongara el arco. g.fillArc(x, y, Ancho, Alto, Angulo_Inicial, Angulo_Final); Alto del Arco Ancho del Arco Punto X, Y Angulo Inicial Angulo Final Alto del Arco Punto X, Y Angulo Inicial Angulo Final Ancho del Arco Arco sin Relleno: solo el borde es dibujado Arco con Relleno: es dibujado con relleno.

Upload: others

Post on 17-Aug-2020

1 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

1

Guía de Trabajo ahora que esta abierto el Laboratorio

Temas: 1.- Arcos. 2.- Rectángulos. 3.- Óvalos. 4.- Líneas. 5.- Polígonos.

1.- Arcos Para Trabajar con Arcos existen reglas específicas, las cuales define lo que haremos con nuestra gráfica. En este caso, existen dos métodos:

g.drawArc(x, y, Ancho, Alto, Angulo_Inicial, Angulo_Final);

X, Y: Son las coordenadas de Impresión del Arco. Alto y Ancho: Son los valores en que se ampliara la gráfica. Angulo Inicial: es el valor del ángulo donde iniciara a imprimirse. Angulo final: es hasta donde se prolongara el arco.

g.fillArc(x, y, Ancho, Alto, Angulo_Inicial, Angulo_Final);

Alto del Arco

Ancho del Arco

Punto X, Y

Angulo Inicial

Angulo Final

Alto del Arco

Punto X, Y

Angulo Inicial

Angulo Final

Ancho del Arco

Arco sin Relleno: solo el borde es dibujado

Arco con Relleno: es dibujado con relleno.

Page 2: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

2

En su Forma simple un Arco import java.awt.*; import javax.swing.*; import java.applet.Applet; import java.applet.*; public class Ovalitos extends JApplet { int x=20; int y=20; public void paint(Graphics g) { int Ancho =100, Alto=100; int Angulo_Inicial = 90, Angulo_Final=180; g.setColor(Color.MAGENTA); g.drawRect(x,y,Ancho,Alto); g.setColor(new Color(10,10,200)); g.fillArc(x,y,Ancho,Alto,Angulo_Inicial,Angulo_Final);

}//Fin del Metodo paint }

Para hacer practica esta parte, procedemos al diseño puntual de una imagen, la cual es una nube con una serie de arcos: import java.awt.*; import javax.swing.*; import java.applet.Applet; import java.applet.*; public class Arcos1 extends JApplet { public void paint(Graphics g)

Page 3: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

3

{ int x=20; int y=20; /****Todo lo de Arriba ***/ //Extremo Izquierdo g.setColor(new Color(225,200,1)); g.drawArc(x,y,20,20, 10,270); //Centro Arriba g.setColor(new Color(225,200,1));g.drawArc(x+10,y,20,20, 0,180); //Derecha Superior g.setColor(new Color(225,200,1)); g.drawArc(x+20,y,20,20, 270,220); /**** Ahora Abajo ****/ //Extremo Izquierdo g.setColor(new Color(225,200,1)); g.drawArc(x,y+15,20,20, 90,270); //Centro Arriba g.setColor(new Color(225,200,1)); g.drawArc(x+10,y+15,20,20, 180,180); //Derecha Superior g.setColor(new Color(225,200,1)); g.drawArc(x+20,y+15,20,20, 230,200); }//Fin del Método Gráfico }//Fin de la clase principal Oval2

Page 4: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

4

Como Trabajar con Arcos en Java Para trabajar con Arcos se tiene que considerar que existe un punto X,Y y sobre un Área Rectangular y que en dependencia del Arco, si este gira a la derecha (en contra de las manecillas del reloj, este es positivo)o a la izquierda (estará en contra de las manecillas del Reloj).

import java.awt.*; import javax.swing.*; import java.applet.Applet; import java.applet.*; public class Nube1 extends JApplet{

public void paint(Graphics g) {

int x=20; int y=20; //Color Amarillo

g.setColor(new Color(225,200,1)); //Arco con Angulo Positivo de 10º hasta 270º

g.drawArc(X,Y,200,200, 10,270); //Color Verde g.setColor(new Color(200,255,1)); //Rectángulo que delimita la figura del arco con el mismo Rectángulo. g.drawRect( x,y,200,200);

} //Fin del método gráfico. }//Fin de la Clase Nube

Punto (X,Y) Ancho del Arco

Alto del Arco

Page 5: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

5

Queremos Dibujar un Nube con Arcos Los Pasos a seguir son considerando los detalles y reglas que se siguen al momento de dibujar arcos, es decir, si lo queremos relleno el arco o solo el borde. Por ejemplo, como se puede observar en la gráfica, para poder dibujar una nube probablemente no nos resultara con arcos rellenos, pero esto no quiere decir que esa gráfica esta mala o dañada, en nuestro caso, más bien da un retoque una estética singular, lo cual hace ver una imagen interesante.

Las Instrucciones hasta este momento fuesen las siguientes: import java.awt.*; import javax.swing.*; import java.applet.Applet; import java.applet.*; public class Nube1 extends JApplet{

public void paint(Graphics g) {

int x=20; int y=20; /****Todo lo de Arriba ***/ //Extremo Izquierdo g.setColor(new Color(225,200,1)); g.drawArc(x,y,20,20, 10,270); /*Centro Arriba*/ g.setColor(new Color(225,200,1)); g.drawArc(x+10,y,20,20, 0,180); //Derecha Superior g.setColor(new Color(225,200,1)); g.drawArc(x+20,y,20,20, 270,220);

} //Fin del método gráfico. }//Fin de la Clase Nube

Page 6: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

6

Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar que estas de forma inversa, o sea en la parte de debajo de la nube.

Las Instrucciones serían en este momento: import java.awt.*; import javax.swing.*; import java.applet.Applet; import java.applet.*; public class Nube1 extends JApplet{

public void paint(Graphics g) {

int x=20; int y=20; /**** Ahora Abajo **** Extremo Izquierdo**/ g.setColor(new Color(225,200,1)); g.drawArc(x,y+15,20,20, 90,270); //Centro Arriba g.setColor(new Color(225,200,1)); g.drawArc(x+10,y+15,20,20, 180,180); //Derecha Superior g.setColor(new Color(225,200,1)); g.drawArc(x+20,y+15,20,20, 230,200);

} //Fin del método gráfico. }//Fin de la Clase Nube Para ver el objeto final, el cual es nuestra nube, entonces procedemos a unir las partes:

Page 7: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

7

import java.awt.*; import javax.swing.*; import java.applet.Applet; import java.applet.*; public class Nube1 extends JApplet{

public void paint(Graphics g) {

int x=20; int y=20; /****Todo lo de Arriba ***/ //Extremo Izquierdo g.setColor(new Color(225,200,1)); g.drawArc(x,y,20,20, 10,270); /*Centro Arriba*/ g.setColor(new Color(225,200,1)); g.drawArc(x+10,y,20,20, 0,180); //Derecha Superior g.setColor(new Color(225,200,1)); g.drawArc(x+20,y,20,20, 270,220);

/**** Ahora Abajo **** Extremo Izquierdo**/ g.setColor(new Color(225,200,1)); g.drawArc(x,y+15,20,20, 90,270); //Centro Arriba g.setColor(new Color(225,200,1)); g.drawArc(x+10,y+15,20,20, 180,180); //Derecha Superior g.setColor(new Color(225,200,1)); g.drawArc(x+20,y+15,20,20, 230,200);

} //Fin del método gráfico. }//Fin de la Clase Nube Al final podrá observar la grafica de una nube compuesta de seis arcos sin relleno.

Page 8: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

8

Tarea número uno: Ahora que usted ya tiene claro como es el diseño de arcos, tendrá que crear un árbol tal como un laurel de la India (como lo que están en el internado o malinche), todo el grafico tiene que ser diseñado con arcos. Tarea número dos: Se requiere crear las hola de mar de un paisaje (en base a arcos), el cual se muestra entre el intervalo cien y doscientos de la coordenada x. Tarea número tres: Ahora que usted ya tiene claro como es el diseño de arcos y ha dibujado un árbol, su misión es diseñar un árbol de navidad considerando que este puede tener nieve, luego repita este procedimiento para tener cinco árboles, luego para veinte árboles y por ultimo para un bosque completo.

2.- Rectángulos De igual forma que el caso anterior, usted puede trabajar con los rectángulos de forma rellena y sin relleno, es decir solo dibujando el borde de la imagen.

g.drawRect(Coor_X, Coor_Y, Ancho, Alto) g.fillRect(Coor_X, Coor_Y, Ancho, Alto)

Coor_X y Coor_Y: Expresan las coordenadas de impresión del rectángulo. Ancho: Ancho del rectángulo. Alto: Alto del rectángulo.

//Dibujando Rectangulo dibujo g.setColor(Color.BLUE); g.drawRect(75,100,100,150); Existe alguna similitud al dibujar el ovalo en Java. Observando el parecido de un Ovalo con respecto al rectángulo. g.setColor(Color.RED); g.fillOval(75,100,100,150);

Ancho del Rectángulo

Alto del Rectángulo

Punto X, Y

Page 9: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

9

g.setColor(Color.YELLOW); g.fillRect(205,125,100,100); g.setColor(Color.GREEN); g.fillOval(205,125,100,100);

3.- Óvalos Los óvalos son dibujados a partir de un área rectangular, la cual expresa el espacio donde estará el primitivo gráfico.

g.setColor(Color.RED); g.fillOval(75,100,100,150); Ovalo con Relleno Ovalo con sin Relleno fillOval(coorx, coordy, Ancho, Alto)

drawOval(coorx, coordy, Ancho, Alto)

Coorx y Coordy: expresan las coordenadas x, y de impresión del Ovalo. Ancho: Ancho del Ovalo (son las coordenadas de ampliación en x). Alto: Alto del Ovalo (son las coordenadas de ampliación en y).

Alto del óvalo

Ancho del óvalo

Punto X,Y

Page 10: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

10

Un Ejemplo de una Aplicación de Óvalos (sigamos con la nube) import java.awt.*; import javax.swing.*; import java.applet.Applet; import java.applet.*; public class Ovalitos extends JApplet { int x=20; int y=20; public void paint(Graphics g) { int Ancho =100, Alto=100; g.setColor(Color.MAGENTA); g.drawRect(x,y,Ancho,Alto); g.setColor(new Color(10,10,200)); g.fillOval(x,y,Ancho,Alto); }//Fin del Metodo paint }//Fin de la Clase Principal

Un ejemplo práctico Siempre considerado el caso de las nubes:

Page 11: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

11

import java.awt.*; import javax.swing.*; import java.applet.Applet; import java.applet.*; public class Ovalitos extends JApplet { int x=20; int y=20; public void paint(Graphics g) { int Ancho =100, Alto=100; int Angulo_Inicial = 90, Angulo_Final=180; g.setColor(new Color(225,200,1)); x=200; y=100; int ancho=20; int alto=20; g.fillOval(x,y,ancho,alto); g.fillOval(x+13,y,ancho, alto); g.fillOval(x+13,y,ancho,alto); g.fillOval(x+7,y+7,ancho,alto); g.fillOval(x-7,y+7,ancho,alto); g.fillOval(x+21,y+7,ancho,alto); g.fillOval(x,y+13,ancho,alto); g.fillOval(x+13,y+13,ancho, alto); g.fillOval(x+13,y+13,ancho,alto); }//Fin del Metodo paint }

Page 12: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

12

4.- Líneas Para esta parte no hay nada nuevo, solo es seguir los pasos vistos en clases: draw.Line(coorx_inicial, coordy_inicial, coordx_final, coordy_final) int x=20; int y=20, g.setColor(new Color(255,220,1)); g.drawLine(x,y,x+20, y);

Un programa para visualizar estos detalles: import java.awt.*; import javax.swing.*; import java.applet.*; public class Ovalos extends JFrame{ public Ovalos() { super("Usos de Primitivos gráficos"); setSize(600,250); setVisible(true); } public void paint(Graphics g) { /***************Escaleras **********/ //parte de abajo del fondo int x=20, contador=0, numerosDeEscalones=10; int y=20; //Dibujando Escalera while (contador < numerosDeEscalones) { //Dibujando parte Horizontal del Escalon g.setColor(new Color(255,220,1)); g.drawLine(x,y,x+20, y); //Dibujando parte vertical del Escalon g.setColor(new Color(155,155,1)); g.drawLine(x+20, y,x+20,y+20); //Moviendose hacia abajo, alejandose del origen

Page 13: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

13

x=x+20; y=y+20; contador++; }//Fin de la construccion del Escalon /*************** Pared ***********/ x=200; y=20; contador=0; numerosDeEscalones=10; int fila =0; while ((contador < numerosDeEscalones)&&(fila<4)) { //Dibujando Paredes (Rellenas) g.setColor(new Color(255,100,100)); g.fill3DRect(x,y,20,20,true); //Presentar Borde de Color Diferente g.setColor(new Color(100,50,100)); g.draw3DRect(x,y,20,20,true); x=x+22; contador++; //Crear otra Fila de Ladrillos en la pared if (contador == 10) { //Moviendo las coordenadas al Principio de la Fila Proxima //Estableciendo coordenadas de Impresion x=200; y=y+22; contador=0; fila++; }//Fin de la segunda Fila }//fin del While que dibuja las escaleras //Dibujando tercer dibujo g.setColor(Color.BLUE); g.drawRect(75,100,100,150); g.setColor(Color.RED); g.fillOval(75,100,100,150); g.setColor(Color.YELLOW); g.fillRect(205,125,100,100); g.setColor(Color.GREEN); g.fillOval(205,125,100,100); }//Fin del Metodo Principal public static void main(String args[])

Page 14: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

14

{ Ovalos aplicacion = new Ovalos(); aplicacion.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); } }

Para trabajar en Java con Polígonos existen tres formas para la asignación, manejo y manipulación de arreglos en Java, a continuación procedemos a mostrar cada uno de los casos:

En esta forma trabajamos con el método:

drawPoligon(XPuntos[],YPuntos[],cantidad_Puntos) El primer parámetro define los puntos en la coordenada X, el segundo parámetro se utiliza para establecer los puntos en la coordenada Y, y el último argumento es la cantidad de puntos de las coordenadas X y Y que usted desea gráficar. import java.awt.*; import javax.swing.*; import java.applet.Applet;

Page 15: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

15

public class poligono1 extends JApplet { int polx[]={150,130,100,130,150,170,200,170,150}; int poly[]={100,130,150,170,200,170,150,130,100}; public void paint (Graphics g) { g.drawPolygon(polx, poly, 9); } }//Fin de la clase poligono1

Otra forma de trabajo con es trabajar con Polygon, el cual mostramos a continuación:

drawPoligon(Poligono) //Usted defina los puntos. int Poligonox[]={150,130,.... …100,130,150,170,200,170,150}; int Poligonoy[]={100,130,… ….150,170,200,170,150,130,100}; //Definir el Objeto a utilizar. Polygon Pol; * * * //Hacer los siguientes ajustes al metodo paint. Public void paint(Graphics g) { Pol = new Polygon(Poligonox, Poligonoy, cant_puntos);

Page 16: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

16

g.drawPoligon(Pol); }//Fin del método paint Ahora vea en el Programa poligono1 los ajustes que se tuvieron que se tiene que realizar: import java.applet.Applet; import java.awt.*; import javax.swing.*; public class poligono2 extends JApplet { int polx[]={150,130,100,130,150,170,200,170,150}; int poly[]={100,130,150,170,200,170,150,130,100}; Polygon Pol; public void paint (Graphics g) { Pol = g.drawPolygon(polx, poly, 9); g.drawPolygon(Pol); } }//Fin de la clase poligono1

Page 17: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

17

Para las últimas dos formas, usted ya esta familiarizado, ya que esto se dio en la segunda semana de clases, además de que usted se comprometió a investigar sobre el caso, por tal motivo, procedemos a la tercera forma:

g.drawPolygon(new Polygon(new int [] {110,120,150,135,100}, new int [] {40,20,70,85,60}, 5) ); Es dentro de los parámetros de Poligon que nosotros declaramos y definimos los elementos del arreglo, así como la cantidad de puntos. Entonces esta en sus manos todo lo que involucra el arreglo. import java.applet.Applet; import java.awt.*; import javax.swing.*; public class poligono3 extends JApplet { public void init()

{ resize(200,200);

} public void paint (Graphics g) {

g.drawPolygon(new Polygon(new int [] {110,120,150,135,100}, new int [] {40,20,70,85,60}, 5) );

} }//Fin de la clase poligono1

Page 18: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

18

1.- A continuación se presentan las siguientes coordenadas o puntos, los cuales usted tiene que desarrollar, utilizando cualquiera de las técnicas antes vista: Puntos: Int tx1[]={156,130,100,150,175,156,130,150}; Int tx2[]={100,110,130,135,120,100,110,135}; Int t2x1[]={130,100,150,130}; Int t2y1[]={110,130,135,110}; Int t2x2[]={130,150,175,156,130}; Int t2y2[]={110,135,120,100,110}; Int Pfx1[]={110,110,140,140,110}; Int Pfy1[]={130,158,158,130,130}; Int Plx1[]={165,140,140,165,165}; Int Ply1[]={120,130,158,140,120}; Utilice la técnica que este a su alcance o considere más adecuada para graficar cada uno de esos puntos. Recuerde asignar color y es su decisión si desea relleno. 2.- Analizar el siguiente código: import java.awt.*; import javax.swing.*; import java.applet.Applet; public class Observar extends JApplet { public void init()

{ resize(200,200);

} public void paint (Graphics g) {

int n=0; int x=20; int y=20; while (n<10) { g.drawLine(x,y,x+100,y); y=y+10; n++; }

}

Page 19: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

19

}//Fin de la clase Observar Observar lo que hace el programa, una vez claro, haga los ajustes para que paralelo a la línea vertical y al lado izquierdo aparezca un rectángulo de color rojo relleno con ancho y alto del tamaño de la línea que se imprime. 3.- Nuevamente analizar el Código que se le presenta, interprete y haga los ajustes si usted estima conveniente: /* * Creado el Martes 9 de Abril del 2007 */ import java.awt.*; import java.applet.Applet; import java.awt.event.*; public class Escalones extends Applet implements AdjustmentListener { private Scrollbar escalones; private int contador, numeroDeEscalones; public void init() { escalones=new Scrollbar(Scrollbar.HORIZONTAL,0,1,0,100); add(escalones); escalones.addAdjustmentListener(this); } public void adjustmentValueChanged(AdjustmentEvent g) { numeroDeEscalones=escalones.getValue(); repaint(); } public void paint( Graphics g ) { int cont=0; int x=20,y=20; while(cont < numeroDeEscalones) { g.setColor(new Color(50,40,100)); g.drawLine(x,y,x+20,y); g.drawLine(x+20,y,x+20,y+20); x=x+20; y=y+20;

Page 20: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

20

cont++; }/*** Fin del Ciclo While que controla la impresion de las escaleras. ***/ } }/*** Fin de la Clase Escalones. ***/

Page 21: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

21

java.awt.Graphics2D

– Utiliza el mismo modelo empleado por Graphics – Para usarlo…

public void paint(Graphics g) {

Graphics2D g2 = (Graphics2D) g; ... }

java.awt.Graphics2D

– API Extendido para manejo de textos, imágenes, colores, formas e impresión – Manejo de características avanzadas como

• Transparencia • Antialiasing • Canales Alpha • Composición • Transformación

Ejemplo – Uso de gráficos primitivos (En su Forma Simple)

Arc2D Ellipse2D QuadCurve2D

Area GeneralPath Rectangle2D

CubicCurve2D Line2D RectangularShape

Dimension2D Point2D RoundRectangle2D

java.awt.geom – formas primitivas

java.awt java.awt.geom

java.awt.font java.awt.color java.awt.image

java.awt.image.renderable java.awt.print

Page 22: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

22

public void paint(Graphics g) { Graphics2D g2 = (Graphics2D) g; g2.setStroke(new BasicStroke(2.0f)); g2.draw(new Rectangle2D.Double(5, 5, 50, 20)); g2.setStroke(new BasicStroke(4.0f)); g2.draw(new RoundRectangle2D.Double(5, 30, 50, 20, 5, 5)); g2.setStroke(new BasicStroke(2.0f)); g2.draw(new Arc2D.Double(5, 55, 50, 20, 90, 135, Arc2D.OPEN)); g2.draw(new Ellipse2D.Double(5, 80, 50, 20)); }

A continuación procedemos al diseño de una aplicación donde podemos observar los primitivos gráficos en Dos Dimensiones en JAVA. Cabe recalcar que no están todos los métodos, usted tendrá que la investigación constante que usted desarrollara y fortalecimiento de sus conocimientos, por tal motivo, ya puede iniciar en este sentido las practicas e indagaciones del resto de métodos de Java para graficas de dos dimensiones.

Ejemplo #2 /* * Creado el miercoles 18/Abril/2007 * */ /** @[email protected] **/ // Manejo de Figuras de JAVA2D.java de una forma simple.

Page 23: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

23

// Demostración de algunas figuras de Java2D. import java.awt.*; import java.awt.geom.*; import java.awt.image.*; import javax.swing.*; public class Grafica2D extends JFrame { // establecer cadena de barra de título y dimensiones de la ventana public Grafica2D() { super( "Dibujo de figuras en 2D" ); setSize( 900, 600 ); setVisible( true ); } // dibujar figuras con la API Java2D public void paint( Graphics g ) { int x=10, y=30; int ANCHO=50,ALTO=30; super.paint( g ); // llamar al método paint de la superclase Graphics2D g2d = ( Graphics2D ) g; // convertir g a Graphics2D /********************* Rectangulo Sin Relleno. ************************/

// Dibujar un Rectangulo de color Rojo y con un grosor de borde de //diez pixeles. g2d.setPaint(Color.RED); g2d.setFont( new Font( "Monospaced", Font.ITALIC, 15 ) ); g2d.setStroke(new BasicStroke(10.0f)); g2d.draw(new Rectangle2D.Double(x, y, ANCHO, ALTO)); g2d.drawString( " Dibujo de RECTANGULO 2D " , 70, 45 );

/********************* Rectangulo Con Relleno. ************************/

//Dibujar un Rectangulo de color Degradado y con un grosor de borde //de //diez pixeles. g2d.setPaint(new GradientPaint( x+400, y, Color.BLUE, x+435, y+70,Color.YELLOW, true ));

g2d.setFont( new Font( "Serif", Font.BOLD , 15 ) ); g2d.fill(new Rectangle2D.Double(x+400, y, ANCHO, ALTO)); g2d.drawString( " Dibujo de RECTANGULO 2D " , x+470, y+15 );

Page 24: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

24

//Dibujar un Rectangulo con borde redondeado (Sin Relleno) //de color Magenta y con un grosor de borde de cuatro pixeles. g2d.setPaint(Color.MAGENTA); g2d.setStroke(new BasicStroke(4.0f));

g2d.draw(new RoundRectangle2D.Double(x, y+70, ANCHO, ALTO, 20, 20)); g2d.drawString( " Dibujo de RECTANGULO REDONDEADO 2D " , 70, 115 );

//Dibujar un Rectángulo con borde redondeado (Con Relleno) de color //Degradado //y con un grosor de borde de cuatro pixeles.

g2d.setPaint(new GradientPaint( x+400, y+70, Color.RED, x+435, y+85,Color.ORANGE , true )); g2d.fill(new RoundRectangle2D.Double(x+400, y+70, ANCHO, ALTO, 20, 20)); g2d.drawString( " Dibujo de RECTANGULO REDONDEADO 2D " , x+470, 115 );

/********************* Ellipse sin Relleno. **********************/ // Dibujando una Elipse de Color Azul y con un grosor de cinco pixeles. g2d.setPaint(Color.BLUE); g2d.setStroke(new BasicStroke(5.0f)); g2d.draw(new Ellipse2D.Double(x, y+140, ANCHO, ALTO-10)); g2d.drawString( " Dibujo de ELIPSE 2D " , 70, 185 );

/********************* Ellipse con Relleno. **********************/

//Dibujando una Elipse de Color Degradado y con un grosor de cinco //pixeles. g2d.setPaint(new GradientPaint( x+400, y+140, Color.MAGENTA, x+400, y+175,Color.CYAN, true ));

g2d.fill(new Ellipse2D.Double(x+400, y+140, ANCHO, ALTO-10)); g2d.drawString( " Dibujo de ELIPSE 2D " , x+470, y+155 );

Page 25: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

25

/****************** Arcos sin Rellenos. *************************/ // Dibujando una Elipse de Color Verde y con un grosor de seis pixeles.

// Este Arco tiene la particularidad que es cerrado por tal motivo parecera //que le hace falta

// un Pedazo al Pastel completo. g2d.setPaint(Color.GREEN); g2d.setStroke(new BasicStroke(6.0f));

g2d.draw(new Arc2D.Double(x, y+210, ANCHO,ALTO+15, 45, 270, Arc2D.PIE )); g2d.setPaint(Color.DARK_GRAY); g2d.drawString( " Dibujo de ARCO 2D - PASTEL " , 70, 265 );

/****************** Arcos con Rellenos. *************************/ // Dibujando una Elipse de Color Verde y con un grosor de seis pixeles.

// Este Arco tiene la particularidad que es cerrado por tal motivo parecera //que le hace falta

// un Pedazo al Pastel completo. g2d.setPaint(new GradientPaint( x+400, y+210, Color.BLUE , x+400, y+250,Color.LIGHT_GRAY , true ));

g2d.setStroke(new BasicStroke(6.0f)); //g2d.fill(new Arc2D.Double(x+400, y+210, ANCHO,ALTO+15, 45, 270, Arc2D.PIE ));

//g2d.setPaint(Color.DARK_GRAY); g2d.drawString( " Dibujo de ARCO 2D - PASTEL " , x+470, 265 );

//Para los arreglos en JAVA2D int polx[]={150,130,100,130,150,170,200,170,150}; int poly[]={100,130,150,170,200,170,150,130,100}, i=0;

//En este caso solo estoy moviendo la coordenada en y porque me queda //arriba for(i=0;i<9;i++){ poly[i]=poly[i]+230; } //Se tiene que definir la direccion del dibujo GeneralPath pol = new GeneralPath(); //Aqui trabajamos con manejo de coordenada en referencia al origen //Consultarse al libro de programacion de la UNI, ahí esta la referencia pol.moveTo(polx[0], poly[0]); //Ahora pasar los puntos del poligono al objeto for (i=1;i<9;i++){

Page 26: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

26

pol.lineTo(polx[i], poly[i]); }//Fin del Recorrido For pol.closePath(); //Cerrando el Objeto de Dibujo //Relleno con Degradado

g2d.setPaint(new GradientPaint( 500, 100, Color.YELLOW , 530, 150,Color.LIGHT_GRAY , true ));

//Dibujar poligono g2d.fill(pol); //Sin relleno, solo el borde de color, generando el borde

g2d.setPaint(new GradientPaint( 500, 100, Color.BLUE , 530, 150,Color.GREEN , true ));

//Dibujar poligono g2d.draw(pol);

//Dibujo de Línea, solo debe establecerse con Draw g2d.setStroke(new BasicStroke(10.0f)); //Grosor de 10 pixeles g2d.draw(new Line2D.Double( 30, 520, 250, 520 ));

} // fin del método paint // ejecutar la aplicación public static void main( String args[] ) { Grafica2D aplicacion = new Grafica2D(); aplicacion.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE ); } } // fin de la clase Figuras

Page 27: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

27

Como se puede observar paso a poso usted puede definir lo que desea realizar como primitivo grafico, existe mejores posibilidad en Java2D para la manipulación de los primitivos gráficos.

Tareas a Realizar: 1.- Buscar el programa de Logo de la UNI, el cual ya esta diseñado en clases

anteriores, llevar este a Java2D y aplique lo siguiente: a.- Defina el área de dibujo. b.- Defina que tipo de atributos aplicara, si es con relleno o sin relleno. c.- Utilizar graficación en Java2D. d.- Mostrar los pasos que realizo para hacer posible la graficación, ahora moviendo los

puntos a doscientos coordenadas en X. 2.- Buscar el programa del ambiente de la UNI, es decir el quedo propuesto, tal como el

edificio nuevo, las canchas de baseball, football, etc. Realice los siguientes pasos para mostrar la grafica en Java2D:

a.- Defina el área de dibujo.

Page 28: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

28

b.- Defina que tipo de atributos aplicara, si es con relleno o sin relleno. c.- Utilizar graficación en Java2D. d.- Mostrar los pasos que realizo para hacer posible la graficación, ahora moviendo los

puntos a doscientos coordenadas en X.

Toda la Bibliografía utilizada aquí es: Titulo: Como Programar en Java. Autor Deitel & Deitel. Edición: Quinta Edición. ISBN: 970-26-0518-0

Información de los Capítulos JAVA2D. Capitulo XII y XIII.

Curso de Maestría de Redes de Computadoras: Msc. José Abelardo Sánchez (Conferencia #9)

Dibujo y manejo de Conceptos.

Programas Diseñados por Giovanni Sáenz.

Aplicación Diseñada

Page 29: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

29

PROBLEMA DE PROGRAMACION GRÁFICA PROPUESTOS # 1

1) Hacer un programa en Java, donde por medio de primitivos gráfico haga el logo de la UNI, así como la figura generada sea rellena de color azul (de ser posible se muestre como sombra – no es obligatorio esto, pero si se recomienda como puntos extras), para lograr este propósito, solo utilizar líneas, arreglos y rectángulos (técnicas mostradas en clase).

2) Hacer un programa en el cual se mire de frente la entrada principal de la UNI, para lograr este dibujo, la figura debe ser rellena (de ser posible se muestre como sombra – no es obligatorio esto, pero si se recomienda como puntos extras), para lograr este propósito, solo utilizar líneas, arreglos y rectángulos (técnicas mostradas en clase).

3) Los estudiantes de arquitectura desean implementar nuevas técnicas de rellenos por ladrillos, así como estilos de paredes para la construcción de muros perimetrales, para tal propósito se define los siguientes estilos:

a) Bloque rectangular clásico. b) Bloque greco romano rustico. c) Bloque imperial.

Para cada uno de los casos, muestre en pantalla las 3 versiones, la pared oscilara entre X = 100 y X = 400, así como Y = 100 y Y = 300.

Page 30: Guía de Trabajo ahora que esta abierto el Laboratorio Curso... · 2007. 7. 26. · Ahora con la parte de Abajo Es el mismo procedimiento y con los mismo conceptos, solo debes considerar

30

4) Se han puesto de moda los celulares cierta compañía desea mostrar los modelos

recién llegados. Entonces usted por medio de primitivos gráficos desarrollara esos modelos, la idea es que al verlos, los usuarios estén convencidos que esos productos los desean comprar y están dispuestos a pagar por ello.

5) Viendo el campo de baseball de la UNI, usted observa que el lado norte esta lleno de

montaña, así como se puede ver a los lejos el lago de Managua y un poco mas cerca la laguna de Tiscapa. Su misión es: Que por medio de primitivos gráficos usted muestre ese paisaje de ser posible visite esa área y tenga una visión clara del paisaje que se desarrolla.

6) La UNI este año tendrá nuevas instalaciones tanto para estudiantes, profesores y

laboratorios de la UNI central. Su objetivo es investigar como será ese edificio nuevo donde estarán las carreras de la UNI así como mostrarlo en su colorido real. Usted tendrá que implementar primitivos gráficos.

7) Dibujar las canchas, campos de base y football que existen en la UNI (Al fondo). Usted

tendrá que visitar el campo que esta contiguo al internado, así como el fondo de la Institución para poder tener una vista aérea de lo que tiene que mostrar.