Cara membuat web browser sendiri dari C++ dengan QT Creator

Ini adalah postingan pertama setelah asudahlah migrasi dari wordpress ke blogger (banyak artikel-artikel sebelumnya yang ancur -.- ).

Pada postingan kali ini saya akan menyajikan sebuah tutorial cara membuat web browser sendiri dari bahasa pemrograman C++ dengan QT Creator sebagai IDE nya.

Langkah-langkah pada tutorial kali ini cukup mudah dan sederhana sekali. Bahkan anda tidak perlu memiliki keahlian koding sama sekali untuk dapat mengikuti tutorial ini. Memang web browser yang akan kita buat ini sangat sederhana. Namun dengan kreatifitas dan keinginian anda, anda dapat mengembangkannya dan menambahkan fitur-fitur sesuai dengan keinginian anda.

Langsung saja kita mulai.

Mendesain tampilan interface web browser di QT Creator.

Pertama buat sebuah project QT Widget Application, beri nama terserah anda.

Kemudian buka file .pro pada project anda (paling atas sendiri di tree view anda). Tambahkan :
QT += webkitwidgets
seperti pada gambar berikut.
Lalu buka form > nama main window anda. Dan tambahkan QWebView (drag and drop / seret) pada window designer anda. lalu tata sedemikian rupa sesuai selera anda. QWebView ini nantinya adalah tempat dimana halaman web akan tampil.
Lalu tambahkan juga Push Button dan ubah tulisannya dengan men-double click. Lalu tambahkan juga sebuah Line Edit untuk tempat memasukkan alamat url web. Lalu atur sedemikian rupa sehingga seperti ini:

Desain tampilan sudah selesai, berikutnya kita perlu menambahkan fungsionalitas pada aplikasi kita.

Menambahkan fungsi, slot dan signal untuk aplikasi web browser QT Creator

Pertama aktifkan mode edit slot & signal, seperti pada gambar berikut:
Lalu klik-drag dari tombol "back" ke QWebView kita tadi hingga terhubung.

Lalu saat muncul window confgure connection, pilih signal "clicked()" dan slot "back()" lalu klik OK. Seperti gambar berikut.

Lakukan hal yang sama untuk tombol-tombol lain dengan konfigurasi:

• forward() untuk tombol forward.
• reload() untuk tombol refresh.

Setelah itu kembali ke mode edit object.

Klik kanan tombol GO. pilih Go to slot...
Pilih clicked() kemudian klik OK

Kemudian pada code editor ketikkan:
ui->webView->load(ui->lineEdit->text());
untuk lineEdit disesuaikan dengan nama dari Line Edit yang anda tambahkan. Biasanya secara default, namanya lineEdit.

Sampai titik ini, browser anda sudah bisa digunakan. Untuk menjalankannya, klik tombol run pada pojok kiri bawah, tunggu hingga proses compile selesai.
Anda bisa mencoba dengan mengakses alamat http://google.com .

Sekian tutorial cara membuat web browser sendiri dari C++ dengan QT Creator.

Sebenarnya masih ada lagi versi yang lebih lengkap dengan beberapa fitur tambahan, memang sengaja tidak saya tampilkan seluruhnya disini. Namun bisa anda saksikan dalam video tutorial saya berikut: