HTML5 App for Desktop Using Qt WebKit

Qt WebKit HTML5 App
Qt WebKit HTML5 App

It’s been a long time since the last time I wrote about Qt programming. This time I’d like to share my recent activity on developing the desktop version of my Android webapp, Hafal Quran. You can download it from Google Play Store by clicking this badge:
Android app on Google Play

My purpose is that the app can run on most platform. So it led me to choose HTML5 approach. And finally I come up with the app website which everyone can play it on http://hq.amzone.web.id. The Android app is the first platform-specific release of Hafal Quran.

While it looks like already reaches the final version, it actually lacks an important aspect, i.e dis-connectivity. We have to connect to internet to play it. Of course we cannot play it when go offline. So now, I continue its development to the next step: offline mode.

The first development should be focused on the Android version, as the users of mobile devices are the most and growing. But for now, I will make the offline version for desktop first. In this case, I choose to deploy it for Ubuntu Linux distro and the derivatives, particularly Grombyang OS Edu.

Technical overview

I utilize Qt framework for the development because I have some experiences in it. Besides, I decided to use Webkit as the engine of the app. And actually it is part of Qt framework itself. Webkit is the infamous engine for most popular browser, including Safari, Chrome, and even Opera.

But unfortunately, QWebKit module is now being deprecated since Qt 5. And it is now superceded by QWebEngine module. So, for now, I will still use QWebKit module of Qt4.

The drawbacks of using Webkit is probably about the memory usage. Since Qt modules are quite greedy in terms of consuming RAM.


FYI, the Android app was one of 50 apps that were selected at Finding Top50 Local Apps event, which was held by Baidu Indonesia last year.

Aplikasi HTML / Web App Nokia Asha Series

HTML sebenarnya bukan dimaksudkan untuk membuat aplikasi. Ia hanyalah skrip markup yang fungsinya adalah untuk menggambar tampilan dokumen, yang biasanya adalah laman web. Tetapi sejak HTML5 digulirkan, ia juga digunakan untuk membuat tampilan untuk aplikasi, baik laman web maupun mobile device. Sedangkan fungsinya sebagai aplikasi dilaksanakan oleh Javascript atau bahasa pemrograman lain di dalam tag canvas.

HTML merupakan yang pertama saya pelajari di dunia komputer. Karena bukan merupakan bahasa pemrograman, dan hanya ada tag-tag yang telah ditentukan, maka tidak terlalu sulit untuk mempelajarinya.

Karena mempunyai kepercayaan diri dengan HTML ini, akhir-akhir ini saya berhasil membuat aplikasi berdasarkan HTML5. Awalnya saya pikir aplikasi HTML5 hanya untuk smartphone. Tetapi ternyata ponsel S40 dan Asha dari Nokia pun mempunyai aplikasi seperti ini, yang disebut web app. Di Ovi store sudah banyak web app yang bisa diunduh, termasuk aplikasi Pandalon RSS yang mungkin anda gunakan untuk membaca tulisan ini. 🙂

Continue reading Aplikasi HTML / Web App Nokia Asha Series

Aplikasi Android dengan Pustaka Qt Framework

Salah satu alasan saya mempelajari pemrograman dengan Qt Framework adalah karena dukungan multiplatform. Sesuai dengan mottonya: “Code less. Create more. Deploy everywhere“. Yang perlu ditekankan adalah deploy everywhere-nya. Walaupun tidak sama seperti Java, Qt masih punya peluang untuk running di Android. Ini dibantu oleh Ministro yang akan mengunduh library Qt untuk Android.

Saya belum menjelajah sampai jauh utuk mencari tahu seberapa potensialnya Qt dipakai untuk mengembangkan aplikasi Android. Tapi jika googling, pasti kita akan menemukan banyak sekali pembahasan mengenai ini. Sejauh ini bisa saya simpulkan bahwa untuk pengembangan aplikasi Android dengan Qt, banyak developer yang lebih memilih QML daripada Qt widget. Bahkan contoh program Ubuntu SDK untuk Ubuntu Touch juga ditulis dalam QML.

Terlepas dari itu, saya kira Java tetaplah yang paling pantas untuk pengembangan aplikasi Android. Google juga menyatakan bahwa kita memang berpeluang untuk menggunakan bahasa C++ tapi jangan karena kita lebih suka dengan C++. Kode natif memang lebih powerful untuk mengakses fitur hardware, tapi akses ke API Android tidak banyak. Oleh karena itu, ada yang menyatakan, jika kita hanya akan sekali saja membuat aplikasi untuk Android, memakai Qt tidak masalah. Tapi jika berencana untuk membuat banyak aplikasi, tentunya Java lebih diutamakan.
Continue reading Aplikasi Android dengan Pustaka Qt Framework

Building Qt Framework from Source (Windows) dan Deploy Project-nya

Mengompilasi Kode Sumber Qt di Windows 7

Kali ini saya berbagi cara instalasi Qt Framework dengan megompilasi sendiri kode sumbernya. Tujuannya adalah mendapatkan hasil aplikasi yang sesuai dengan keinginan kita, dalam hal ini kebutuhan untuk deploy.

Pertama tentunya unduh kode sumber Qt di sini, cari yang ZIP ‘for Windows’, kira-kira berukuran 280-an MB (Qt 5.3).

Sediakan prasyarat

Sesuai dengan dokumentasi resmi ada di sini, kita membutuhkan:

  1. ActivePerl – Install a recent version of ActivePerl (download page) and add the installation location to your PATH.
  2. Python – Install Python from here and add the installation location to your PATH in order to be able to build Qt WebKit.
    • Jika kita memilih installer MSI, instal python dengan perintah msiexec /i python.msi di cmd dengan akses administrator.
  3. Install Ruby from here and add the installation location to your PATH in order to be able to build Qt WebKit.

Tentunya MSVC harus sudah terinstal. Saya menginstal MS Visual Studio C++ 2010 Express. Jika belum punya, unduh file installer dari sini.

Alternatif dari MSVC adalah MinGW. Tapi tidak saya bahas di sini, karena saya pun belum pernah mencobanya.

Continue reading Building Qt Framework from Source (Windows) dan Deploy Project-nya