3. 27/12/53
การใชงาน Applet กับ HTML การใชงาน Applet กับ HTML
ตัวอยาง PARAM Tag
<html> โดยปกติแลว Applet สามารถสามารถมีพารามิเตอรที่สงมาจาก
<body> เพจ HTML ได โดยใชแท็ก <PARAM> ซึ่งตองใชอยูในแท็ก
<APPLET> และ </APPLET> เทานัน มีแอตทริบิวตที่ตองใชงาน
<applet code=“MyJApplet.class” height=“200” width=“300”>
</applet>
้
</body> ดังนี้
</html>
NAME ใชสําหรับกําหนดชือของพารามิเตอร
่
<html> VALUE ใชสําหรับกําหนดคาของแตละพารามิเตอร
<body>
y
<applet code=“MyJApplet.class” codebase=“classes” การเรียกใชพารามิเตอร
height=“200” width=“300”>
</applet>
เมื่อกําหนดคคาพารามิเตอรแลว เมื่อตองการใชคาก็เรียกผานเมธ
</body> อด getParameter() โดยกําหนดชือใหตรงกับที่กําหนดในแท็ก
่
</html> <PARAM>
8-9 8-10
การใชงาน Applet กับ HTML การใชงาน Applet กับ HTML
ตัวอยาง ตัวอยาง
<html> import java.awt.*;
<body> import javax.swing.*;
<applet code=“ParameterJApplet.class” height=“200”
width=“400”> public class ParameterJApplet extends JApplet {
<param name=“mesg” value=“Hello, I’m your first
parameter”>
public void paint(Graphics g) {
<param name=“font” value=“Times New Roman”> String message = getParameter(“mesg”);
<param name=“size” value=“30”> String fontname = getParameter(“font”);
</applet> int fontSize = Integer.parseInt(
</body> getParameter(“size”));
</html> Font textFont = new Font(fontName, Font.BOLD,
fontSzie);
g.setFont(textFont);
g.drawDtring(message, 10, 30);
}
8-11 } 8-12
3
4. 27/12/53
การใชงาน Applet กับ HTML การใชงานกราฟก (Graphics)
ผลลัพธ จาวาไดเตรียมคลาส Graphics ไวในใชงานทางดานกราฟก
ซึ่งอยุในชุดของ java.awt โดยมีเมธอดหลักที่ใชในการแสดง
รูปทรงและการระบายสีดังนีี้
ี
drawString
drawLine
drawRect,fillRect,clearRect,
drawRoundRct,fillRoundRect
drawOval, fillOval
drawArc, fillArc
8-13 8-14
คําสั่ง drawString คําสั่ง drawLine
เปนเมธอดที่ใชแสดงขอความกราฟกบนหนาจอ มีรปแบบดังนี้
ู เปนเมธอดที่ใชวาดเสนตรงบนหนาจอ มีรูปแบบคําสั่งดังนี้
public void drawString (String msg, int x, int y) public void drawLine (int x1, int y1, int x2, int y2)
msg ขอความทีตองการแสดง
่ x1 คาตําแหนงของแกน x ของจุดตน
x คาตําแหนงของแกน x เปนพิกเซลบนหนาจอ y1 คาตําแหนงของแกน y ของจุดตน
y คาตําแหนงของแกน y เปนพิกเซลบนหนาจอ
แ นง งแ น เ เ ล น น x
x2 คาตําแหนงของแกน x ของจดปลาย
แ นง งแ น ง ุ ล
ตัวอยาง y2 คาตําแหนงของแกน y ของจุดปลาย
g.drawString(“Hello,World”, 30, 20); ตัวอยาง
g.drawLine(25, 30, 200, 120);
8-15 8-16
4
5. 27/12/53
คําสั่ง drawRect คําสั่ง fillRect
เปนเมธอดที่ใชวาดรูปสี่เหลี่ยมที่ไมมีการระบายสี มีรูปแบบคําสั่ง เปนเมธอดที่ใชวาดรูปสี่เหลี่ยมที่มีการระบายสีดวยสี foreground
ดังนี้ มีรูปแบบคําสั่งดังนี้
public void drawRect (int x, int y, int width, int height) public void fillRect (int x, int y, int width, int height)
x คาตําแหนงของแกน x ของจุดมุมซายบนของรูป x คาตําแหนงของแกน x ของจุดมุมซายบนของรูป
y คาตําแหนงของแกน y ของจุดมุมซายบนของรูป y คาตําแหนงของแกน y ของจุดมุมซายบนของรูป
width คาความกวางของรปสี่เหลี่ยม
คาความกวางของรูปสเหลยม width คาความกวางของรปสี่เหลี่ยม
คาความกวางของรูปสเหลยม
height คาความสูงของรูปสี่เหลี่ยม height คาความสูงของรูปสี่เหลี่ยม
ตัวอยาง ตัวอยาง
g.drawRect( 35, 30, 120, 100); g.fillRect( 35, 30, 120, 100);
8-17 8-18
คําสั่ง clearRect คําสั่ง drawRoundRect
เปนเมธอดที่ใชวาดรูปสี่เหลี่ยมที่มีการระบายสีดวยสี background
เปนเมธอดที่ใชวาดรูปสี่เหลี่ยมที่มีมุมเปนมน ทีไมมการระบายสี มี
่ ี
มีรูปแบบคําสั่งดังนี้ รูปแบบคําสั่งดังนี้
public void clearRect(int x, int y, int width, int height) public void drawRoundRect(int x, int y, int width,
int height,int arcWidth, int arcHeight)
x คาตําแหนงของแกน x ของจุดมุมซายบนของรูป
x คาตําแหนงของแกน x ของจุดมุมซายบนของรูป
y คาตําแหนงของแกน y ของจุดมุมซายบนของรูป
y คาตําแหนงของแกน y ของจุดมุมซายบนของรูป
width คาความกวางของรปสี่เหลี่ยม
คาความกวางของรูปสเหลยม
width คาความกวางของรูปสี่เหลี่ยม
height คาความสูงของรูปสี่เหลี่ยม
ตัวอยาง height คาความสูงของรูปสี่เหลี่ยม
g.clearRect( 35, 30, 120, 100); arcWidth คาความกวางของสวนโคงมนรูปสีเหลี่ยม
่
arcHeight คาความสูงของสวนโคงมนรูปสี่เหลี่ยม
8-19 8-20
5
6. 27/12/53
คําสั่ง drawRoundRect คําสั่ง fillRoundRect
( x, y)
เปนเมธอดที่ใชวาดรูปสี่เหลี่ยมที่มีมุมเปนมน ทีมีการระบายสีดวยสี
่
arc height foregroundมีรูปแบบคําสั่งดังนี้
a rc width height public void fillRoundRect(int x, int y, int width,
int height,int arcWidth, int arcHeight)
x คาตําแหนงของแกน x ของจุดมุมซายบนของรูป
y คาตําแหนงของแกน y ของจุดมุมซายบนของรูป
width คาความกวางของรูปสี่เหลี่ยม
w idth
height คาความสูงของรูปสี่เหลี่ยม
arcWidth คาความกวางของสวนโคงมนรูปสี่เหลี่ยม
ตัวอยาง arcHeight คาความสูงของสวนโคงมนรูปสี่เหลี่ยม
g.drawRoundRect( 35, 30, 120, 100,20,20); ตัวอยาง
g.fillRoundRect( 35, 30, 120, 100,20,20);
8-21 8-22
คําสั่ง draw3DRect คําสั่ง fill3DRect
เปนเมธอดที่ใชวาดรูปสี่เหลี่ยมที่มีมุมเปนมน ทีไมมการระบายสี
่ ี เปนเมธอดที่ใชวาดรูปสี่เหลี่ยมที่มีมุมเปนมน ทีมีการระบายสีดวยสี
่
ดวยสี foreground มีรูปแบบคําสั่งดังนี้ foregroundมีรูปแบบคําสั่งดังนี้
public void draw3dRect(int x, int y, int width, public void fill3dRect(int x, int y, int width,
int height, booleab b) int height, booleab b)
x คาตําแหนงของแกน x ของจุดมุมซายบนของรูป x คาตําแหนงของแกน x ของจุดมุมซายบนของรูป
y คาตําแหนงของแกน y ของจุดมุมซายบนของรูป y คาตําแหนงของแกน y ของจุดมุมซายบนของรูป
width คาความกวางของรปสี่เหลี่ยม
idth คาความกวางของรูปสเหลยม width คาความกวางของรปสี่เหลี่ยม
idth คาความกวางของรูปสเหลยม
height คาความสูงของรูปสี่เหลี่ยม height คาความสูงของรูปสี่เหลี่ยม
b คาที่แสดงลักษณะ 3 มิติ b คาที่แสดงลักษณะ 3 มิติ
ตัวอยาง ตัวอยาง
g.draw3dRect( 35, 30, 120, 100,true); 8-23 g.fill3dRect( 35, 30, 120, 100,true); 8-24
6
7. 27/12/53
คําสั่ง drawOval คําสั่ง drawOval
เปนเมธอดที่ใชวาดรูปวงกลม หรือวงรี ที่ไมมการระบายสี มี
ี ( x , y)
รูปแบบคําสั่งดังนี้
public void drawOval(int x, int y, int width, int height)
height
x คาตําแหนงของแกน x ของจุดมุมซายบนของรูป
y คาตําแหนงของแกน y ของจุดมุมซายบนของรูป
width คาความกวางของรูปสี่เหลี่ยม
w id th
height คาความสูงของรูปสเหลยม
h i ht คาความสงของรปสี่เหลี่ยม
ตัวอยาง
g.drawOval( 35, 30, 120, 100);
8-25 8-26
คําสั่ง fillOval คําสั่ง drawArc
เปนเมธอดที่ใชวาดรูปวงกลม หรือวงรี ที่มการระบายสีดวยสี
ี เปนเมธอดที่ใชวาดสวนโคงของวงกลม ที่ไมมีการระบายสี มี
foreground มีรูปแบบคําสั่งดังนี้ รูปแบบคําสั่งดังนี้
public void fillOval(int x, int y, int width, int height) public void drawArc(int x, int y, int width, int height,
x คาตําแหนงของแกน x ของจุดมุมซายบนของรูป int startAngle, int arcAngle)
y คาตําแหนงของแกน y ของจุดมุมซายบนของรูป x คาตําแหนงของแกน x ของจุดมุมซายบนของรูป
width คาความกวางของรูปสี่เหลี่ยม y คาตําแหนงของแกน y ของจุดมุมซายบนของรูป
height คาความสูงของรูปสเหลยม
h i ht คาความสงของรปสี่เหลี่ยม width คาความกวางของรปสี่เหลี่ยม
idth คาความกวางของรูปสเหลยม
height คาความสูงของรูปสี่เหลี่ยม
ตัวอยาง startAngle คามุมเริ่มตน
g.fillOval( 35, 30, 120, 100); arcAngle คามุมของสวนโคง
8-27 8-28
7
9. 27/12/53
g.setColor( Color.YELLOW );
g.draw3DRect( 5, 100, 90, 55, true );
g.setColor( Color.BLACK );
g.drawString("draw3DRect", 15, 115);
g.setColor( Color.YELLOW );
g.fill3DRect( 100, 100, 90, 55, false );
g.drawString("fill3DRect", 115, 115);
g.setColor( Color.MAGENTA );
g.drawOval( 295, 100, 90, 55 );
g.setColor( Color.BLACK );
g.drawString("drawOval", 305, 120);
g.setColor( Color.MAGENTA );
g.fillOval( 390, 100, 90, 55 );
g.setColor( Color.WHITE );
g.drawString("fillOval", 405, 120);
g.setColor( Color.MAGENTA );
g.drawOval( 495, 100, 55, 55 );
g.setColor( Color.BLACK );
g.drawString("drawOval", 505, 120);
} // end method paint
} // end class LineRectOval 8-33 8-34
// start at 0 and sweep 110 degrees
g.setColor( Color.YELLOW );
ตัวอยาง g.drawRect( 100, 35, 80, 80 );
g.setColor( Color.BLACK );
import java.awt.*; g.drawArc( 100, 35, 80, 80, 0, 110 );
import javax.swing.*;
// start at 0 and sweep -270 degrees
public class DrawArcs extends JApplet { g.setColor( Color.YELLOW );
public void init() g.drawRect( 185, 35, 80, 80 );
{ g.setColor( Color.BLACK );
setSize( 350, 180 ); // จะมีผลกับ Appletviewer เทานัน
้ g.drawArc( 185, 35, 80, 80, 0, -270 );
}
// start at 0 and sweep 360 degrees
// draw rectangles and arcs g.setColor( Color.YELLOW );
public void paint( Graphics g ) g.fillArc( 15, 120, 80, 40, 0, 360 );
{
super.paint(
super paint( g ); // call superclass's paint method // sta t at 270 and s eep -90 degrees
start 0 a d sweep 90 deg ees
g.setColor( Color.CYAN);
// start at 0 and sweep 360 degrees g.fillArc( 100, 120, 80, 40, 270, -90 );
g.setColor( Color.YELLOW );
g.drawRect( 15, 35, 80, 80 ); // start at 0 and sweep -270 degrees
g.setColor( Color.BLACK ); g.setColor( Color.ORANGE );
g.drawArc( 15, 35, 80, 80, 0, 360 ); g.fillArc( 185, 120, 80, 40, 0, -270 );
} // end method paint
8-35 } // end class DrawArcs 8-36
9
10. 27/12/53
ตัวอยางการใชงาน Applet กับ GUI
import java.awt.*;
import java.applet.Applet;
import java.awt.event.*;
import javax swing *;
javax.swing.*;
public class StringJApplet extends JApplet implements
ActionListener
{
private Button okBtn;
private JLabel strLabel, xLabel, yLabel;
private JTextField strField, xField, yField;
String mesg;
St i
int x, y;
public void init() {
Container c = getContentPane();
c.setLayout( new FlowLayout());
8-37 8-38
strLabel = new JLabel("Enter String : "); public void actionPerformed(ActionEvent event) {
c.add(strLabel); mesg = strField.getText();
strField = new JTextField(20); x = Integer.parseInt(xField.getText() );
c.add(strField); y = Integer.parseInt(yField.getText() );
xLabel = new JLabel("Coordinate X : ");
c.add(xLabel); repaint();
xField = new JTextField(5);
( ); }
c.add(xField);
yLabel = new JLabel("Coordinate Y : "); public void paint(Graphics g) {
c.add(yLabel); super.paint(g);
yField = new JTextField(5); g.drawRect(5,2, 330,80);
c.add(yField); g.setColor(Color.BLACK);
g.drawString(mesg, x, y+90);
okBtn = new Button(" OK "); }
okBtn.addActionListener(this);
okBtn addActionListener(this)
c.add(okBtn); }
setSize(340,300);
setForeground(Color.BLUE);
}
8-39 8-40
10
11. 27/12/53
shrink = new Button("Shrink");
ตัวอยางการใชงาน Applet กับ GUI shrink.addActionListener(this);
c.add(shrink);
import java.awt.*; left = new Button("Left");
import java.applet.Applet; left.addActionListener(this);
import java.awt.event.*; c.add(left);
import javax swing *;
javax.swing.*; right = new Button("Right");
g ( g );
right.addActionListener(this);
public class PlayBalloon extends JApplet implements c.add(right);
ActionListener { up = new Button("Up");
private Button grow, shrink, left, right, up, down; up.addActionListener(this);
private Balloon myBalloon; c.add(up);
down = new Button("Down");
public void init() { down.addActionListener(this);
Container c = getContentPane();
C t i tC t tP () c.add(down);
c add(do n)
c.setLayout( new FlowLayout()); myBalloon = new Balloon();
setSize(400,400);
grow = new Button("Grow"); setForeground(Color.BLUE);
grow.addActionListener(this); }
c.add(grow);
8-41 8-42
public void actionPerformed(ctionEvent event) { class Balloon {
if (event.getSource() == grow) private int diameter = 10;
myBalloon.grow(); private int x = 20, y = 50;
else if (event.getSource() == shrink)
myBalloon.shrink(); public void display(Graphics g) {
else if (event.getSource() == left) g.drawOval(x, y, diameter, diameter);
myBalloon.left();
y (); }
else if (event.getSource() == right)
public void left() {
myBalloon.right();
x = x - 10;
else if (event.getSource() == up)
}
myBalloon.up();
else if (event.getSource() == down) public void right() {
myBalloon.down(); x = x + 10;
repaint(); }
}
public void up() {
public void paint(Graphics g) { y = y - 10;
super.paint(g); }
myBalloon.display(g); public void down() {
} y = y + 10;
8-43
} 8-44
}
11
