グラフィックスと画像の操作
Graphics and Image Manipulationｓ
• java.awt パッケージ
• graphics クラスとオブジェクト
• カラー制御
• フォント制御
• 図形の描画メソッド
• 画像の操作
java.awt パッケージ
java.awt package
A portion of the java.awt class hierarchy
Object
+x
(0,0)
X axis
Color
Toolkit
Font
Component
FontMetrics
(x,y)
Polygon
Graphics
+y
Y axis
Java coordinate system
• もじや図形はｘ座標とｙ座標を指定することによって画面に表示されます。
• 座標の単位はピクセル（pixel）です。
• ピクセルとはディスプレイモニタの最も小さい表示単位（dot）のことです。
Graphics クラスとオブジェクト
Graphics class and objects
Graphics クラス
•抽象Graphicsクラス
import java.applet.Applet;
import java.awt.Graphics;
Graphics class
パッケージ
abstract Graphics class
•導出した具象Graphicsクラス
derived graphics class
import java.awt.Color;
Color class
パッケージ
import java.awt.Font;
•共通のインタフェースの提供
•paint()の引数として渡される
public class Test extends Applet {
Graphicsオブジェクト
private int red, green, blue;
public void init() {
•repaint()->update()->paint()
（Component メソッド）
// set some values
red = 100; blue = 255; green = 125;
}
抽象class
Graphics オブジェクト
Graphics オブジェクト
public void paint ( Graphics g ) {
Component
メソッド
paint()
g.setColor( new Color( red, green, blue ) );
g.setFont( new Font("Serif", Font.BOLD, 12) );
フォント操作
メソッド
g.drawString( "ABCDEFGHIJKLMN", 50, 33 );
Graphics
メソッド
showStatus( "Current RGB: " + g.getColor() );
}
}
カラー操作
メソッド
•画面への描画の制御
•文字や図形の描画
g.drawString()
文字の描画
メソッド
•フォント操作
g.setColor()
•カラー操作
g.setFont()
カラー制御
結果L31
Color control
import java.applet.Applet;
Color constants
RGB
Color class
パッケージ
import java.awt.Graphics;
import java.awt.Color;
public final static Color red
255,0,0
public final static Color green
0, 255,0
public final static Color blue
0,0,255
public final static Color black
0,0,0
public final static Color white
255,255,255
public class ShowColors extends Applet {
private int red_i, green_i, blue_i;
private float red_f, green_f, blue_f;
private Color c1;
public void init()
{
……
red_i = 100; blue_i = 255; green_i = 125;
int型実引数
c1 = new Color(red_i, green_i, blue_i);
red_f = 0.1f; blue_f = 0.21f; green_f = 0.33f;
}
Color constructors and methods
public Color(int r, int g, int b)
{
Color class
methods
g.drawString( " Study hard in Hosei University!", 50, 75);
Graphics class
methods
public abstract Color getColor()
public abstract void setColor(Color c)
set Color
g.setColor(new Color(red_f, green_f, blue_f));
public int getBlue()
public int getGreen()
g.setColor( c1 );
g.drawString( " Welcome to Hosei University!", 50, 50);
public Color(float r, float g, float b)
public int getRed()
float型実引数
public void paint ( Graphics g )
showStatus( "Current RGB: " + g.getColor() +
" RGB values of c1: " + c1.getRed() +c1.getGreen() +c1.getBlue());
}
}
get Color
values
get Color
object
フォント制御
Font control
import java.applet.Applet;
import java.awt.Graphics;
Font constants
結果L32
Font class
パッケージ
import java.awt.Font;
public class DemoFont extends Applet {
public final static int PLAIN
private Font font1, font2, f;
public final static int BOLD
int型実引数
String s;
public final static int ITALIC
public void init()
{ font1 = new Font( "Serif", Font.BOLD, 12 );
font2 = new Font( "Monospaced", Font.ITALIC, 24 );
Color constructor and methods
f = new Font( "SansSerif", Font.BOLD+Font.ITALIC, 14 );
}
public Font(String s, int style, int size)
public void paint( Graphics g )
public abstract void setFont(Font f)
{
g.setFont( font2 );
Graphics class
methods
g.drawString( "Monospaced 24 point italic.", 20, 40 );
public String getName()
public String getFamily()
public boolean isPlain()
g.setFont( f );
Font class
methods
if (f.isBold() == true) s = " is bold. ";
else s = " is not bold. ";
public boolean isBold ()
public boolean isItalic()
g.setFont( font1 );
g.drawString( "Serif 12 point bold.", 20, 20 );
public int getStyle()
public int getSize()
float型実引数
g.drawString("f " +s+ "Font family is " + f.getFamily() , 20,
60 );
}
se
図形の描画メソッド
drawing methods
Graphics methods
public abstract void drawLine(
int x1, int y1, int x2, y2)
public abstract void drawRect(
int x, int y, int width, int height)
結果L33
直線の描画
メソッド
矩形の描画
メソッド
import java.applet.Applet;
import java.awt.Graphics;
Import.java.awt.Color;
public class DemoShape extends Applet {
public void paint( Graphics g )
public abstract void fillRect(
{
int x, int y, int width, int height)
g.fillRect(150, 100, 100, 100);
int x, int y, int width, int height)
int x, int y, int width, int height)
g.drawOval(10, 210, 100, 70);
g.setColor(new Color(255, 0, 0));
楕円の描画
メソッド
g.fillOval(160, 210, 70, 100);
g.setColor(new Color(0, 255, 0));
public abstract void fillOval(
g.drawArc(10, 320, 120, 100, 0, 360);
int x, int y, int width, int height)
public abstract void drawArc(
int x, int y, int width, int height,
int startAngle, int arcAngle)
public abstract void fillArc(
int x, int y, int width, int height,
int startAngle, int arcAngle)
g.drawLine(10, 10, 230, 95);
g.drawRect(10, 100, 100, 100);
public abstract void clearRect(
public abstract void drawOval(
Graphics class
パッケージ
g.setColor(new Color(0, 0, 255));
円弧の描画
メソッド
g.fillArc(150, 320, 100, 120, 180, -90);
}
多角形の描画メソッドPolygon drawing methods
結果L3４
Polygons constructors and methods
public Polygon()
public Polygon(
import java.applet.Applet;
多角形の
コンストラクタ
import java.awt.Graphics;
import java.awt.Polygon;
Polygon class
パッケージ
import java.awt.Color;
int xValues[], int yValues[],
public class PolygonTest extends Applet {
int numberOfPoints)
private int xValues1[] = { 20, 40, 50, 30, 20, 15, 20 };
public abstract void drawPolygon(
private int yValues1[] = { 20, 20, 30, 50, 50, 30, 20 };
private int xValues2[] = { 40, 60, 70, 60, 40, 35, 40 };
int xPoint[], int yPoint[], int width, int points)
private int yValues2[] = { 20, 20, 30, 50, 50, 30, 20 };
public abstract void drawPolyline(
private Polygon p2;
int xPoint[], int yPoint[], int width, int points)
楕円の描画
public drawPolygon(Polygon p)
Graphics
public abstract void fillPolygon(
メソッド
public void paint( Graphics g )
{ p2 = new Polygon( xValues2, yValues2, 7 );
g.drawPolygon( xValues1, yValues1, 7 );
int xPoint[], int yPoint[], int width, int points)
g.fillPolygon(p2); //default color: black
g.copyArea(0, 0, 100, 100, 140, 10)；
public fillPolygon(Polygon p)
画面操作
g.setColor(new Color(0, 0, 255)); //blue
g.fillPolygon(xValues1, yValues1, 7);
public abstract void copyArea( int x, int y,
g.setXORMode(Color.red); //red
int width, int height, int dx, int dy)
public abstract void setXORMode(Color c)
g.fillPolygon(p2);
描画モード }
}
イメージの操作:ロード、表示、縮小/拡大
Image manipulations
結果L35
import java.applet.Applet;
import java.awt.*;
Image オブジェクトへ
の参照japanの宣言
public class LoadImageAndScale extends Applet {
private Image japan;
Image オブジェクトへの
参照japanの初期化
// load the image when the applet begins executing
アプレットメソット
getDocumentBase()
インターネット上における画
像の保存場所を決める
public void init()
{
アプレットメソッド
getImage()
指定した画像
をロードする
japan = getImage( getDocumentBase(), " Japan.gif" );
}
public void paint( Graphics g ) // display the image
{
Graphicsメソッド
drawImage()
指定画像を表示
する
Japan.gif は画像
ファイルの名前です
this は
アプレット自身 Image メソッド
g.drawImage( japan, 1, 1, this );
// draw the image with its width and height doubled
getWidth()
getHeight()
int width = japan.getWidth( this );
// draw the original image
int height = japan.getHeight( this );
for (i=1; i < 4; i++ )
g.drawImage(japan, 1, 100*i, width*(i+1), height, this );
}
}
yの座標値
this は
ImageObserver
オブジェクト
幅は(i+1)倍になる
課題
// packages
•
•
•
•
.
public class lampApplet extends Applet{
1 日本の国旗を描画し、”Japan”と
public void init(){
いう単語をカラー（red,blue）、サイズ
（14,24）、スタイル（bold,italic）で示
せ。 ex1
2.与えられた画像を読み込み、アプ
レットに表示し、その後その横幅と
高さを２倍にせよ。そして日本国旗
をその画像のトップに描画せよ。
image ex2
3.ランプの絵を描け。
Lamp ランブのデータ
4. (option) Drawing meanders with
strings. meanders
resize(300,300);
}
public void paint(Graphics g){
//the platform
//(10,250)のポイントから幅280、高さ40の長方形を塗りつぶす
//the base of the lamp
//（125,250）から（125,160）へ線を引く
//（175,250）から（175,160）へ線を引く
//the lamp shade;two arcs
//中心（85,157）、横幅130、縦幅50、
//startAngle=
65,arcAngle=312の円弧を塗りつぶす
//中心（85,87）、横幅130、縦幅50、
//startAngle=62,arcAngle=58の円弧を塗りつぶす
//（85,177）から（119,89）へ線を引く
//（215,177）から（181,89）へ線を引く
//pattern on the shade
//中心（78,120）、直径40、
//startAngle=63,arcAngle=-174の円弧を塗りつぶす
//中心（173,100）、直径40、startAngle=110,arcAngle=180の円弧を塗りつぶす
//中心（120,96）直径40の円を塗りつぶす
}
}
課題
// packages
•
•
•
•
1. Draw a Japanese national
flag and word “Japan” in
various font colors (red, blue),
sizes(14, 24) and styles (bold,
italic).
2. Load and display a given
image into an applet and scale
it to 2 times in width and height.
Draw the Japanese national
flag on the top of the image.
image ex2
3. Draw a lamp. Lamp
4. (option) Drawing meanders
with strings.meanders
public class lampApplet extends Applet{
public void init(){
resize(300,300);
}
public void paint(Graphics g){
//the platform
//(10,250)のポイントから幅280、高さ40の長方形を塗りつぶす
//the base of the lamp
//（125,250）から（125,160）へ線を引く
//（175,250）から（175,160）へ線を引く
//the lamp shade;two arcs
//中心（85,157）、横幅130、縦幅50、
//startAngle=
65,arcAngle=312の円弧を塗りつぶす
//中心（85,87）、横幅130、縦幅50、
//startAngle=62,arcAngle=58の円弧を塗りつぶす
//（85,177）から（119,89）へ線を引く
//（215,177）から（181,89）へ線を引く
//pattern on the shade
//中心（78,120）、直径40、
//startAngle=63,arcAngle=-174の円弧を塗りつぶす
//中心（173,100）、直径40、startAngle=110,arcAngle=180の円弧を塗りつぶす
//中心（120,96）直径40の円を塗りつぶす
}
}
Practice Exercise: Turtle Graphics
Drawing meanders with strings
• A meander is a pattern like that in Figure (a), often made up of a
continuous line meandering along some path.
• We can use a shorthand notation to describe a figure. Suppose that
F means forward(d, 1); (for some distance),
+ means turn(A); (a left turn for the angle )
- means turn(-A); (a right turn for the angle)
• The following sequence of commands F-F-F-F+F+F+F+F- can
produce the motif for the meanders of Figure (a) which is shown in
Figure (b).
Practice Exercise:
Developing the
TURTLE CLASS
• There are many wais to define the Turtle class; the
code presented here should be considered only as
a starting point for your own versions.
• First of all, develop some useful supporting
classes
• For instance, Class IntPoint2: a point having
integer coordinates.
• The code is as following:
Practice Exercise:
Developing the
TURTLE CLASS
public class IntPoint2
{
public int x,y;
public void IntPoint2() {x = y = 0;}
public IntPoint2 set_xy(int xx, int yy)
{ this.x = xx; this.y = yy; return this;}
public int getX() {return x;}
public int getY() {return y;}
}
Practice Exercise:
Developing the
TURTLE CLASS
Class Turtle: a “turtle” is conceptually similar to the pen in a
pen plotter, migrates over the page, leaving a trail behind
itself that appears as a line segment.
• The turtle is positioned at CurPos , headed in a certain
direction called the current direction, CurDir
• CurDir is the number of degrees measured
counterclockwise from the positive x-axis.
• The Turtle class will control the turtle by adding
functionality and provides power in drawing complex
figures. The code is as following:
Practice Exercise:
Developing the
TURTLE CLASS
/*----------------------------------------------------------------------moveTo. Move to the point
lineTo. Draw the line and update the CurPos
turnTo. The method turns the turtle to the given angle
turn. The method turns the turtle through angle degrees
counterclockwise
forward. The method moves the turtle forward in a straight
line from the CurPos through a distance dist in the current
direction CurDir and updates the CurDir. If isVisible is
nonzero, a visible line is drawn; otherwise nothing is
drawn
*/------------------------------------------------------------------------
Practice Exercise:
Developing the
TURTLE CLASS
import java.awt.*;
import java.math.*;
public class TurtleGr extends java.applet.Applet {
final float RadPerDeg = (float)0.01745333393; //radians per degree
IntPoint2 CurPos = new IntPoint2();
private float CurDir; //current direction
public void init() {
resize(300,300);
}
Practice Exercise:
Developing the
TURTLE CLASS
public void lineTo(Graphics g, int x, int y) {
g.drawLine(CurPos.x,CurPos.y, x,y);
CurPos.set_xy(x,y);
}
public void moveTo(int x, int y) {
CurPos.set_xy(x,y);
}
public void turnTo(float angle) {
CurDir=angle;
}
public void turn(float angle) {
CurDir+= angle;
}
Practice Exercise:
Developing the
TURTLE CLASS
public void forward( Graphics g, float dist, int isVisible) {
int x;
int y;
x = CurPos.x + (int)(dist*(float)Math.cos(RadPerDeg*CurDir));
y = CurPos.y + (int)(dist*(float)Math.sin(RadPerDeg*CurDir));
if (isVisible == 1)
lineTo(g, x,y);
else
moveTo(x,y);
}
Practice Exercise:
Developing the
TURTLE CLASS
public void paint(Graphics g) {
int step;
float A = 90;
float dist[] = {30,20,10,10,10,20,30,30};
String st;
st = new String("F-F-F-F+F+F+F+F-");
!! Develop a peace of Java code that make a turtle draw the outline of a
motif according to a sequence of commands !!
…
…
}
}
}
}
© Copyright 2024 ExpyDoc
