PRAKTIKUM 12

ANIMASI GRAFIK

12.1. Animasi
Animasi adalah teknik menggerakan serangkaian "objek". Efek bergerak dari "objek"
diperoleh dengan menggantikan sejumlah gambar "objek" secara cepat sehingga mata
viewer tidak sempat melihat pergantian tersebut.
Animasi komputer adalah animasi yang menggunakan komputer sebagai alat bantu
dalam merancang / menghasilkan animasi.
Ada dua jenis animasi 2 dimensi yang dapat dilakukan dengan menggunakan
komputer :
1. Sprite
2. In Between (Tweening)

12.1.1. Animasi Sprite

Animasi sprite tidak berbeda dengan yang dilakukan oleh animator manual. Setiap
perubahan gerakan disimpan sebagai file gambar terpisah dan kemudian file-file
tersebut ditampilkan secara cepat.
Agar animasi sprite menghasilkan gerakan yang halus maka diperlukan cukup
banyak file gambar.

Img = array berisi file gambar

dari index = 1 sampai n
lakukan
gambar = Img [index]
tampilkan gambar
tunggu beberapa detik
hapus gambar

Gambar 12.1. Algorithma dasar animasi sprite :

Gambar 12.2. gambar yang membentuk animasi gerakan orang berjalan

12.1.2. In Between (Tweening)
Animasi In Betweening adalah animasi yang menghitung perubahan lokasi pokok
dari titik-titik di "objek".

• Perubahan dihitung berdasarkan rumus :

P(t) = (1 - t)*A + t*B

dengan A menunjukkan posisi Awal dan B menunjukkan posisi Akhir dan t bergerak
dari 0 menuju 1.

Frame antara (in-betweening) dapat dihitung dengan model :

- Interpolasi linear : menghasilkan gerakan yang patah / tidak kontinyu

- Interpolasi spline : menghasilkan gerakan yang lebih baik dari interpolasi linear

- Interpolasi cubic-spline : menghasilkan gerakan yang kontinyu

Frame antara

Gambar 12.3. Penentuan titik-titik posisi frame antara pergerakan lampu meja

12.2. Implementasi algorithma animasi grafik sprite .

Langkah Praktikum :
1) Aktifkan program Java Netbeans.
2) Pilih Project GrafikaKomputer dan klik kanan pada subfolder source package
GrafikaKomputer dan Pilih New dan Java Main Class baru seperti gambar 12.4.
berikut:
 Gambar 12.4. Menambahkan Java main Class baru pada project

3) Ketik nama Class Aplikasi dengan Praktikum12, lalu klik Finish seperti gambar
12.5. berikut:

Gambar 12.5. Membuah Klas JFrame Form Baru pada project

4) Tambahkan kode berikut untuk Menggambar Animasi sprite , pada Frame dengan
ukuran 600 X 600 Piksel, sehingga code secara keseluluhan sebagai berikut:
package grafikkomputer;

import java.awt.*;
import java.awt.event.*;
public class Praktikum12 extends Frame implements Runnable {

Thread animation;
int frameDelay = 100;
Image frames[];
int numFrames;
int currentFrame = 0;
long lastDisplay = 0;
int screenWidth = 600;
int screenHeight = 600;

public static void main(String[] args) {

Praktikum12 app = new Praktikum12 ();
}

public Praktikum12 () {
super("Animasi Grafik");
setup();
setSize(screenWidth,screenHeight);
addWindowListener(new WindowEventHandler());
show();
animation = new Thread(this);
animation.start();
}
void setup() {
setupMenuBar();
setFont(new Font("default",Font.BOLD,18));
Toolkit toolkit = getToolkit();
frames = new Image[8];
// objek yang akan ditampilkan
frames[0] = toolkit.getImage("stickman1.gif");
frames[1] = toolkit.getImage("stickman2.gif");
frames[2] = toolkit.getImage("stickman3.gif");
frames[3] = toolkit.getImage("stickman4.gif");
frames[4] = toolkit.getImage("stickman5.gif");
frames[5] = toolkit.getImage("stickman6.gif");
frames[6] = toolkit.getImage("stickman7.gif");
frames[7] = toolkit.getImage("stickman8.gif");

numFrames = frames.length;
}

void setupMenuBar() {
MenuBar menuBar = new MenuBar();
Menu fileMenu = new Menu("File");
MenuItem fileExit = new MenuItem("Exit");
fileExit.addActionListener(new MenuItemHandler());
fileMenu.add(fileExit);
menuBar.add(fileMenu);
setMenuBar(menuBar);
}

public void paint(Graphics g) {

g.drawImage(frames[currentFrame],125,80,this);
}

public void run() {

// Perulangan animasi
do {
 long time = System.currentTimeMillis();
if (time - lastDisplay > frameDelay) {
repaint();
try {
Thread.sleep(frameDelay);
}catch(InterruptedException ex){
}
++currentFrame;
currentFrame %= numFrames;
lastDisplay = time;
}
} while (true);
}
class MenuItemHandler implements ActionListener, ItemListener {
public void actionPerformed(ActionEvent ev){
String s=ev.getActionCommand();
if(s=="Exit"){
System.exit(0);
}
}
public void itemStateChanged(ItemEvent e){
}
}
//Kelas yang digunakan agar tombol close pada frame bisa
berfungsi
class WindowEventHandler extends WindowAdapter {
public void windowClosing(WindowEvent e){
System.exit(0);
}
}
}

5) Jalankan Program sehingga hasilnya akan tampak seperti gambar 12.6. berikut:

Gambar 12.6. Hasil Animasi Sprite

TUGAS:
Lakukan modifikasi program aplikasi animasi sprite dengan mengganti file
gambar minimal jumlah frame atau file gambarnya adalah 10.

==== Selamat Praktikum ===