Contoh aplikasi android dengan QML

Qt QML untuk Aplikasi Android (dengan KDE Necessitas)

Necessitas merupakan kakas pengembangan untuk aplikasi Android dengan Qt Framework, dikembangkan oleh tim KDE Project. Kakas ini menggunakan Qt Creator untuk IDE dan Qt versi 4.8.2 sebagai frameworknya. Tetapi tampaknya tidak diperbarui lagi, atau mungkin sudah diambil alih oleh Digia, selaku pemegang hak lisensi komersial Qt Framework.

Sekarang saatnya saya membagikan cerita tentang belajar membuat aplikasi Android dengan Qt Framework (QML). Tulisan sebelumnya tentang kakas pengembangan aplikasi Android dan MVC di Qt QML merupakan pengantar untuk tulisan ini.

Contoh aplikasi ini adalah RSS feed reader sederhana. Saat membuat New Project, pilih Qt Quick Application. Pada pilihan Kit, pilih untuk Android. Jika tidak ada, tambahkan kit Android setelah berhasil membuat New project. Nanti Qt Creator akan secara otomatis menambahkan file-file yang diperlukan untuk membuat sebuah APK, seperti misalnya AndroidManifest.xml. Pastikan Android SDK dan NDK sudah diatur dengan benar di Option Qt Creator. Kalau Necessitas biasanya sudah ada pengaturan saat instalasi. Berikut ini adalah source code QMLnya:

File main.qml

import QtQuick 1.1

Rectangle {
    width: 360
    height: 640
    id: kotak

    XmlListModel {
        id: xmlModel
        source: "http://rss.detik.com/"
        query: "/rss/channel/item"

        XmlRole { name: "title"; query: "title/string()" }
        XmlRole { name: "description"; query: "description/string()" }
        XmlRole { name: "link"; query: "link/string()" }
        XmlRole { name: "pubDate"; query: "pubDate/string()" }
    }

    ListView {
        width: kotak.width
        height: kotak.height
        model: xmlModel
        delegate: Delegasi{} //Text{text:description}
    }

}

File Delegasi.qml

import QtQuick 1.1

Item {
    id: deleg
    width: kotak.width
    height: kotak.height/6
    Rectangle {
        id:baseRec
        width: kotak.width
        height: kotak.height/6
        color: index % 2 == 0 ? "lightgray" : "white"
        Text {
            text:title
            width:parent.width
            wrapMode: Text.WordWrap
            font.pixelSize: 12
            onLinkActivated: Qt.openUrlExternally(link)
            anchors {
                top: parent.top
                topMargin: 10
                left: parent.left
                leftMargin: 10
                right: parent.right
                rightMargin: 10
            }
        }
        Text {
            property date newDate: new Date(Date.parse(pubDate))
            text:Qt.formatDateTime(newDate, "dd MMMM yyyy hh:mm")
            font.pixelSize: 10
            color: "purple"
            anchors {
                right: parent.right
                rightMargin: 10
                bottom: parent.bottom
                bottomMargin: 10
            }
        }
    }
}

Deploy

Untuk menjalankan aplikasi ini, tentunya kita butuh Android. Qt Creator mendukung baik emulator dengan ADB maupun device Android. Sebelum di-run, atur dulu deploy configuration-nya. Karena ini dibuat dengan framework Qt, maka mau tidak mau kita harus menyertakan librari-librari yang diperlukan. Seperti terlihat di screenshot berikut ini, ada 3 pilihan untuk menyertakan librari tersebut.

setting deploy qt qml android
Pengaturan untuk deployment
  1. Use Qt Libraries from device: menggunakan librari Qt framework yang sudah ada di device. Sebaiknya jangan pilih ini jika pertama kali Run aplikasi di emulator atau device, karena pasti belum ada librari di dalamnya.
  2. Deploy local Qt Libraries: Qt Creator akan menyalin librari-librari yang diperlukan ke emulator atau device.
  3. Install Ministro: kita mem-bundle APK Ministro ke APK aplikasi kita. Ministro adalah aplikasi kecil yang bertugas mengunduh librari Qt yang diperlukan, pada saat instal aplikasi kita. Librari yang diunduh adalah pilihan yang minimal, yaitu yang benar-benar dibutuhkan oleh aplikasi. Pilih yang ini jika ingin efisiensi, dan jika ingin APK yang dihasilkan berukuran kecil.

Setelah itu, coba jalankan aplikasi, CTRL+R. Setelah compile dan membuat APK, mungkin akan diminta untuk memilih emulator atau device yang terpasang. Pilih dan tunggu sampai aplikasi terinstall di android, dan beginilah tampilannya:

android app dengan qt qml
Tampilan aplikasi di emulator
Advertisements

Published by

Badwi

A Muslim, sober, a Javanese

Share your idea here (markdown enabled)

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s