Halaman

Sabtu, 21 April 2012

Membuat Animasi Bola Elastis Menggunakan Flash

Animasi bola elastis menampilkan gerakan bola memantul. Pada bagian ini akan digunakan motion tween untuk menetukan posisi awal dan akhir bola. Untuk membuat animasi bola elastis, ikuti langkah-langkah berikut:

1.Buatlah file baru pada Flash. Pada Layer1 klik 2 kali dan ubah namanya nemjadi backround.


2.Pada stage backround, masukkan rectangle tools, ubah ukurannya full pada stage (menggunakan free transform tools) dan ubah warnanya menjadi 2 gradasi warna (ubah type color menjadi linear), yaitu hitam (bagian atas) dan putih (bagian bawah).

3.Buat layer baru (klik insert layer) dan ubah namanya menjadi bola. Lock layer backround dengan meng-klik tanda kunci pada layer backround.

4.Pada layer bola, buatlah gambar bola dengan menggunakan oval tool.

5.Klik kanan gambar bola, kemudian pilih convert to Symbol. Ubah nama symbol menjadi bola, type menjadi movie clip, dan registration tepat di bawah.


6.Klik kanan pada frame 10 layer bola dan pilih insert keyframe. Klik kanan frame 10 pada layer backround dan pilih insert frame.

7.Ubah letak bola ke atas.
8.klik kanan frame 1 layer bola dan pilih copy frame. Klik kanan frame 20 layer bola dan pilih paste frame. Kilk kanan frame 20 layer backround dan pilih insert frame.
9.Klik kanan frame 25 layer bola dan pilih insert keyframe. klik kanan frame 25 layer backround dan pilih insert frame. Klik gambar bola dan gunakan free transform tools untuk mengubah ukuran bola. Drag pusat transformasi bola ke bagian bawah. Kemudian ubah ukuran panjang bola sehingga bola tampak lebih pendek untuk menampilkan efek pantulan bola.


10.Klik layer bola, pada properties ubah tween menjadi motion.

11.Tekan ctrl + enter untuk melakukan test movie.
untuk mendapatkan file pdf beserta file .fla nya, klik download

Membuat Animasi Sederhana pada VB2010

VB2010 biasanya digunakan sebagai bahasa pemrograman untuk mendesain aplikasi bisnis ataupun apilikasi industry lainnya. Tetapi pada faktanya, VB2010 dapat digunakan untuk membuat animasi sederhana.

1. Memindahkan Objek
Pada bagian ini, kita akan membuat animasi sederhana yaitu memindahkan objek dengan menggunakan button. Inputkan 1 picturebox dan 4 button ke dalam form. Untuk keterangan properties objeknya, dapat dilihat dari tabel berikut:

Ketikkan code berikut:

Public Class Form1
  
    Private Sub btnTurun_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnTurun.Click
        PictureBox1.Top = PictureBox1.Top + 10
    End Sub

    Private Sub btnNaik_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnNaik.Click
        PictureBox1.Top = PictureBox1.Top - 10
    End Sub

    Private Sub btnKiri_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnKiri.Click
        PictureBox1.Left = PictureBox1.Left - 10
    End Sub

    Private Sub btnKanan_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnKanan.Click
        PictureBox1.Left = PictureBox1.Left + 10
    End Sub

End Class

2. Animasi Menggunakan Timer
Pada bagian ini, kita akan membuat animasi sederhana yaitu memindahkan objek dengan menggunakan timer. Inputkan 1 picturebox, 2 button dan 1 timer ke dalam form. Untuk keterangan properties objeknya, dapat dilihat dari tabel berikut:
Kemudian ketik code berikut:

Public Class Form1

    Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick
        If PictureBox1.Left < Me.Width Then
            PictureBox1.Left = PictureBox1.Left + 10
        Else
            PictureBox1.Left = 0
        End If
    End Sub

    Private Sub btnStop_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnStop.Click
        Timer1.Enabled = False
    End Sub

    Private Sub btnStart_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnStart.Click
        Timer1.Enabled = True
    End Sub

    Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Timer1.Enabled = False
    End Sub

End Class

untuk mendapatkan file pdf nya, klik download

Graphics pada VB2010

Membuat graphics sangat mudah pada VB2010 karena sudah disediakan drawing tools di dalamnya. Sebagai contoh, pada VB2010 sudah terdapat drawing tools pada toolbox dimana kita tinggal meng-drag ke dalam form untuk membuat rectangle, square, ellipse, circle dan lainnya. Sejak VB berkembang menjadi bahasa pemrograman dengan konsep OOP, shape controls object tidak lagi tersedia. Programmer harus menulis code untuk membuat variasi shape dan gambar.

1. Membuat Garis (Line)
Pada bagian ini kita akan menampilkan sebuah garis (line) ke dalam form. Inputkan 1 button ke dalam form dan ketik code berikut:

Public Class Form1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        'untuk mendefinisikan objek gambar yang akan dibuat
        Dim myGraphics As Graphics = Me.CreateGraphics
        Dim myPen As Pen

        'untuk mendefinisikan variabel gambar
        myPen = New Pen(Brushes.Crimson, 10)
        myGraphics.DrawLine(myPen, 10, 10, 100, 10)
    End Sub
End Class

2. Membuat Rectangle
Pada bagian ini kita akan menampilkan sebuah rectangle (garis yang membentuk sebuah kotak)  ke dalam form. Inputkan 1 button ke dalam form dan ketik code berikut:


Public Class Form1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        Dim myRect As New Rectangle
        myRect.X = 10
        myRect.Y = 10
        myRect.Width = 100
        myRect.Height = 50
        Dim myPen As Pen
        myPen = New Pen(Drawing.Color.BlueViolet, 5)
        Dim myGraphics As Graphics = Me.CreateGraphics
        myGraphics.DrawRectangle(myPen, myRect)
    End Sub
End Class
3. Membuat Rectangle dengan Garis Putus-putus
Pada bagian ini kita akan menampilkan sebuah rectangle (garis yang membentuk sebuah kotak) dengan garis putus-putus ke dalam form. Inputkan 1 button ke dalam form dan ketik code berikut:

 Public Class Form1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
       Dim myPen As Pen
        myPen = New Pen(Drawing.Color.RoyalBlue, 5)
        Dim myGraphics As Graphics = Me.CreateGraphics
        myPen.DashStyle = Drawing.Drawing2D.DashStyle.Dot
        myGraphics.DrawRectangle(myPen, 10, 10, 100, 50)
    End Sub
End Class

4. Membuat Ellipse
Pada bagian ini kita akan menampilkan sebuah ellipse ke dalam form. Inputkan 1 button ke dalam form dan ketik code berikut:
Public Class Form1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        Dim myPen As Pen
        myPen = New Pen(Drawing.Color.BurlyWood, 5)
        Dim myGraphics As Graphics = Me.CreateGraphics
        Dim myRectangle As New Rectangle
        myRectangle.X = 10
        myRectangle.Y = 10
        myRectangle.Width = 200
        myRectangle.Height = 100
        myGraphics.DrawEllipse(myPen, myRectangle)
    End Sub
End Class

Atau dapat juga menggunakan code berikut:

Public Class Form1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        Dim myPen As Pen
        myPen = New Pen(Drawing.Color.Blue, 5)
        Dim myGraphics As Graphics = Me.CreateGraphics
        myGraphics.DrawEllipse(myPen, 10, 10, 200, 100)
    End Sub
End Class

5. Membuat Circle (Lingkaran)
Pada bagian ini kita akan menampilkan sebuah circle (lingkaran) ke dalam form. Inputkan 1 button ke dalam form dan ketik code berikut:

Public Class Form1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        Dim myPen As Pen
        myPen = New Pen(Drawing.Color.CornflowerBlue, 5)
        Dim myGraphics As Graphics = Me.CreateGraphics
        Dim myRectangle As New Rectangle
        myRectangle.X = 10
        myRectangle.Y = 10
        myRectangle.Width = 100
        myRectangle.Height = 100
        myGraphics.DrawEllipse(myPen, myRectangle)
    End Sub
End Class
Atau dapat juga menggunakan code berikut:

Public Class Form1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
       Dim myPen As Pen
        myPen = New Pen(Drawing.Color.Blue, 5)
        Dim myGraphics As Graphics = Me.CreateGraphics
        myGraphics.DrawEllipse(myPen, 10, 10, 100, 100)
    End Sub
End Class

6. Membuat Text
Pada bagian ini kita akan menampilkan sebuah text ke dalam form. Inputkan 1 button ke dalam form.
Contoh1:

Public Class Form1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        Dim myGraphics As Graphics = Me.CreateGraphics
        Dim myFont As Font
        Dim myBrush As Brush
        myBrush = New Drawing.SolidBrush(Color.DarkOrchid)
        myFont = New System.Drawing.Font("Verdana", 20, FontStyle.Underline)
        myGraphics.DrawString("Visual Basic 2010", myFont, myBrush, 10, 10)
    End Sub
End Class
Contoh2:
Public Class Form1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        Dim myGraphics As Graphics = Me.CreateGraphics
        Dim myFont As Font
        Dim myBrush As Brush
        Dim userMsg As String
        userMsg = InputBox("What is your message?", "Message Entry Form", "Enter your message here", 100, 200)
        myBrush = New Drawing.SolidBrush(Color.DarkOrchid)
        myFont = New System.Drawing.Font("Verdana", 20, FontStyle.Underline)
        myGraphics.DrawString(userMsg, myFont, myBrush, 10, 10)
    End Sub
End Class

7. Membuat Segitiga
Pada bagian ini kita akan menampilkan sebuah segitiga ke dalam form. Inputkan 1 button ke dalam form dan ketik code berikut:
Public Class Form1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        Dim myPen As Pen
        Dim A As New Point(10, 10)
        Dim B As New Point(100, 50)
        Dim C As New Point(60, 150)
        Dim myPoints As Point() = {A, B, C}
        myPen = New Pen(Drawing.Color.Gold, 5)
        Dim myGraphics As Graphics = Me.CreateGraphics
        myGraphics.DrawPolygon(myPen, myPoints)
    End Sub
End Class

8. Membuat Gambar dengan Border
Pada bagian ini kita akan menampilkan sebuah gambar dengan border ke dalam form. Inputkan 1 button ke dalam form dan ketik code berikut:

Public Class Form1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        Dim myPen As Pen
        Dim myBrush As Brush
        Dim myGraphics As Graphics = Me.CreateGraphics
        myPen = New Pen(Drawing.Color.CadetBlue, 5)
        myBrush = New SolidBrush(Color.Beige)
        myGraphics.DrawRectangle(myPen, 0, 0, 150, 150)
        myGraphics.FillRectangle(myBrush, 0, 0, 150, 150)
    End Sub
End Class
 untuk mendapatkan file pdf nya, klik download

Menggunakan Timer pada VB2010

Pada bagian ini, kita akan mempelajari penggunaan timer pada VB2010. Timer digunakan to mengontrol dan mengatur setiap event yang membutuhkan perhitungan waktu. Sebagai contoh, kita membutuhkan timer untuk membuat jam, stopwatch, animasi dan lain sebagainya.

1. Menampilkan Jam
Untuk membuat tampilan jam pada VB2010, kita membutuhkan 1 buah label dan 1 buah timer yang diinputkan ke dalam form. Klik timer1, pada properties ubah Enabled menjadi True. Kemudian ketikkan code berikut:

Public Class Form1

    Private Sub Timer1_Tick(ByVal sender As Object, ByVal e As System.EventArgs) Handles Timer1.Tick
        Label1.Text = TimeOfDay
    End Sub

End Class

2. Membuat Stopwatch
Untuk membuat stopwatch pada VB2010, kita membutuhkan 1 buah label, 1 buah timer dan 3 buah button. Ubah text pada button1 menjadi Mulai, button2 menjadi Berhenti dan button3 menjadi Reset. Ubah text pada label1 menjadi 0. Ubah enabled pada timer1 menjadi False. Kemudian ketik code berikut:


Public Class Form1

    Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick
        Label1.Text = Val(Label1.Text) + 1
    End Sub

    Private Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
        Timer1.Enabled = True
    End Sub

    Private Sub Button2_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button2.Click
        Timer1.Enabled = False
    End Sub

    Private Sub Button3_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button3.Click
        Label1.Text = 0
    End Sub

    Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Timer1.Enabled = False
    End Sub

End Class
untuk mendapatkan file pdf nya, klik download

Aplikasi Barang Sederhana Menggunakan VB2010

Pada bagian ini kita akan belajar membuat sebuah aplikasi yang menampilkan data barang. Pada aplikasi ini kita belajar menambah, mengubah dan menghapus data barang serta mencari data barang tersebut. Kita akan membuat aplikasi barang sederhana menggunakan VB2010 dan database Ms. Access. Ada 3 (tiga) langkah untuk membuat aplikasi ini, yaitu: membuat database, membuat tampilan aplikasi dan membuat kode aplikasi.

a. Membuat Database
Database yang kita gunakan untuk membuat aplikasi barang ini yaitu Ms. Access 2010 (jika tidak ada, bisa juga menggunakan Ms. Access 2007 atau Ms. Access). Adapun langkah-langkah membuat database-nya yaitu:

1. Buka program Ms. Access 2010 dengan cara klik tombol Start > All Program > Microsoft Office > Microsoft Access 2010
2. Klik icon open kemudian ketikkan nama database pada kolom File Name dengan nama supermarket, dan Save as Type menjadi Microsoft Access Databases (2002-2003) kemudian klik tombol OK, setelah itu klik tombol Create. (untuk sementara terserah anda mau disimpan dimana database tersebut)

3. Selanjutnya akan muncul Table1 kemudian tekan tombol ctrl+s dan tulis nama tabelnya menjadi barang, klik tombol OK.
4. Klik kanan pada tulisan barang kemudian pilih Design View.
5. Isikan field tabel barang seperti gambar berikut:
6. Tekan tombol ctrl+s untuk menyimpan tabel tersebut.

b. Membuat Tampilan Aplikasi Barang
Tahap berikutnya kita akan merancang tampilan aplikasi barang. Langkah-langkah yang harus dilakukan yaitu:

1. Klik tombol Start >All Program > Microsoft Visual Studio 2010 > Microsoft Visual Studio 2010.
2. Klik link New Project.
3. Ubah Name pada New Project  menjadi supermarket kemudian klik tombol OK.
4. Pada Form1 kita masukkan 3 Label, 3 TextBox, 1 DataGridView, 4 Button, 1 GroupBox, dan 2 RadioButton. Lihat gambar berikut:
5. Untuk pengaturan obejk control aplikasi yang akan kita buat, dapat dilihat seperti tabel berikut:
Nama control
Properties
Keterangan
Form1
Name
frmBarang

MaximizeBox
False

StartPosition
CenterScreen

Text
Barang
Label1
Text
Nama :
Label2
Text
Harga :
Label3
Text
Kata :
TextBox1
Name
txtNmBarang
TextBox2
Name
txtHrg

TextAlign
Right
TextBox3
Name
txtCariKata
Button1
Name
btnTambah

Text
Tambah
Button2
Name
btnUbah

Text
Ubah
Button3
Name
btnHapus

Text
Hapus
Button4
Name
btnKeluar

Text
Keluar
GroupBox1
Text
Pencarian
RadioButton1
Name
rbBarang

Text
Barang
RadioButton2
Name
rbHarga

Text
Harga
6. Simpan aplikasi sesuai tempat yang anda inginkan.
7. Pindahkan database yang telah dibuat tadi ke dalam direktori penyimpanan aplikasi …\supermarket\supermarket\bin\Debug dan …\supermarket\supermarket

c. Membuat Kode Aplikasi Barang
Untuk membuat kode aplikasi barang, ikuti langkah-langkah berikut:

1. Aktifkan form frmBarang lalu klik icon View Code, kemudian ketikkan kode berikut:

Imports System.Data
Imports System.Data.OleDb
Public Class frmBarang
End Class

2 Setelah itu, ketikkan code berikut:

Public Class frmBarang
Dim database As OleDbConnection
Dim tabel As OleDbDataAdapter
Dim data As DataSet
Dim record As New BindingSource
Sub koneksi()
Try
database = New OleDbConnection("Provider=Microsoft.Jet.Oledb.4.0;Data Source=supermarket.mdb")
database.Open()
Catch ex As Exception
MsgBox(ex.ToString())
End Try
End Sub
Sub data_record()
Try
tabel = New Data.OleDb.OleDbDataAdapter("select * from barang", database)
data = New DataSet
tabel.Fill(data)
record.DataSource = data
record.DataMember = data.Tables(0).ToString()
DataGridView1.DataSource = record
DataGridView1.Columns(0).Width = 200
Catch ex As Exception
MsgBox(ex.ToString())
End Try
End Sub
Sub bersih()
txtNmBarang.Text = ""
txtHarga.Text = ""
txtCariKata.Text = ""
rbBarang.Checked = False
rbHarga.Checked = False
txtNmBarang.Enabled = True
txtNmBarang.Focus()
btnTambah.Enabled = True
btnUbah.Enabled = False
btnHapus.Enabled = False
Call koneksi()
Call data_record()
End Sub
End Class  

3. Kembali ke tampilan frmBarang, kemudian klik dua kali pada area form, lalu ketikkan code berikut:

Private Sub frmBarang_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
Call bersih()
End Sub  

4. Kembali ke tampilan frmBarang, klik dua kali tombol Tambah, lalu ketikkan code berikut:

Private Sub btnTambah_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnTambah.Click
Try
Dim dml As New OleDbCommand
dml.Connection = database
dml.CommandType = CommandType.Text
dml.CommandText = "insert into barang values('" & txtNmBarang.Text & "','" & CSng(txtHarga.Text) & "')"
dml.ExecuteNonQuery()
MsgBox("Data telah disimpan")
Call bersih()
Catch ex As Exception
MsgBox(ex.ToString())
End Try
End Sub  

5. Kembali ke tampilan frmBarang, klik dua kali tombol Ubah, lalu ketikkan code berikut:

Private Sub btnUbah_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnUbah.Click
Try
Dim dml As New OleDbCommand
dml.Connection = database
dml.CommandType = CommandType.Text
dml.CommandText = "update barang set harga = '" & txtHarga.Text & "' where nama_barang = '" & txtNmBarang.Text & "'"
dml.ExecuteNonQuery()
MsgBox("Data telah diubah")
Call bersih()
Catch ex As Exception
MsgBox(ex.ToString())
End Try
End Sub  

6. Kembali ke tampilan frmBarang, klik dua kali tombol Hapus, lalu ketikkan code berikut:

Private Sub btnHapus_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnHapus.Click
Try
Dim dml As New OleDbCommand
dml.Connection = database
dml.CommandType = CommandType.Text
dml.CommandText = "delete from barang where nama_barang = '" & txtNmBarang.Text & "'"
dml.ExecuteNonQuery()
MsgBox("Data telah dihapus")
Call bersih()
Catch ex As Exception
MsgBox(ex.ToString())
End Try
End Sub  

7. Kembali ke tampilan frmBarang, klik dua kali tombol Keluar, lalu ketikkan code berikut:

Private Sub btnKeluar_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnKeluar.Click
Me.Dispose()
End Sub  

8. Kembali ke tampilan frmBarang, klik dua kali textbox txtCariKata, lalu ketikkan code berikut:

Private Sub txtCariKata_TextChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles txtCariKata.TextChanged
Try
If rbBarang.Checked = True Then
tabel = New Data.OleDb.OleDbDataAdapter("select * from barang where nama_barang like '%" & txtCariKata.Text & "%'", database)
data = New DataSet
tabel.Fill(data)
record.DataSource = data
record.DataMember = data.Tables(0).ToString()
DataGridView1.DataSource = record
DataGridView1.Columns(0).Width = 180
ElseIf rbHarga.Checked = True Then
tabel = New Data.OleDb.OleDbDataAdapter("select * from barang where harga like '%" & txtCariKata.Text & "%'", database)
data = New DataSet
tabel.Fill(data)
record.DataSource = data
record.DataMember = data.Tables(0).ToString()
DataGridView1.DataSource = record
DataGridView1.Columns(0).Width = 180
End If
Catch ex As Exception
MsgBox(ex.ToString())
End Try
End Sub  

9. Kembali ke tampilan frmBarang, klik dua kali DataGridView1, lalu ketikkan code berikut:

Private Sub DataGridView1_DoubleClick1(ByVal sender As Object, ByVal e As System.EventArgs) Handles DataGridView1.DoubleClick
Try
txtNmBarang.Text = DataGridView1.SelectedCells(0).Value
txtHarga.Text = DataGridView1.SelectedCells(1).Value
txtNmBarang.Enabled = False
btnTambah.Enabled = False
btnUbah.Enabled = True
btnHapus.Enabled = True
Catch ex As Exception
MsgBox(ex.ToString())
End Try
End Sub  

10. Kembali ke tampilan frmBarang, klik dua kali radiobutton rbBarang, lalu ketikkan code berikut:

Private Sub rbBarang_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles rbBarang.Click
txtCariKata.Focus()
End Sub  

11. Kembali ke tampilan frmBarang, klik dua kali radiobutton rbHarga, lalu ketikkan code berikut:

Private Sub rbHarga_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles rbHarga.Click
txtCariKata.Focus()
End Sub  

12. Tekan F5 atau tombol Start Debugging untuk menjalankan program.
untuk mendapatkan file pdf beserta coding nya, klik download