Pemrograman Qt 10 – QTextEdit, QLabel, Membaca Standard Output Shell, Membaca Berkas, dan Membuat Berkas TXT

Bismillahirrahmanirrahim.

Tulisan ini tersedia dalam PDF.

Tulisan ini menjelaskan bagaimana membuat sebuah aplikasi kecil repo changer yang bisa mengganti konfigurasi repositori Ubuntu kita dan bisa membaca isi sources.list kita secara mudah dengan Qt. Aplikasi ini masih bersifat percobaan dan sama sekali bukan versi final. Seperti biasa, pada akhir tulisan disertakan tautan unduh kode sumbernya. Seluruh informasi repositori dalam tulisan ini diambil dari tulisan https://malsasa.wordpress.com/2013/10/15/daftar-lengkap-repositori-lokal-ubuntu-12-04-plus-cara-mengaturnya/. Semoga tulisan ini bermanfaat.

Spesifikasi Sistem

1. Ubuntu 12.04
2. Qt Creator 2.4.1
3. Qt 4.8.0 (32 bit)

Daftar Kelas

1. QTextEdit
2. QFile
3. QProcess
4. QStringList
5. QString
6. QLabel

Daftar Method

1. start()
2. waitForFinished()
3. setText() (milik QLabel)
4. setReadOnly() (milik QTextEdit)
5. readAllStandardOutput() (milik QProcess)

Cuma 5? Ya, cuma 5.

Arah Tulisan Ini

Tulisan ini akan menjelaskan bagaimana membuat program yang bisa melakukan hal-hal berikut

1. Jika satu tombol diklik, maka isi sources.list berubah.
2. Klik tombol Kambing maka isi sources.list berisi konfigurasi repo Kambing, klik tombol UGM maka berisi konfigurasi repo UGM, dan seterusnya.
3. Klik tombol Baca maka isi sources.list akan ditayangkan di QTextEdit.
4. Klik tombol Kambing, maka indikator (QLabel) menayangkan bahwa repo saat ini adalah Kambing dan seterusnya.

Secara teknis, kita akan belajar bagaimana menggunakan QTextEdit, membaca standard output, memasukkan standard output ke dalam QTextEdit, membuat berkas teks dengan Qt, dan menulis string di C++.

Apa Itu Standard Output?

Standard output adalah teks yang dikeluarkan oleh program dari dalam sistem setelah melakukan suatu proses. Biasanya kita melihat standard output di dalam Terminal. Contohnya ketika kita gunakan perintah ls -l maka keluarannya seperti ini:

total 3960
-rw-r--r-- 1 master master 2673568 Mar 13  2011 kbbi.dict.dz
-rw-r--r-- 1 master master 1348181 Mar 13  2011 kbbi.idx
-rw-r--r-- 1 master master     297 Mar 13  2011 kbbi.ifo
-rw-r--r-- 1 master master   24330 Mar 13  2011 kbbi.syn

Keluaran di atas disebut standard output. Pendek kata, keluaran dari segala perintah Linux adalah standard output. Yang paling penting untuk diingat adalah standard output itu dikeluarkan secara broadcast (seperti siaran televisi) sehingga tidak hanya Terminal kita saja sebetulnya yang bisa menayangkan keluaran tersebut. Jika kita membuat aplikasi yang bisa membaca standard output, maka keluaran dari perintah Linux apa saja bisa ditayangkan di dalam aplikasi kita. Artinya, tidak perlu membuka Terminal lagi untuk menayangkan keluaran perintah yang kita panggil. Mirip Synaptic yang bisa menayangkan keluaran dpkg secara realtime ketika menginstal program.

Antara Standard Output dan Program Ini

Apa hubungan standard output dengan program kali ini? Hubungannya adalah program kita ini harus bisa membaca isi dari berkas teks (sources.list). Metode pembacaan berkas ada banyak sekali. Kita pilih satu mettode saja, yakni menggunakan cat. Kita mengenal perintah cat (concatenate) untuk mengeluarkan isi teks ke layar Terminal. Kalau kita lakukan perintah cat sources.list, maka teks isinya akan ditayangkan di layar Terminal. Teks inilah standard output. Jika kita bisa menangkapnya, maka teks dari sources.list bisa ditayangkan di dalam aplikasi kita. Pembacaan standard output adalah rahasianya.

Mengenai sources.list Kita

Kita tidak akan menyentuh berkas sources.list yang asli pada /etc/apt/sources.list karena ini adalah berkas sistem. Berkas ini berisi baris-baris alamat repo kita. Kalau terdapat kesalahan satu huruf saja di dalamnya, apt pasti menayangkan pesan error ketika kita menginstal aplikasi. Jika sudah error, maka kita harus membetulkannya secara manual. Selain itu, jika kita buka berkas sources.list buatan sendiri di /home, otomatis Synaptic Package Manager akan terbuka karena adanya asosiasi sistem. Walaupun sebenarnya tidak masalah, tetapi kita memilih jalan paling praktis yakni membuat berkas bernama sources. Ya, sources begitu saja tanpa akhiran .list. Berkas ini diibaratkan sebagai sources.list betulan sehingga apa yang bisa dilakukan dengan ini, pasti hasilnya sama jika dilakukan pada sources.list yang asli. Berkas ini akan dibuat di dalam direktori build yang diciptakan otomatis oleh Qt Creator. Dalam Ubuntu saya, berkas ini akan dibuat di direktori /home/master/Publik/QtProject/ProyekRC-build-desktop-Qt_4_8_1_in_PATH__System__Release/.

Kode

mainwindow.h

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QtGui>

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();
    QGridLayout         *vl;
    QVBoxLayout         *sl;
    QVBoxLayout         *dl;
    QWidget             *widget;
    QPushButton         *pb_kambing;
    QPushButton         *pb_fossid;
    QPushButton         *pb_ugm;
    QPushButton         *pb_buaya;
    QPushButton         *pb_baca;
    QTextEdit           *te_baca;
    QLabel              *lb_repo;

public slots:
    void ganti_ke_kambing();
    void ganti_ke_fossid();
    void ganti_ke_ugm();
    void ganti_ke_buaya();
    void baca_sources_list();

private:
    Ui::MainWindow *ui;
};

#endif // MAINWINDOW_H

mainwindow.cpp

//ProyekRC = Proyek Repo Changer
//proyek mini ini dibuat sebagai bak pasir bagi saya untuk mempelajari I/O, string,
//dan pembuatan berkas teks dengan Qt
//16 Oktober 2013
#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    vl          =           new         QGridLayout();
    sl          =           new         QVBoxLayout();
    dl          =           new         QVBoxLayout();
    widget      =           new         QWidget();
    pb_kambing  =           new         QPushButton("KAMBING");
    pb_fossid   =           new         QPushButton("FOSS-ID");
    pb_ugm      =           new         QPushButton("UGM");
    pb_buaya    =           new         QPushButton("BUAYA");
    pb_baca     =           new         QPushButton("BACA");
    te_baca     =           new         QTextEdit;
    lb_repo     =           new         QLabel;

    vl->addWidget(pb_kambing, 1, 1);
    vl->addWidget(pb_fossid, 1, 2);
    vl->addWidget(pb_ugm, 1, 3);
    vl->addWidget(pb_buaya, 2, 1);
    vl->addWidget(pb_baca, 2, 2);
    vl->addWidget(lb_repo, 2, 3);
    vl->setHorizontalSpacing(3);
    vl->setVerticalSpacing(3);
    dl->addWidget(te_baca);

    pb_kambing->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    pb_fossid->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    pb_ugm->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    pb_buaya->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    pb_baca->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    te_baca->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

    pb_kambing->setMinimumHeight(55);     //pb_kambing->setMaximumWidth(133);
    pb_fossid->setMinimumHeight(55);      //pb_fossid->setMaximumWidth(133);
    pb_ugm->setMinimumHeight(55);         //pb_ugm->setMaximumWidth(133);
    pb_buaya->setMinimumHeight(55);       //pb_buaya->setMaximumWidth(133);
    pb_baca->setMinimumHeight(55);        //pb_baca->setMaximumWidth(133);
    te_baca->setMinimumSize(575,199);

    sl->addLayout(vl);
    sl->addLayout(dl);

    widget->setLayout(sl);

    this->setCentralWidget(widget);

    //saatnya mengasosiasikan tombol dengan fungsi
    connect(pb_kambing, SIGNAL(clicked()), this, SLOT(ganti_ke_kambing()));
    connect(pb_fossid, SIGNAL(clicked()), this, SLOT(ganti_ke_fossid()));
    connect(pb_ugm, SIGNAL(clicked()), this, SLOT(ganti_ke_ugm()));
    connect(pb_buaya, SIGNAL(clicked()), this, SLOT(ganti_ke_buaya()));
    connect(pb_baca, SIGNAL(clicked()), this, SLOT(baca_sources_list()));

}

MainWindow::~MainWindow()
{
    delete ui;
}

void MainWindow::ganti_ke_kambing()
{
    QStringList argumen;
    argumen << "-c" <<
           "echo 'deb http://kambing.ui.ac.id/ubuntu precise main restricted multiverse universe\n"
                 "deb http://kambing.ui.ac.id/ubuntu/ precise-update main restricted multiverse universe\n"
                 "deb http://kambing.ui.ac.id/ubuntu/ precise-security main restricted universe multiverse\n"
                 "deb http://kambing.ui.ac.id/ubuntu/ precise-backports main restricted universe multiverse' > sources";
    /* C++ itu otomatis melakukan concatenate (penggabungan) untuk string yang dipisahkan barisnya seperti di atas
    - perhatikan " dan ' di sana, asalnya baris-baris string itu satu
    - Tanda ' ditangguhkan sampai baris terakhir supay seluruh baris dianggap sebaris oleh QStringList
    - jangan lupakan \n (newline) di setiap akhir baris karena sources.list itu berkas berbahaya
    - sementara berkas keluaran tidak dinamakan _sources.list_ karena asosiasi penyunting teks dalam sistem
    - sumber: http://stackoverflow.com/questions/4276026/how-to-write-a-qstring-on-several-lines
    16 Oktober 2013 */

    QProcess perintah;
    perintah.start("/bin/bash", argumen);
    perintah.waitForFinished(-1);

    //baru terpikir pada 17 Oktober
    this->lb_repo->setText("<b>Repo Sekarang: Kambing</b>");
}

void MainWindow::ganti_ke_fossid()
{
    QStringList argumen;
    argumen << "-c" <<
            "echo 'deb http://dl2.foss-id.web.id/ubuntu/ precise main restricted universe multiverse\n"
                  "deb http://dl2.foss-id.web.id/ubuntu/ precise-updates main restricted universe multiverse\n"
                  "deb http://dl2.foss-id.web.id/ubuntu/ precise-security main restricted universe multiverse\n"
                  "deb http://dl2.foss-id.web.id/ubuntu/ precise-backports main restricted universe multiverse' > sources";

    QProcess perintah;
    perintah.start("/bin/bash", argumen);
    perintah.waitForFinished(-1);

    this->lb_repo->setText("<b>Repo Sekarang: FOSS-ID</b>");
}

void MainWindow::ganti_ke_ugm()
{
    QStringList argumen;
    argumen << "-c" <<
            "echo 'deb http://repo.ugm.ac.id/ubuntu/ precise main restricted universe multiverse\n"
                  "deb http://repo.ugm.ac.id/ubuntu/ precise-updates main restricted universe multiverse\n"
                  "deb http://repo.ugm.ac.id/ubuntu/ precise-security main restricted universe multiverse' > sources";

    QProcess perintah;
    perintah.start("/bin/bash", argumen);
    perintah.waitForFinished(-1);

    this->lb_repo->setText("<b>Repo Sekarang: UGM</b>");
}

void MainWindow::ganti_ke_buaya()
{
    QStringList argumen;
    argumen << "-c" <<
            "echo 'deb http://buaya.klas.or.id/ubuntu/ precise main restricted universe multiverse\n"
                  "deb http://buaya.klas.or.id/ubuntu/ precise-updates main restricted universe multiverse\n"
                  "deb http://buaya.klas.or.id/ubuntu/ precise-security main restricted universe multiverse' > sources";

    QProcess perintah;
    perintah.start("/bin/bash", argumen);
    perintah.waitForFinished(-1);

    this->lb_repo->setText("<b>Repo Sekarang: Buaya</b>");
}

void MainWindow::baca_sources_list()
{
    //kode ini saya buat dengan menebak saja
    QString isi_sources_list;
    QProcess perintah_baca_sources;
    perintah_baca_sources.start("cat sources");
    perintah_baca_sources.waitForFinished(-1);
    isi_sources_list = perintah_baca_sources.readAllStandardOutput();

    this->te_baca->setText(isi_sources_list);
    this->te_baca->setReadOnly(true);
}

Qt Creator dan Kode

Hasil

Jika tombol KAMBING diklik, maka QLabel akan memberikan informasi bahwa repo sekarang adalah Kambing. Perhatikan, QTextEdit masih kosong.

Barulah setelah tombol BACA diklik, maka QTextEdit membaca isi dari berkas sources kita.

Pembahasan

Pembahasan untuk kode sumber kali ini hanya berpusat pada mainwindow.cpp saja.

mainwindow.h

Isi header kali ini masih selaras dengan header program sebelumnya. Silakan merujuk ke sana jika Anda belum paham cara deklarasi dalam header ini.

mainwindow.cpp

Ada 2 bagian saja yang penting dalam berkas cpp kita kali ini. Bagian kelas utamanya (pembentukan jendela) tidak perlu diperhatikan. Namun jika Anda belum paham soal bagaimana membentuk jendela dan membuat koneksi SIGNAL & SLOT dengan Qt, silakan merujuk ke sini dan ke sini.

1. Fungsi Ganti Repo & Notifikasi QLabel

void MainWindow::ganti_ke_kambing()
{
    QStringList argumen;
    argumen << "-c" <<
           "echo 'deb http://kambing.ui.ac.id/ubuntu precise main restricted multiverse universe\n"
                 "deb http://kambing.ui.ac.id/ubuntu/ precise-update main restricted multiverse universe\n"
                 "deb http://kambing.ui.ac.id/ubuntu/ precise-security main restricted universe multiverse\n"
                 "deb http://kambing.ui.ac.id/ubuntu/ precise-backports main restricted universe multiverse' > sources";

    QProcess perintah;
    perintah.start("/bin/bash", argumen);
    perintah.waitForFinished(-1);

    this->lb_repo->setText("<b>Repo Sekarang: Kambing</b>");
}

Kode di atas adalah fungsi buatan sendiri. Nama fungsinya ganti_ke_kambing(). Isinya adalah deklarasi lokal dan fungsi-fungsi Qt untuk mengubah isi berkas source dengan teks pengaturan repositori Kambing UI. Cara kerja fungsinya adalah menggunakan QProcess sebagai pemanggil /bin/bash dan QStringList sebagai penampung argumen yakni perintah bash yang sebenarnya dipakai. Perintah bash yang dipakai adalah echo dengan memakai redirector ‘>‘ untuk membuat berkas sources. Jika Anda belum memahami metode pemanggilan perintah shell ini, silakan merujuk ke sini.

Kode di atas jika dijalankan, maka akan mengosongkan seluruh isi sources lalu menimpanya dengan teks yang tersebut dalam echo. Ini karena sifat redirector ‘>’ yang me-replace isi teks.   Tidak berhenti sampai situ. Pengguna memerlukan notifikasi yang menandakan konfigurasi repo telah berubah ke server tertentu. Maka dipanggillah fungsi setText() milik objek lb_repo (QLabel) dalam jendela (this). Kodenya adalah this->lb_repo->setText(“Repo Sekarang: Kambing”);. Cara kerja ini sama untuk fungsi-fungsi ganti_ke_*() di bawahnya.

Masalah C++ yang penting untuk diketahui adalah model penyimpanan string di dalam objek QString. Untuk memudahkan penulisan, kita harus menaruh satu baris URL repo di bawah baris yang lain. Kalau kita tulis memanjang ke samping, kode kita jadi tidak nyaman dibaca. Maka kita memakai salah satu fitur C++ itu sendiri yakni sanggup menggabungkan (concatenate) string yang terpisah baris tetapi setiap baris diapit dengan tanda petik ganda (“”) tanpa mengakhirkan apa-apa setelah “ terakhir. Coba perhatikan kode ini:

argumen << "-c" <<
"echo 'deb http://kambing.ui.ac.id/ubuntu precise main restricted multiverse universe\n"
"deb http://kambing.ui.ac.id/ubuntu/ precise-update main restricted multiverse universe\n"
"deb http://kambing.ui.ac.id/ubuntu/ precise-security main restricted universe multiverse\n"
"deb http://kambing.ui.ac.id/ubuntu/ precise-backports main restricted universe multiverse' > sources";

Mari perhatikan perbedaan pemakaian tanda ‘ (petik tunggal) dan “ (petik ganda) dalam kode ini. Perhatikan pemakaian “ sebelum echo dan “ sesudah sources. Mereka berdua adalah pengapit seluruh baris. Perhatikan ‘ sebelum deb pada baris pertama dan ‘ sesudah multiverse pada baris terakhir. Itu adalah pengapit string bagi perintah echo. Jadi, echo punya string sendiri dan variabel argumen di sini punya string sendiri juga. Ada string di dalam string. Dan otomtis C++ menganggap semua baris sebagai satu string karena “” pada setiap baris hingga akhir tanpa ada tambahan karakter di setiap akhir baris. Ingat, harus ada escape character untuk newline (Enter) pada akhir setiap string karena kita harus mengikuti standar apt dalam mengisi sources.list yakni satu URL dalam satu baris, tidak boleh salah. Begitu caranya membuat banyak baris dalam 1 string di dalam C++.

2. Fungsi Baca Berkas

void MainWindow::baca_sources_list()
{
    QString isi_sources_list;
    QProcess perintah_baca_sources;
    perintah_baca_sources.start("cat sources");
    perintah_baca_sources.waitForFinished(-1);
    isi_sources_list = perintah_baca_sources.readAllStandardOutput();

    this->te_baca->setText(isi_sources_list);
    this->te_baca->setReadOnly(true);
}

Kode ini berbeda dengan semua fungsi ganti_ke_*() sebelumnya. Kode ini adalah fungsi yang dikoneksikan dengan tombol BACA (pb_baca). Namanya baca_sources_list(). Isinya deklarasi lokal dan fungsi bagi QProcess untuk membaca standard output dari perintah cat sources.

Yang perlu diperhatikan adalah baris

isi_sources_list = perintah_baca_sources.readAllStandardOutput();

Maksud baris tersebut adalah memasukkan apa yang ditangkap oleh method readAllStandardOutput() di dalam objek perintah_baca_sources, ke dalam variabel isi_sources_list. Ini cara kita menangkap standard output. Setelah itu, kita memasukkan hasil tangkapan tadi ke dalam QTextEdit dengan kode

this->te_baca->setText(isi_sources_list);

maka jadilah apa yang kita inginkan yaitu menampilkan isi berkas sources ke dalam aplikasi kita. Ya, rahasianya adalah dengan memakai perintah bash lalu membaca standard output–nya. Masih banyak cara lain yang belum saya mengerti. Sementara, kita akan memakai cara ini untuk program-program berikutnya.

Unduh Kode Sumber

Program kali ini bernama ProyekRC (Repo Changer). Silakan unduh dan impor di Qt Creator Anda.

• Tautan: http://otodidak.freeserver.me/tarball/ProyekRC.tar.gz
• Ukuran: 50 KB

Kesimpulan

1. Pembacaan standard output di Qt bisa dilakukan dengan QProcess melalui method readAllStandardOutput().
2. QTextEdit bisa dipakai untuk menerima penulisan teks dari pengguna maupun menayangkan teks dari program. Bahkan bisa menayangkan standard output.

Rujukan

• http://stackoverflow.com/questions/4276026/how-to-write-a-qstring-on-several-lines