Tutorial CSS Bagian 1 - Pengenalan

 Sumber gambar : Google

CSS (Cascading Style Sheet), berfungsi untuk menghias sebuah website dalam bahasa sederhananya. CSS jika diibaratkan dalam sebuah membangun sebuah bangunan, CSS berguna sebagai cat dan properti lainnya karena pondasi dan tiang-tiang bangunan itu diibaratkan sebagai HTML.

Syntax dasar HTML
selector {
       property : value;
}

Selector ini seperti H1, H2, H3, H4, H5, header, container, footer.

Property dalam CSS yang sering digunakan diantaranya :

 

background	mengatur semua properti latar belakang dalam satu deklarasi	Demo
background-color	mengatur warna background latar	Demo
background-image	mengatur gambar background	Demo
height	mengatur tinggi elemen	Demo
width	mengatur lebar elemen	Demo
font	mengatur semua pengaturan font dalam satu deklaasi	Demo
font-family	menentukan tampilan font	Demo
font-size	menentukan ukuran font	Demo
font-style	mengatur gaya font	Demo
margin	ukuran jarak bagian luar atau ukuran jarak sesudah Border	Demo

Sebenarnya masih banyak property dalam CSS saya hanya memberikan beberapa property yang sering digunakan untuk membuat sebuah halaman website. Untuk melanjutkan tutorial selanjutnya silahkan lihat Tutorial CSS Bagian 2 - Embed CSS

Read more

Membuat Form MDI

Membuat form MDI di VB.net - Form MDI adalah form induk dari semua form, atau bisa diartikan sebagai form menu utama yang dapat menampilkan atau memanggil form lainnya. Saya akan membuat form MDI ini sebagai lanjutan dari tutorial aplikasi dasar vbnet (lihat disini).

• Buatlah form baru dengan nama MDI.
• Kemudian tambahkan tools MenuStip.

 

•  Kemudian isi dengan menu dengan beberapa sebagai berikut :

Berhitung
- Kubus
- Lingkaran
- Persegi Panjang 

 Pengakses
- PDF
- Image


Setting
- Font
- Color

Hiburan
- Media Player

Exit
- Keluar

• Untuk yang dicetak tebal adalah menu utama, dan dibawahnya adalah anak menu.
• Jika Anda belum mengerti lihat gambar dibawah ini : 

•  Setelah itu masukan kode dibawah ini :

Public Class MDI

    Private Sub KubusToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles KubusToolStripMenuItem.Click
        KUBUS.Show()
        KUBUS.Visible = False
        KUBUS.ShowDialog()
    End Sub

    Private Sub LingkaranToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles LingkaranToolStripMenuItem.Click
        Lingkaran.Show()
        Lingkaran.Visible = False
        Lingkaran.ShowDialog()
    End Sub

    Private Sub PersegiPanjangToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles PersegiPanjangToolStripMenuItem.Click
        Persegi.Show()
        Persegi.Visible = False
        Persegi.ShowDialog()
    End Sub

    Private Sub PDFToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles PDFToolStripMenuItem.Click
        PDF.Show()
        PDF.Visible = False
        PDF.ShowDialog()
    End Sub

    Private Sub ImageToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ImageToolStripMenuItem.Click
        Gambar.Show()
        Gambar.Visible = False
        Gambar.ShowDialog()
    End Sub

    Private Sub FontToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles FontToolStripMenuItem.Click
        Huruf.Show()
        Huruf.Visible = False
        Huruf.ShowDialog()
    End Sub

    Private Sub ColorToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ColorToolStripMenuItem.Click
        Warna.Show()
        Warna.Visible = False
        Warna.ShowDialog()
    End Sub

    Private Sub MediaPlayerToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MediaPlayerToolStripMenuItem.Click
        MediaPlayer.Show()
        MediaPlayer.Visible = False
        MediaPlayer.ShowDialog()
    End Sub

    Private Sub KeluarToolStripMenuItem_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles KeluarToolStripMenuItem.Click
        Dim x As VariantType
        x = MessageBox.Show("Yakin mau keluar?", "Pesan", MessageBoxButtons.YesNo, MessageBoxIcon.Question)
        If x = vbYes Then
            End
        End If
    End Sub
End Class



Sekian tutorial pemograman dasar VBnet kali ini. Semoga bermanfaat dan jika memiliki kesulitan silahkan bertanya pada kolom komentar.

Read more

Membuat Splashscreen di VB.net

Membuat form splashscreen di VB.net - Membuat form splashscreen di vbnet sangatlah mudah, karena sudah disediakan form untuk splashscreen sehingga kita hanya perlu menambahkan timer dan progressbar saja. Setelah sebelumnya saya membuat beberapa aplikasi pengenalan pemograman dasar pada vbnet diataranya yaitu :

1. Program kubus
2. Program lingkaran
3. Program persegi panjang
4. Membuat media player
5. Program pembaca PDF
6. Program setting warna
7. Program setting font
8. Program browse image

Sekarang saya akan membuat form spalshscreen. 

• Seperti biasa buatlah form baru, namun yang dipilih adalah Spash Screen. Kemudian beri nama Ss.vb

• Akan tampil seperti dbawah ini, kemudian editlah sesuai dengan judul yaitu Apikasi Pengenalan Pemograman VBnet.
• Kemudian tambahkan tools Timer dan ProgressBar

• Pada Timer, settinglah Interval pada properties menjadi 100.

• Lakukan hal yang sama pada ProgressBar namun pada Value ubah menjadi 100.

• Ketikan kode ini

Public Class Ss

    Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick
        Me.ProgressBar1.Value += 2
        If Me.ProgressBar1.Value = 100 Then
            Me.Timer1.Dispose()
            Me.Visible = False
            'MDI.Show()
        End If
    End Sub
End Class


Simpanlah dan jalankan. Selanjutnya saya akan membuat form MDI yang merupakan tutorial terakhir dalam tutorial asar pengenalan vbnet ini.

Read more

Menampilkan Gambar di VB.net

Kode menampilan gambar di VB.net - Sewaktu waktu dalam menginput data pasti akan memerlukan gambar sebagai pendukung data, pada kesempatan kali ini saya akan menberikan kode untuk menampilkan / mengambil gambar di VB.net. Caranya mudah sekali, silahkan desain halaman form seperti ini.

• Tools yang digunakan adalah PictureBox, Button, dan OpenFileDialog.

• Kemudian ketikan kode berikut.

Public Class Gambar

    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        On Error Resume Next
        With Me.OpenFileDialog1
            .InitialDirectory = "C:\"
            .Filter = "JEPG(*.JPG)|*.JPG|Bitmap(*.BMP)|*.BMP|ICON(*.ICO)|*.ICO|METAFILE(*.WMP)|*.WMP"
            .ShowDialog()
            Me.PictureBox1.Image = System.Drawing.Image.FromFile(.FileName)
            Me.PictureBox1.SizeMode = PictureBoxSizeMode.StretchImage
        End With
    End Sub
End Class

• Jika setelah disimpan, jalankan program tersebut dan hasilnya seperti ini.

Untuk selanjutnya adalah membuat Splashscreen di VB.net.

Read more

Membuat Description List Dalam HTML

Cara membuat descriptiom list di HTML - Description list adalah sebuah tag list / atau tag yang bisa digunakan untuk membuat daftar seperti tag <ul> dan <ul>, dalam description list terdapat tiga tag yaitu dl, dt, dan dd.

Descriptiom list digunakan untuk membuat strutur list yang memiliki penjelasan didalamnya, berbeda dengan ordered list yang tidak memiliki penjelasan dalam setiap listnya. Untuk lebih memahaminya lihatlah kode berikut :

Inilah hasil dari tag description list.

Read more

Membuat Daftar List Dengan HTML

Cara membuat daftar list di HTML - Dalam HTML untuk membuat sebuah daftar / list bisa dengan menggunakan tag <ol> (ordered list / berurutan) dan <ul> (unordered list / tidak berututan). Tag <ol> akan ditampilkan dengan daftar berupa angka atau huruf, sedangkan tag <ul> ditampilkan dengan bullet (bulatan) atau kotak.

Berikut adalah contoh kode HTML untuk tag <ol> :

Hasilnya seperti ini.

Untuk membuat unordered list tinggal ganti tag <ol> dengan tag <ul>. Berikut kode HTML untuk tag <ul> :

Hasilnya seperti ini.

Perlu diketahui, dengan menggunakan tag list dalam HTML tidak hanya untuk membuat daftar saja namun bisa digunakan untuk membuat menu navigasi dan menu dropdown. Selain ordered list dan unordered list terdapat tag lain untuk membuat daftar list pada HTML yaitu Description List. (Tutorial Description List)

Read more

Kode Mengubah Font di VB.net

Cara mengubah font pada VB.net - Masih dalam tutorial dasar pemograman VB.net, artikel ini adalah lanjutan dari program setting warna di VB.net.

• Seperti biasa, buatlah form baru dengan nama Huruf.
• Desain tampilan seperti ini dengan tools Label, Button, Font Dialog.

• Sekarang ketiklah kode ini :

Public Class Font

    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        Dim x As String
        x = InputBox("MASUKAN TEKS :", "PESAN")
        If x = Nothing Then
            Exit Sub
        End If
        Me.Label1.Text = x

        With Me.FontDialog1
            .ShowDialog()
            Me.Label1.Font = .Font
        End With
    End Sub
End Class

• Setelah selesai maka langsung jalankan hasilnya seperti ini :

Pemograman ini masih berlanjut, untuk tutorial selanjutnya adalah membuat program untuk browse image / mengambil gambar.

Read more

Membuat Pogram Mengubah Warna

Program mengubah warna pada VB.net - Setelah membuat program pembaca file PDF di VB.net, sekarang bagaimana kode untuk mengubah warna pada form misalnya pada VB.net. Ini sangat-sangatlah mudah simak baik-baik.

• Buatlah form dengan nama Warna.
• Desainlah dengan menggunakan Button, Panel, dan Color Dialog.

• Tidak ada yang perlu di atur lagi pada properti, ketikan kode ini :

Public Class Warna

    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        With Me.ColorDialog1
            .ShowDialog()
            Me.Panel1.BackColor = .Color
        End With
    End Sub
End Class

• Kemudian jalankan maka jika tidak mengalami debug hasilnya seperti ini.
• Jika Anda mengklik tombol Pilih Warna maka akan muncul form color.

Jika telah selesai silahkan lanjut ke tutorial Program Setting Font VB.net.

Read more

Program Pembaca PDF VB.net

Membuat program untuk membaca file PDF dengan VB.net - Masih berlanjut dengan tutorial dasar pemograman VB.net 2005, sebelumnya kita telah membuat sebuah program untuk membuka file musik dan video dengan memanfaatkan Windows Media Player, sekarang kita akan membuat program untuk membuka file PDF.

Jika Anda belum menginstal Adobe Reader, silahkan instal dahulu atau software apapun untuk membuka file PDF. Karena kita akan memanfaatkannya dalam pemograman kali ini.

• Buatlah form baru dengan nama PDF
• Kemudian klik kanan pada Toolbox - Choose Items...

• Setelah itu cari Adobe Reader pada tab COM Component

• Kemudian desainlah form seperti ini

• Tool yang dibutuhkan adalah Button, Adobe Reader, dan OpenFileDialog
• Setelah selesai masukan kode berikut :

Public Class PDF

    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        On Error Resume Next
        Me.OpenFileDialog1.Filter = "*.pdf|*.pdf"
        Me.OpenFileDialog1.ShowDialog()
        Me.AxAcroPDF1.src = Me.OpenFileDialog1.FileName
    End Sub
End Class

• Sekarang coba jalankan dan cari file PDF kemudian buka, ini hasilnya jika Anda telah berhasil.

Jangan lewatkan  tutorial selanjutnya yaitu membuat Program Untuk Mengubah Warna. 

Read more

Menghitung Persegi Panjang

Program menghitung luas dan keliling persegi panjang dengan Vb.net - Pada artikel sebelumnya saya telah membuat program menghitung luas dan keliling lingkaran, sekarang masih pada project yang sama. Buatlah form baru dengan nama Persegi.

Desainlah tampilan form seperni ini.

Pada grup INPUT DATA:

• Textboxt1 : TxtPanjang
• TextBox2 : TxtLebar

Pada grup PILIHAN

• CheckBox1 : ChkLuas
• CheckBox2 : ChkKeliling

Pada grup HASIL

• TextBox3 : TxtLuas
• TextBox4 : TxtKeliling
   

Sekarang masukan kodenya.

Public Class Persegi

    Private Sub ChkLuas_CheckedChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ChkLuas.CheckedChanged
        If Me.ChkLuas.Checked = True Then
            Me.LblLuas.Visible = True
            Me.TxtLuas.Visible = True
            Me.LblLuas.Text = "LUAS"
            Me.TxtLuas.Text = Val(Me.TxtPanjang.Text) * Val(Me.TxtLebar.Text)
        Else
            Me.TxtLuas.Visible = False
            Me.LblLuas.Visible = False
        End If
    End Sub

    Private Sub ChkKeliling_CheckedChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ChkKeliling.CheckedChanged
        If Me.ChkKeliling.Checked = True Then
            Me.LblKeliling.Visible = True
            Me.TxtKeliling.Visible = True
            Me.LblKeliling.Text = "KELILING"
            Me.TxtKeliling.Text = Val(Me.TxtPanjang.Text) + Val(Me.TxtLebar.Text)
        Else
            Me.TxtKeliling.Visible = False
            Me.LblKeliling.Visible = False
        End If
    End Sub
End Class 


Untuk tutorial selanjutnya adalah Membuat Pemutar Musik dan Film Menggunakan Media Player, tetap mencoba (; 

Read more

Membuat Media Player Dengan VB.net

Membuat pemutar film dan musik dengan VB.net - Membuat media player dengan VB.net - Setelah sebelumnya kita telah membuat program menghitung persegi panjang, sekarang kita akan membuat pemutar film dan video dengan VB.net.

• Seperti biasanya, buatlah form baru dengan nama MediaPlayer
• Sebelum mendesain form, ada beberapa item pada Toolbox yang harus kita munculkan.
• Caranya, klik kanan pada Toolbox (sembarangan saja yang penting di dalam Toolbox)
• Setelah klik kanan, kmudian pilih Choose Item...

• Pilih Tab COM Component
• Kemudian cari Windows Media Player
• Seteah ketemu, ceklis pada checkbox Windows Media Player.
• Pilih Ok.

• Sekarang item Windows Media Player sudah ada pada Toolbox.

• Desainlah tampilan form seperti ini

•  Satu Button, item Media Player, dan OpenFileDialog.
• Tidak ada yang perlu diatut pada propertiesnya.
• Sekarang tinggal masukan kodenya

Public Class MediaPlayer

    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
        On Error Resume Next
        Me.OpenFileDialog1.Filter = "(*.mp3)|*.mp3|(*.wmv)|*.wmv"
        Me.OpenFileDialog1.ShowDialog()
        Me.AxWindowsMediaPlayer1.URL = Me.OpenFileDialog1.FileName
    End Sub
End Class


Setelah pengkodean selesai, eksekusi sekarang. Ini hasilnya saat saya membuka video yang berformat .wmv

Mudah kan?
Untuk selanjutnya kita akan membuat Program Untuk Membaca File PDF.

Read more

Cara Memilih Form di VB.net

Cara memilih form yang akan di RUN di VBnet - Untuk yang baru belajar VB.net mungkin bingung sat akan mengeksekusi salah satu form yang akan dipilih, karena kemungkinan saat kita membaut form yang kedua dalam satu project maka yang akan dijalankan adalah form yang pertama kali dibuat.

Untuk itu, maka ada pengaturan untuk memilih salah satu form yang akan di jalankan. Caranya sangat mudah, pilihlah pada menu bar Project - ....... Properties

*) ....... adalah nama project yang Anda buat.

Untuk lebih jelasnya lihat gambar dbawah ini, nama project saya adalah AppPengenalan.

Setelah itu akan muncul form seperti ini.

Pada tab Application, disana ada Starup Form. Disitulah kita bisa memilih form yang akan kita jalankan, sebagai contoh diatas saya sudah memiliki 4 form. Setelah salah satu form dipilih sekarang jalankan form yang sudah dipilih dan hasilnya form tersebut sekarang bisa dijalankan.

Read more

Menghitung Luas dan Keliling Lingkaran dengan VB.net 2005

Membuat program menghitung luas dan keliling lingkaran dengan VB.net - Pada artikel sebelumnya saya telah membuat program menghitung luas kubus. Sekarang sebagai lanjutanya saya akan membuat program untuk menghitung luas dan keliling lingkaran.

• Lanjutkan program sebelumnya.
• Buatlah form baru dengan cara pilih Project - Add Windos Form... pada menu. Kemudian beri nama lingkaran.vb

• Sekarang desainlah form seperti ini. Untuk membuat kotak gunakanlah Group pada ToolBox. Kemudian cut (Ctrl+X) label dan textbox ke dalam Group tersebut.
• Untuk luas dan keliling gunakanlah RadioButton.

• TextBox1 ganti namanya dengan TxtJari
• RadioButton1 ganti dengan RadLuas
• RadioButton2 ganti dengan RadKeliling
• TextBox2 ganti dengan TxtHasil
• Buatlah label tanpa nama diatas TxtHasil, kemudian pada Name di properties ketikan LblHasil
   

Silahkan copy kode dibawah jika Anda tidak mau mengetik, tapi alangkah baikknya Anda ketik kode di bawah ini agar lebih memahami (:


Public Class Lingkaran

    Private Sub RadLuas_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles RadLuas.Click
        If Me.RadLuas.Checked = True Then
            Me.LblHasil.Text = "LUAS :"
            Me.TxtHasil.Text = 3.14 * Val(Me.TxtJari.Text) ^ 2
        End If
    End Sub

    Private Sub RadKeliling_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles RadKeliling.Click
        If Me.RadKeliling.Checked = True Then
            Me.LblHasil.Text = "KELILING :"
            Me.TxtHasil.Text = 2 * 3.14 * Val(Me.TxtJari.Text)
        End If
    End Sub

    Private Sub RadLuas_CheckedChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles RadLuas.CheckedChanged

    End Sub
End Class


Sekarang eksekusi programnya apakah berjalan tanpa hambatan? Jika yang berjalan adalah Form Kubus, maka silahkan baca Cara Memilih Form Yang Akan Dijalankan. :D Semoga bermanfaat.
Untuk selanjutnya saya akan membuat program Menghitung Persegi Panjang.

Read more

Menghitung Luas Kubus dengan VB.net 2005

Program menghitung luas kubus dengan VB.net - Tutorial dasar pemograman VB.net ini adalah tutorial yang paling dasar bahkan bisa juga dibilang sebagai pengenalan pemograman dalam VB.net, disini saya mengunakan VB.net 2005. Saya akan membuat program untuk menghitung luas kubus yang akan dibuat secara singkat.

• Pertama, buka VB.net Anda
• Buatlah project baru dengan nama AppPengenalan

• Kemudian desain form seperti tampilan dibawah

•  Yang dibutuhkan adalah 2 label, 2 textbox, dan 3 button.
• Gantilan nama TextBox1 pada Properties dengan nama TxtSisi.
• Dan TextBox2 dengan nama TxtLuas.
• Button1 menjadi BtnHitung
• Button2 menjadi BtnReset
• Button3 menjadi BtnKeluar

 Untuk memasukan kodenya, double klik pada button Hitung dan ketkan kodenya.

 Ketiklah kode berikut ini :


Public Class KUBUS
    Private Sub BtnHitung_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles BtnHitung.Click
        Me.TxtLuas.Text = 6 * (Val(Me.TxtSisi.Text) ^ 2)
    End Sub

    Private Sub BtnReset_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles BtnReset.Click
        Me.TxtLuas.Text = ""
        Me.TxtSisi.Text = ""
        Me.TxtSisi.Focus()
    End Sub

    Private Sub BtnKeluar_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles BtnKeluar.Click
        Dim x As VariantType
        x = MessageBox.Show("Yakin mau keluar?", "Pesan", MessageBoxButtons.YesNo, MessageBoxIcon.Question)
        If x = vbYes Then
            End
        End If
    End Sub
End Class



 Setelah selesai, simpanlah dan run projectnya. Jika memiliki masalah sillahkan bertanya pada kolom komentar.

Untuk tutorial selanjutnya saya akan membuat program menghitung luas dan keliling lingkaran pada artikel Menghitung Luas dan Keliling Lingkaran dengan VB.net 2005.

Read more