viernes, 7 de abril de 2017

Osito | Los métodos drawOval y fillOval

Como mencioné anteriormente, la clase Graphics tiene distintos métodos para dibujar figuras, vamos a iniciar con el método fillOval(x,y,anc,alt) y drawOval(x,y,anc,alt) que nos permiten dibujar óvalos, para entender como funcionan vamos a hacer la siguiente imagen:

Para que sea mas sencilla la ubicación de coordenadas utilizaremos la herramienta paint, para hacer nuestro dibujo, la forma más simple de hacerlo es ir poniendo figura por figura y copiar sus coordenadas de la siguiente manera:
Para dibujarlo en un Applet usamos el siguiente código:
import java.applet.Applet;
import java.awt.*;
public class Osito extends Applet
{
public void init()
{
setSize(500,500);
setBackground(Color.lightGray);
setForeground(Color.white);
}
public void paint(Graphics g)
{
g.fillOval(80,154,305,305);
}
}
Que nos muestra lo siguiente:


Continuamos realizando nuestro dibujo con dos óvalos más para las orejas:
import java.applet.Applet;
import java.awt.*;
public class Osito extends Applet
{
public void init()
{
setSize(500,500);
setBackground(Color.lightGray);
setForeground(Color.white);
}
public void paint(Graphics g)
{
g.fillOval(80,154,305,305);//Cabeza
g.fillOval(25,115,139,139);//Oreja Izquierda
g.fillOval(300,115,139,139);//Oreja Derecha
}
}


Vamos a agregar los ojos, para esto necesitamos cambiar el color para que puedan distinguirse de lo demás, haremos uso del método setColor(obj Color), el cual nos permite cambiar el color de una sección (todo lo que pongamos abajo de esta invocación tendrá el color elegido):
import java.applet.Applet;
import java.awt.*;
public class Osito extends Applet
{
public void init()
{
setSize(500,500);
setBackground(Color.lightGray);
setForeground(Color.white);
}
public void paint(Graphics g)
{
g.fillOval(80,154,305,305);//Cabeza
g.fillOval(25,115,139,139);//Oreja Izquierda
g.fillOval(300,115,139,139);//Oreja Derecha
g.setColor(Color.black);
g.fillOval(136,292,33,33);//Ojo Izquierdo
g.fillOval(290,292,33,33);//Ojo Derecho
}
}


Para hacer la figura de la boca haremos uso del método drawOval(x,y,anc,alt), este método dibuja solo el contorno del óvalo:
import java.applet.Applet;
import java.awt.*;
public class Osito extends Applet
{
public void init()
{
setSize(500,500);
setBackground(Color.lightGray);
setForeground(Color.white);
}
public void paint(Graphics g)
{
g.fillOval(80,154,305,305);//Cabeza
g.fillOval(25,115,139,139);//Oreja Izquierda
g.fillOval(300,115,139,139);//Oreja Derecha
g.setColor(Color.black);
g.fillOval(136,292,33,33);//Ojo Izquierdo
g.fillOval(290,292,33,33);//Ojo Derecho
g.drawOval(187,326,98,100);//Boca
}
}

Dibujamos la nariz, podemos volver a cambiar el color sin afectar al color previo:
import java.applet.Applet;
import java.awt.*;
public class Osito extends Applet
{
public void init()
{
setSize(500,500);
setBackground(Color.lightGray);
setForeground(Color.white);
}
public void paint(Graphics g)
{
g.fillOval(80,154,305,305);//Cabeza
g.fillOval(25,115,139,139);//Oreja Izquierda
g.fillOval(300,115,139,139);//Oreja Derecha
g.setColor(Color.black);
g.fillOval(136,292,33,33);//Ojo Izquierdo
g.fillOval(290,292,33,33);//Ojo Derecho
g.drawOval(187,326,98,100);//Boca
g.fillOval(230,361,4,51);//Nariz-Boca
g.setColor(Color.pink);
g.fillOval(220,351,26,13);//Nariz
}
}

Por último ponemos el interior de las orejas:
import java.applet.Applet;
import java.awt.*;
public class Osito extends Applet
{
public void init()
{
setSize(500,500);
setBackground(Color.lightGray);
setForeground(Color.white);
}
public void paint(Graphics g)
{
g.fillOval(80,154,305,305);//Cabeza
g.fillOval(25,115,139,139);//Oreja Izquierda
g.fillOval(300,115,139,139);//Oreja Derecha
g.setColor(Color.black);
g.fillOval(136,292,33,33);//Ojo Izquierdo
g.fillOval(290,292,33,33);//Ojo Derecho
g.drawOval(187,326,98,100);//Boca
g.fillOval(230,361,4,51);//Nariz-Boca
g.setColor(Color.pink);
g.fillOval(220,351,26,13);//Nariz
g.fillOval(49,145,85,85);//Oreja Izquierda Interna
g.fillOval(324,145,85,85);//Oreja Derecha Interna
}
}
Al final la imagen que comenzamos a crear en paint quedó algo así (solo creé las partes izquierdas y calculé la coordenada de x para la parte derecha):

No hay comentarios.:

Publicar un comentario

Osito | Los métodos drawOval y fillOval

Como mencioné anteriormente, la clase Graphics tiene distintos métodos para dibujar figuras, vamos a iniciar con el método fillOval(x,y,anc,...