heriady blog: Animasi dengan Vektor Translasi

Selamat Pagi rekan-rekan sekalian...Bangun Tidur nge-blog lagi...ngeblog lagi tidur lagi...bangguuunnn...nge-blog lagi...inget sama almarhum Mbah Surip sang seniman nyentrik yang selalu happy...I Love You Full.

(download source code ada disini)

Pagi rekan-rekan (mulai serius nih), di pagi ini aku akan membagikan cerita translasi dengan vektor. Vektor lagi vektor lagi ngetrend amat dia di blog ini. Translasi dengan vektor mirip dengan translasi yang telah ogut bahas di artikel sebelumnya, hanya translasi dengan vektor mempunyai keunggulan, karena vektor mempunyai arah dan panjang tertentu, sehingga lebih bebas mengarahkannya kemana saja.

Program contoh yang akan ogut bagikan akan terlihat seperti gambar di bawah ini. Pesawat fighter bergerak sesuai dengan arah vektor yang ditetapkan, dan peluru yang ditembakkan fighter juga bergerak sesuai dengan arah yang dikehendaki.

Teori Vektor Translasi
Untuk memahami proses translasi dengan vektor perhatikanlah gambar berikut ini.

Titik koordinat A ditranslasikan dengan vektor c sehingga posisinya berubah menjadi A‟.

Untuk menentukan posisi titik A‟ tambahkanlah titik A dengan vektor translasinya yaitu vektor c, sehingga:

x‟ = x + ci
y‟ = y + cj

Rumus di atas berlaku untuk setiap titik koordinat yang ingin dipindahkan ke posisi lain dengan sebuah vektor.

Vektor Pesawat

Vektor Peluru

Gambar di atas adalah gambar-gambar dari vektor-vektor yang digunakan untuk translasi pesawat dan peluru. Ingatlah aturan dasar trigonometri akan sangat membantu untuk menentukan vektor translasi pesawat dan vektor translasi peluru.

Berikut ogut sertakan kode program untuk memudahkan Anda belajar, source code program secara lengkap dapat Anda download.

Tentukan nilai awal untuk Fighter, peluru dan vektor.

Public Sub SettingNilaiAwal()
'fighter
Fighter.Ax = 420 : Fighter.Ay = 120
Fighter.Bx = 580 : Fighter.By = 120
Fighter.Cx = 580 : Fighter.Cy = 280
Fighter.Dx = 420 : Fighter.Dy = 280

Fighter.d_X = 25
Fighter.d_Y = 25
Fighter.Index_Tekstur = 1

Indeks_Tekstur_Fighter = 1
Delay_Tekstur_Fighter = 1
Plus_Indeks_Tekstur_Fighter = True

'=================================
'cos 45 = 0.7071, sin 45 = 0.7071
'buat 8 buah vektor fighter dengan
'menggunakan aturan trigonometri
'=================================
'arah utara
Vektor_Fighter(0).i = 0 : Vektor_Fighter(0).j = Fighter.d_Y
'arah timur laut
Vektor_Fighter(1).i = Fighter.d_X * 0.7071
Vektor_Fighter(1).j = Fighter.d_Y * 0.7071
'arah timur
Vektor_Fighter(2).i = Fighter.d_X : Vektor_Fighter(2).j = 0
'arah tenggara
Vektor_Fighter(3).i = Fighter.d_X * 0.7071
Vektor_Fighter(3).j = -Fighter.d_Y * 0.7071
'arah selatan
Vektor_Fighter(4).i = 0 : Vektor_Fighter(4).j = -Fighter.d_Y
'arah barat daya
Vektor_Fighter(5).i = -Fighter.d_X * 0.7071
Vektor_Fighter(5).j = -Fighter.d_Y * 0.7071
'arah barat
Vektor_Fighter(6).i = -Fighter.d_X : Vektor_Fighter(6).j = 0
'arah barat laut
Vektor_Fighter(7).i = -Fighter.d_X * 0.7071
Vektor_Fighter(7).j = Fighter.d_Y * 0.7071

'================================
'menghitung vektor untuk peluru
'dengan menggunakan trigonometri
'cos 15 = 0.9659, sin 15 = 0.2588
'================================
'Peluru Fighter(0)
Peluru_Fighter(0).GO_Active = False
Peluru_Fighter(0).Vektor.i = -27.5 * 0.9659
Peluru_Fighter(0).Vektor.j = 27.5 * 0.2588
'Peluru Fighter(1)
Peluru_Fighter(1).GO_Active = False
Peluru_Fighter(1).Vektor.i = -27.5
Peluru_Fighter(1).Vektor.j = 0.0#
'Peluru Fighter(2)
Peluru_Fighter(2).GO_Active = False
Peluru_Fighter(2).Vektor.i = -27.5 * 0.9659
Peluru_Fighter(2).Vektor.j = -27.5 * 0.2588

'Timer peluru
Timer_Peluru.TDelay = 2500 '2.5 detik
Timer_Peluru.TGetFirst = True
End Sub

Deteksi tombol keyboard yang ditekan user dan tentukan vektor yang dipakai untuk mentranslasi Fighter.

Private Sub Tekan_Keyboard()
Fighter.Index_Tekstur = Indeks_Tekstur_Fighter
NilaiKey = 0

'kiri
If (GetKeyState(Keys.J) And &H1000) Then
NilaiKey = NilaiKey + 10000
End If
'kanan
If (GetKeyState(Keys.L) And &H1000) Then
NilaiKey = NilaiKey + 20000
End If
'atas
If (GetKeyState(Keys.I) And &H1000) Then
NilaiKey = NilaiKey + 1000
End If
'bawah
If (GetKeyState(Keys.K) And &H1000) Then
NilaiKey = NilaiKey + 2000
End If

'==========================================
'proses sesuai dengan key yang ditekan user
'==========================================

'kiri
If NilaiKey = 10000 Then
If Fighter.Ax > -GlControl1.Width - 50 Then
'arah barat
Translasi_Fighter(6)
End If
End If
'kanan
If NilaiKey = 20000 Then
If Fighter.Bx < GlControl1.Width + 50 Then
'arah timur
Translasi_Fighter(2)
End If
End If
'atas
If NilaiKey = 1000 Then
If Fighter.Cy < GlControl1.Height + 50 Then
'arah utara
Translasi_Fighter(0)
End If
Fighter.Index_Tekstur = 0
End If
'bawah
If NilaiKey = 2000 Then
If Fighter.Ay > -GlControl1.Height + 200 Then
'arah selatan
Translasi_Fighter(4)
End If
Fighter.Index_Tekstur = 4
End If

'================
'Tombol kombinasi
'================

'kiri+atas
If NilaiKey = 11000 Then
If (Fighter.Ax > -GlControl1.Width - 50) And (Fighter.Cy < GlControl1.Height + 50) Then
'arah barat laut
Translasi_Fighter(7)
Else
If Fighter.Ax > -GlControl1.Width - 50 Then
'arah barat
Translasi_Fighter(6)
End If

If Fighter.Cy < GlControl1.Height + 50 Then
'arah utara
Translasi_Fighter(0)
End If
End If

Fighter.Index_Tekstur = 0
End If

'kiri+bawah
If NilaiKey = 12000 Then
If (Fighter.Ax > -GlControl1.Width - 50) And (Fighter.Ay > -GlControl1.Height + 200) Then
'arah barat daya
Translasi_Fighter(5)
Else
If Fighter.Ax > -GlControl1.Width - 50 Then
'arah barat
Translasi_Fighter(6)
End If

If Fighter.Ay > -GlControl1.Height + 200 Then
'arah selatan
Translasi_Fighter(4)
End If
End If

Fighter.Index_Tekstur = 4
End If

'kanan+atas
If NilaiKey = 21000 Then
If (Fighter.Bx < GlControl1.Width + 50) And (Fighter.Cy < GlControl1.Height + 50) Then
'arah timur laut
Translasi_Fighter(1)
Else
If Fighter.Bx < GlControl1.Width + 50 Then
'arah timur
Translasi_Fighter(2)
End If

If Fighter.Cy < GlControl1.Height + 50 Then
'arah utara
Translasi_Fighter(0)
End If
End If

Fighter.Index_Tekstur = 0
End If

'kanan+bawah
If NilaiKey = 22000 Then
If (Fighter.Bx < GlControl1.Width + 50) And (Fighter.Ay > -GlControl1.Height + 200) Then
'arah tenggara
Translasi_Fighter(3)
Else
If Fighter.Bx < GlControl1.Width + 50 Then
'arah timur
Translasi_Fighter(2)
End If

If Fighter.Ay > -GlControl1.Height + 200 Then
'arah selatan
Translasi_Fighter(4)
End If
End If
Fighter.Index_Tekstur = 4
End If
End Sub

Private Sub Translasi_Fighter(ByVal Index_Vektor As Integer)
Fighter.Ax = Fighter.Ax + Vektor_Fighter(Index_Vektor).i
Fighter.Bx = Fighter.Bx + Vektor_Fighter(Index_Vektor).i
Fighter.Cx = Fighter.Cx + Vektor_Fighter(Index_Vektor).i
Fighter.Dx = Fighter.Dx + Vektor_Fighter(Index_Vektor).i

Fighter.Ay = Fighter.Ay + Vektor_Fighter(Index_Vektor).j
Fighter.By = Fighter.By + Vektor_Fighter(Index_Vektor).j
Fighter.Cy = Fighter.Cy + Vektor_Fighter(Index_Vektor).j
Fighter.Dy = Fighter.Dy + Vektor_Fighter(Index_Vektor).j
End Sub

Reload peluru setiap 2.5 detik.

Private Sub Reload_Peluru()
Dim i As Integer

For i = 0 To 2
Peluru_Fighter(i).GO_Active = True

Peluru_Fighter(i).Ax = Fighter.Ax - 20
Peluru_Fighter(i).Ay = ((Fighter.Dy - Fighter.Ay) / 2) + Fighter.Ay - 10

Peluru_Fighter(i).Bx = Peluru_Fighter(i).Ax + 20
Peluru_Fighter(i).By = Peluru_Fighter(i).Ay

Peluru_Fighter(i).Cx = Peluru_Fighter(i).Bx
Peluru_Fighter(i).Cy = Peluru_Fighter(i).By + 20

Peluru_Fighter(i).Dx = Peluru_Fighter(i).Ax
Peluru_Fighter(i).Dy = Peluru_Fighter(i).Cy
Next
End Sub

Render Fighter agar bisa oleng kiri dan kanan.

Private Sub Render_Fighter()
'membuat animasi fighter oleng kiri kanan
Delay_Tekstur_Fighter = Delay_Tekstur_Fighter + 1
If Delay_Tekstur_Fighter > 6 Then
Delay_Tekstur_Fighter = 1

If Plus_Indeks_Tekstur_Fighter = True Then
'plus
Indeks_Tekstur_Fighter = Indeks_Tekstur_Fighter + 1
If Indeks_Tekstur_Fighter > 3 Then
Indeks_Tekstur_Fighter = 2
Plus_Indeks_Tekstur_Fighter = False
End If
Else
'minus
Indeks_Tekstur_Fighter = Indeks_Tekstur_Fighter - 1
If Indeks_Tekstur_Fighter = 0 Then
Indeks_Tekstur_Fighter = 1
Plus_Indeks_Tekstur_Fighter = True
End If
End If
End If

GL.Enable(EnableCap.Blend)
GL.BlendFunc(BlendingFactorSrc.DstColor, BlendingFactorDest.Zero)

'Mask
GL.BindTexture(TextureTarget.Texture2D, FighterBMP_Mask(Fighter.Index_Tekstur))
GL.Begin(BeginMode.Quads)
GL.TexCoord2(0.0, 0.0) : GL.Vertex2(Fighter.Ax, Fighter.Ay)
GL.TexCoord2(1.0, 0.0) : GL.Vertex2(Fighter.Bx, Fighter.By)
GL.TexCoord2(1.0, 1.0) : GL.Vertex2(Fighter.Cx, Fighter.Cy)
GL.TexCoord2(0.0, 1.0) : GL.Vertex2(Fighter.Dx, Fighter.Dy)
GL.End()

GL.BlendFunc(BlendingFactorSrc.One, BlendingFactorDest.One)
'BMP
GL.BindTexture(TextureTarget.Texture2D, FighterBMP(Fighter.Index_Tekstur))
GL.Begin(BeginMode.Quads)
GL.TexCoord2(0.0, 0.0) : GL.Vertex2(Fighter.Ax, Fighter.Ay)
GL.TexCoord2(1.0, 0.0) : GL.Vertex2(Fighter.Bx, Fighter.By)
GL.TexCoord2(1.0, 1.0) : GL.Vertex2(Fighter.Cx, Fighter.Cy)
GL.TexCoord2(0.0, 1.0) : GL.Vertex2(Fighter.Dx, Fighter.Dy)
GL.End()

GL.Disable(EnableCap.Blend)

If CheckBox2.Checked = True Then
'warna merah untuk garis
GL.BindTexture(TextureTarget.Texture2D, Red)

GL.Begin(BeginMode.LineLoop)
GL.Vertex2(Fighter.Ax, Fighter.Ay)
GL.Vertex2(Fighter.Bx, Fighter.By)
GL.Vertex2(Fighter.Cx, Fighter.Cy)
GL.Vertex2(Fighter.Dx, Fighter.Dy)
GL.End()
End If
End Sub

Ok rekan-rekan sekalian sampai disini dulu cerita tentang vektor kali ini, yang harus rekan-rekan perhatikan adalah manfaat vektor translasi sangat berarti bagi pemrograman game, pada kesempatan lain ogut akan memberikan contoh program lagi yang menggunakan vektor(contoh program untuk tingkat mahir).

Salam sukses dan selamat belajar

Heriady
heriady.yoh@gmail.com

Download source code program ada di link ini

	Animasi Game 2D dengan Translasi Klik link ini untuk menuju ke artikel Download source code program klik disini
	Teknik masking pada OpenTK 2D Klik link ini untuk menuju ke artikel Download source code program klik disini
	Vektor R2 Klik link ini untuk menuju ke artikel
	Aturan dasar trigonometri Klik link ini untuk menuju ke artikel

	Belajar Pemrograman Game 2D Untuk Pemula
	Petir Cakrawala
	Membuat Objek 3D Garden Dengan OpenGL
	Membuat Bayangan Objek 3D OpenGL
	Matematika Vektor Untuk Mendeteksi Tabrakan Objek Game
	Membuat Terrain untuk Hely 3D
	Program Animasi Game MoTer 3D dengan OpenGL
	Teori Enam Kondisi untuk Membuat Side Scrolling Game
	Membuat Game dengan VB 6
	Panduan Lengkap Membuat Game Perang Shoot Them Up
	Membuat Animasi Hely 3D dengan OpenGL
	Panduan Lengkap Membuat Game Perang Dengan Game Engine
	Matematika Rotasi untuk Animasi OpenTK 2D
	Animasi 3D dengan Objek MD2
	Objek 3D low polygon dengan 3ds max
	I Love My Garden

heriady blog

About Heriady Blog

Sabtu, 04 Juli 2015

Animasi dengan Vektor Translasi

Tidak ada komentar:

Posting Komentar