Arsip Bulanan: September 2013

Catatan Ngoprek Harian Edisi 1


Bismillahirrahmanirrahim.

Ngoprek adalah bahasa slang untuk mengekspresikan tindakan mengatasi keterbatasan baik secara hardware maupun software dalam lingkup ilmu komputer. Sementara itu definisi saya. Tulisan ini tujuannya agar saya tidak membuang oprekan yang saya lakukan, sebagai rujukan jika qadarullah ada yang membutuhkan, dan sebagai bahan untuk posting blog saya. Saya ingin ini jadi catatan yang panjang dan menambah jumlah tutorial Linux berbahasa Indonesia. Semoga bermanfaat dan menginspirasi Anda untuk membuat catatan serupa.

1. Mengambil skrinsot dari lingkungan CLI murni

Tanpa X, tentu saya tidak bisa menjalankan Shutter atau KSnapshot atau GNOME Screenshot di Linux. Lalu bagaimana jika saya saat ini berada di tty1 yang notabene berada “di luar” X? Atau kalau X tidak ada sama sekali? Jawabannya mudah sekali. Instal saja program bernama fbcat. Perintahnya:

fbcat > gambar_tty.ppm

Skrinsot:

Format PPM ini walaupun berisi gambar piksel hitam putih, ukurannya besar sekali. Punya saya jadi 3 MB. Setelah dikonversi ke JPEG, jadi 42 KB.

2. Vim punya dua mode
Baru-baru ini saya terkesan sekali dengan Vim (text editor paling jos kata para hacker). Gara-gara pernyataan Pak Engkur (Kurniadi) di kanal #ubuntu-indonesia:

[17:38:08] <engkur> coba maenan consol text terus deh, pasti setuju pake vim lebih enak

Ternyata Vim betul-betul jos. Keren, andai Anda tahu. Oke, mulai. Vim atau vi itu, punya 2 modus. Yakni modus insert dan modus command. Pantas saja saya kesusahan pakai Vim lha wong saya tidak tahu adanya 2 modus ini. Vim itu tidak seperti Notepad, ia dibuat untuk penggunaan di lingkungan CLI murni. Jadi yang namanya shortcut key adalah segala-galanya di Vim. Bahkan arrow key saja tidak jalan sebagaimana di Notepad kalau pakai Vim. Shortcut key dilakukan hanya ketika Vim ada pada command mode, sedangkan memasukkan tulisan dilakukan hanya ketika Vim ada pada insert mode.

  • Command mode: tekan ‘Esc’, lalu langsung masukkan perintah
  • Insert mode: tekan ‘i’

Skrinsot:


Contoh perintah Vim: ‘:w’ untuk menyimpan (setara Ctrl+S) ‘:q’ untuk keluar (setara Ctrl+Q); Jangan masukkan tulisan apa pun ketika berada dalam modus command.

3. Vim rakus shortcut key
Masuklah dalam command mode, lalu ketik ini:

:w teks_dari_vim.txt

maka nanti tercipta sebuah berkas teks pada direktori tempat Vim dijalankan. Lihat gambar ini:

Perintah lainnya sangat banyak. Saya baru tahu perintah ini:

:h

Hasilnya adalah membuka Help milik Vim. Ini gambarnya:


Ingat, segala perintah Vim diawali dengan titik dua (:). Inilah yang membuat saya lama kebingungan dengan Vim. Selama ini saya tidak tahu kalau perintah Vim diawali dengan titik dua.

4. Vim dan HJKL sebagai panah
Ketika ada dalam modus command, HL itu untuk kiri-kanan, sedangkan JK untuk atas-bawah untuk kursor. Vim tidak menerima panah kiri-bawah-kanan-atas sebagai masukan pengatur posisi kursor.

5. ddrescue sebagai ganti dd untuk bakar ISO ke USB Flash Disk
Saya beberapa kali menggunakan dd untuk membuat liveusb untuk Linux. Namun yang saya sayangkan, tidak interaktif dia. Tidak ada progress bar ataupun sekadar keterangan sampai mana nge-burn-nya. Namun baru malam ini saya tahu ddrescue (dari akang @Yudha Priyana Hardjo) yang fungsinya serupa dd tetapi interaktif ada keterangan burning-nya cukup lengkap. Lagian, ddrescue ini sangat jauh lebih cepat daripada dd. Dan tidak mengakibatkan hang sebagaimana dd. Saya pakai ddrescue ini gara-gara saya gagal terus membuat liveusb untuk openSUSE. Walau akhirnya ddrescue ini gagal juga, sudahlah saya tulis saja sebagai hasil ngoprek.

$ ddrescue -fv openSUSE-12.3-KDE-Live-i686.iso /dev/sdc1 

Dengan bentuk umum:

$ ddrescue -fv $/path/iso/anda.iso $/path/flash/disk/anda

Cara mengetahui letak flash disk:

# fdisk -l

Catatan penting: jangan ddrescue kepada flash disk yang menancap di USB 3. Itu mengakibatkan hang Ubuntu seperti dd. Walau hang-nya tidak separah dd ketika membakar ke USB 3, tetapi sedikit mengganggu.

6. apt-get untuk trik praktis instalasi aplikasi Ubuntu offline
Mudah saja teorinya. Paksa apt-get untuk mengeluarkan lengkap daftar dependensi untuk suatu paket. Ambil daftar itu pakai grep dan cut, pasti jadi URL-URL. Lalu masukkan itu ke dalam berkas teks. Pergi ke warnet dan unduhlah semuanya pakai download manager (IDM atau uGet biar bisa semua dalam sekali klik). Perintahnya:

sudo apt-get –print-uris –yes install codeblocks | grep ^\’ | cut -d\’ -f2 > daftar_dependensi_codeblocks.txt

 

Jika sudah punya daftar_dependensi_codeblocks.txt, pergi ke warnet dan unduh semuanya. Masukkan semua .deb yang diperoleh ke dalam satu folder bernama codeblocks_Precise. Bawa pulang folder itu lalu pindahkan folder ke /home dan laksanakan perintah ini dalam folder itu:

sudo dpkg -i *.deb

atau pakai singkatan saya (buat alias dalam berkas .bashrc):

sdia

Maka aplikasi IDE canggih bernama Codeblocks terinstal dengan sempurna di Ubuntu saya dan installer-nya (folder codeblocks_Precise/) saya simpan untuk instalasi di komputer teman-teman atau instalasi di masa mendatang.

Catatan penting: Ganti nama codeblocks dengan nama paket yang dibutuhkan serta ganti Precise dengan nama versi Ubuntu.

Catatan penting 2: perhatikan /var/lib/dpkg/status karena ini sangat krusial dan bisa beda walau sama-sama Precise tapi lain komputer. Sebaiknya status milik kedua Precise di kedua komputer adalah sama agar dependensinya juga sama. Namun error dalam hal ini sangat jarang terjadi.

7. Cek versi kernel (bash)
Ternyata uname -a terlalu lengkap. Untuk spesifik langsung versi kernel, perintahnya uname -r.

8. Cek kondisi jaringan (bash)
Ternyata ada tool yang sangat bagus bernama nm-tool. Langsung terlihat kita pakai saluran mana untuk internetan. Modem saya terdeteksi berada pada ttyUSB0. Otomatis deteksi IP address kita dan IP address DNS yang kita pakai. Mudah.

9. Bagaimana cara membuat patch (edisi 1)?
Dengan diff dan patch. Dua alat ini tersedia di semua distro Linux dan sudah menjadi standar FOSS untuk membuat dan menerapkan patch. Dua alat ini hanya berlaku untuk membuat patch kode sumber, bukan biner.

Diff khusus untuk membuat patch (patch = versibaru – versi lama) sedangkan patch khusus untuk menerapkan patch (versibaru = versilama + patch). Bersambung…

10. Bagaimana cara membuat patch (edisi 2)?
Dengan bsdiff dan bspatch. Dua alat ini juga tersedia di semua distro Linux dan bisa dipakai khusus patching berkas biner.

Bsdiff khusus untuk membuat patch (patchbiner = versibarubiner – versilamabiner) sedangkan bspacth khusus untuk menerapkan patch (versibarubiner = versilamabiner + patchbiner). Bersambung…

11. OpenSUSE Live USB dengan dd
Sudah beberapa hari gagal memakai Unetbootindd, dan ddrescue. Kini saya berhasil masuk livesession openSUSE dengan perintah dd berikut:

dd if=openSUSE-12.3-KDE-Live-i686.iso of=/dev/sdb bs=4M; sync

Sedangkan perintah saya yang salah (dan membuat gagal berulang kali):
dd if=openSUSE-12.3-KDE-Live-i686.iso of=/dev/sdb1 bs=4M; sync

Perhatikan angka 1 (satu), jangan pernah dipakai kalau mau membakar ISO ke flash disk. Memang dd ini tidaklah interaktif, akan tetapi setidaknya berhasil membuat openSUSE Live USB yang dikatakan di forum openSUSE maupun Linuxquestion sendiri sebagai kemustahilan.

Skrinsot openSUSE sebagai buktinya:

12. Atur nomor IP secara manual
Seringkali justru lebih mudah mengubah nomor IP komputer kita secara manual. Caranya:

sudo ifconfig eth0 192.168.1.9

Ganti eth0 dengan wlan jika ingin mengubah nomor IP pada interface wlan. Sesuaikan interface.

13. Prinsip dasar instalasi aplikasi di Linux
Tahu syarat: harus ada 3 hal terpenting yaitu eksekutabel biner, shell script, dan berkas .desktop. Inilah kebutuhan paling minimum. Hanya dengan ini kita bisa menginstal aplikasi buatan kita tanpa memaketkannya ke DEB/RPM terlebih dahulu. Dan tidak usah susah-susah.

Tahu tempat/usr/bin/usr/lib, dan /usr/share/applications yang secara berurutan untuk shell script, eksekutabel biner, dan berkas .desktop. Mungkin aneh, kok malah biner ditaruh di lib bukan di bin? Namun ini sangat logis pada penjelasan berikut.

Tahu gunanya: eksekutabel biner adalah berkas paling penting yang semestinya seluruh berkas lain tidak dibutuhkan. Jika suatu berkas biner diletakkan di /usr/bin, maka otomatis saat itu juga jika namanya dipanggil dari shell, maka ia dieksekusi. Seperti inilah caranya semua program di Linux diinstal sebenarnya. Lihatlah bahwa di dalam /usr/bin ada ls, cd, cp, mv, dan semua program.

Shell script di sini adalah seperti shortcut di Windows. Ia berisi perintah untuk memanggil eksekutabel biner yang asli. Ia harus diberi hak eksekusi (chmod +x) sebelum digunakan. Ia kurang lebih seperti ini untuk memanggil program bernama metamorfosa:

#!/bin/bash
/usr/lib/metamorfosa

Sampai sini jelas bahwa justru shell script (bukan program aslinya) yang berada di /usr/bin. Program asli malah berada di /usr/lib yang dipanggil lewat jalan shell script dari /usr/bin. Di dalam /usr/bin justru tidak ada eksekutabel yang asli. Adanya cuma shell script. Dan sesungguhnya shell script-lah yang kita panggil ketika menggunakan perintah cp, ls, nmap, mv, mkdir, dan semuanya di Linux. Baru setelah shell script ini dipanggil, ia akan memanggil program aslinya. Keuntungan prinsip ini adalah sangat mudah untuk memanggil program apa pun dari dalam folder mana pun asal pakai terminal. Bahkan bisa autocomplete nama program KARENA program tersebut ada di /usr/bin. Walaupun tanpa restart, bash bisa mengenali namanya otomatis dan menyediakan autocomplete.

14. Menginstal modem CE682 di Precise Pangolin
Pertama: # modprobe
Kedua: # wvdialconf
Kaidah: jangan dibalik

15. Menghapus di Vim (26 September 2013)
x           menghapus satu karakter setelah kursor
X           menghapus satu karakter sebelum kursor
dd          menghapus satu baris
3dd         menghapus tiga baris ke bawah
5dd          menghapus lima baris ke bawah

Tentu saja semuanya dilakukan dalam modus command, bukan dalam modus insert.

________

Tulisan ini aslinya adalah catatan di akun fesbuk saya yang memang saya buat untuk mengumpulkan pecahan-pecahan oprekan yang tujuan akhirnya adalah posting di blog ini. 

Iklan

Ulasan openSUSE 12.3 KDE Live USB (Kumpulan Skrinsot)


Bismillahirrahmanirrahim.

Saya sudah lama tertarik dengan openSUSE terutama karena YaST (aplikasi Control Panel) yang hanya ada di openSUSE dan karena KDE-nya. Sudah beberapa minggu saya gagal membuat Live USB untuk openSUSE baik itu dengan dd, ddrescue, maupun Unetbootin. Alhamdulillah, berhasil dengan perintah dd yang khusus[1][2]. Begitu berhasil, saya langsung ambil skrinsot sebanyak-banyaknya. Berikut ini 35 skrinsot openSUSE 12.3 KDE yang saya ambil dari mesin saya.

YaST adalah Control Panel di openSUSE

opensuseku

Lengkap

Tampilan openSUSE

opensuseku1

Bersih dan cantik

YaST punya konfigurasi yang sangat lengkap, bahkan lebih dari Control Panel-nya Windows

opensuseku11

Sampai pengaturan kernel pun GUI di openSUSE

Konfigurasi partisi di YaST

opensuseku12

Edit partisi juga bisa

Meski ada YaST, tetap ada KDE System Settings di openSUSE

opensuseku14

YaST sudah lengkap, ditambah KDE System Settings maka lebih lengkap lagi

Salah satu pengaturan di dalam KDE System Settings di openSUSE yaitu Actions Policy

opensuseku15

Meski saya tidak paham, tetapi ini kelihatannya keren

Setup K3B dalam KDE System Settings

opensuseku16

Pengaturan DVD drive

Amarok sedang mengalami crash

opensuseku17

Memang hidup tak selamanya beruntung

openSUSE secara default belum menyertakan multimedia codec seperti mp3

opensuseku18

Seperti halnya Debian, Ubuntu, dan Fedora, openSUSE juga konsisten menjaga ISO-nya tetap berisi Free Software saja

Dolphin menayangkan berkas mp3 dari partisi lain 

opensuseku19

Sejujurnya saya selalu senang melihat KDE menayangkan berkas-berkas karena selalu rapi dan keren

Salah satu power YaST yakni segala konfigurasi bisa dilakukan dari GUI, yakni pengaturan proksi

opensuseku2

Lebih lengkap dari pengaturan proksi default milik Ubuntu

Sekali lagi, openSUSE menayangkan berkas mp3 dari partisi lain

opensuseku20

Menu di openSUSE

opensuseku21

openSUSE tetap bisa memutar audio berformat OGG (format open source)

opensuseku22

openSUSE menayangkan folder-folder dalam hard disk

opensuseku23

Lagi, openSUSE menayangkan berkas MP3 di hard disk

opensuseku24

Pratayang gambar-gambar dalam hard disk sambil membuka Terminal di dalam openSUSE

opensuseku25

Selain membuka berkas sambil membuka Terminal, openSUSE bisa memecah layarnya jadi dua untuk membandingkan isi dari dua folder

opensuseku26

openSUSE sudah menyertakan Marble (seperti Google Earth tapi offline)

opensuseku27

Tampilan openSUSE bisa diubah jadi persis Windows dengan Activities > Desktop Icons

opensuseku28

Windows? Ya desktop biasa dengan ikon-ikon shortcut

Lagi, hasil ganti tampilan dengan 1 klik

opensuseku29

Sekali lagi, YaST untuk pengaturan repo hanya dengan GUI

opensuseku3

Ubuntu itu sangat praktis tetapi belum sepraktis ini

openSUSE dan notifikasi pengaturan jaringannya

opensuseku30

Network Manager standar KDE

openSUSE dan pengaturan boot loader secara GUI dengan YaST

opensuseku4

Sekali lagi, power YaST, openSUSE bisa cek korup tidaknya (integritas) ISO secara GUI

opensuseku5

openSUSE mengecek integritas ISO saya, ternyata OK

opensuseku7

Pemeriksa integritas (korup tidaknya) suatu ISO atau DVD

Berarti, tidak korup

opensuseku8

Sudah termasuk dalam YaST openSUSE

openSUSE menampilkan gambar

opensuseku6

Nama aplikasi penampil gambarnya adalah Gwenview

Sekali lagi, power YaST, openSUSE punya sistem backup otomatis yang bisa diatur secara GUI

opensuseku9

Bahkan backup system sudah tersedia

Sekali lagi, power YaST, di dalamnya bisa add/remove program sebagaimana dengan Synaptic di Ubuntu

yast2-000

Release Notes itu penting untuk mengetahui versi openSUSE yang terinstal dan apa saja yang ada di dalamnya

yast2-001

Ini penting untuk mengetahui versi openSUSE kita sekarang

Sekali lagi, power YaST, openSUSE punya pengaturan jaringan dan sistem pengenalan network card yang serba GUI

yast2-002

Sekali lagi, power YaST, openSUSE bahkan punya pengaturan macam wvdial untuk modem kita tetapi dalam GUI bukan terminal lagi

yast2-003

Serasa wvdial dijadikan GUI

Sekali lagi, power YaST, openSUSE punya pengaturan keamanan serba GUI (walau sudah tidak ada virus di openSUSE)

opensuseku10

Windows saja tidak sampai seperti ini

Sekali lagi, power YaST, bahkan tanpa GParted

opensuseku13

Pantas kalau saya menganggap salah satu distro Linux tercanggih adalah openSUSE

Semoga ini semua bermanfaat untuk Anda.

Catatan

[1] dd if=openSUSE-12.3-KDE-Live-i686.iso of=/dev/sdb bs=4M; sync
[2] Perintah dd yang benar adalah tidak menyertakan angka apa pun setelah sdb atau sdc. Jika diikuti angka, dipastikan openSUSE gagal booting.

Bangkitnya Chatroom Kita!


Bismillahirrahmanirrahim.

Alhamdulillah, sesuatu yang lama kami nantikan, kanal IRC #ubuntu-indonesia kembali ramai seperti dulu. Alhamdulillah, dengan promosi seperti demikian di satu grup fesbuk, tadi malam (26 September 2013) hadir 34 orang mengikuti kuliah online oleh akang engkur:

KULIAH ONLINE LIVE MALAM INI

Pemateri: Akang Engkur (Kurniadi dari Nurulfikri)
Materi: Perkenalan Linux dan Jaringannya
Tempat: kanal resmi Ubuntu Indonesia
Cara join: masukkan data sebagai berikut:

Alamat: http://webchat.freenode.net/
Nama: namaanda
Channel: #Ubuntu-indonesia

Insya Allah beliau satu pekan ke depan mau kasih kuliah Linux terus sampai beliau mengajar kembali di STMIK.

#ubuntu-indonesia

Inilah Kebangkitan Itu

resized_#ubuntu-indonesia3

Sudah bertahun-tahun kanal ini dihuni maksimal hanya 7-8 orang setiap hari dan selalu itu-itu saja orangnya. Namun alhamdulillah, dengan strategi pemasaran webchat di atas, berhasil ditarik sekian banyak warga untuk memanfaatkan IRC. Bahkan banyak di antara mereka yang bilang itulah pertama kalinya mereka mengenal IRC. Menakjubkan!

Komentar Saya

  1. Setiap hari, kanal resmi Ubuntu Indonesia siap menerima tanya jawab Linux bahkan ada kuliah online oleh akang-akang di sana.
  2. Saya ingin pembaca terutama semua pengguna baru, untuk ikut kuliah atau ikut meramaikan kanal kita tercinta.
  3. Kita gunakan IRC untuk belajar Linux.
  4. Semoga masyarakat menyadari power IRC dan segera merapat ke kanal untuk menjadi bangsa yang hemat bandwidth.
  5. Strategi promosi IRC ini intinya adalah WEBCHAT (http://webchat.freenode.net) yakni sebuah fasilitas IRC client yang berbasis web. Mengapa? Karena demi mengajak banyak orang, harus distandardisasi dulu mereka aksesnya pakai apa. Saya pilih webchat karena semua orang pasti bisa mengaksesnya (pakai browser) beda dengan client tersendiri macam Quassel atau Pidgin. Dan nyatanya (alhamdulillah) berhasil. Tidak perlu kita muluk-muluk menghadapi orang awam sehingga mereka malah bingung. Yang paling penting mereka mau dulu. Urusan gabung ke kanal lain, atau hal teknikal lainnya, itu setelah mereka kenal dulu dengan IRC. Dahulukan yang terpenting kemudian yang sangat penting kemudian yang penting.
  6. Satu hal yang sangat penting, yang sangat menunjang promosi ini, adalah skrinsot. Saya menyertakan gambar kecil berisi skrinsot webchat kala saya isi dengan identitas saya pada posting promosi itu. Ini tujuannya membuat nyata di sisi psikis pembaca akan sesuatu yang mesti mereka lakukan. Nyatanya sangat mendukung dan bahkan sampai ada orang masuk pakai nama Malsasa (nick saya yang ada di dalam gambar). Ya, orang meniru tutorial singkat saya dengan apa adanya betul-betul. Ternyata tingkat pemahaman orang beda-beda, oleh karena itu harus dicarikan solusi perkenalan paling mudah dan paling multiplatform yaitu webchat.
  7. Saya mengharap komunitas lain semacam IGN, Linux Mint Indonesia, Manjaro Indonesia, Arch Indonesia, Gentoo Indonesia, openSUSE Indonesia, untuk segera membuat kanal IRC-nya masing-masing dan diramaikan. Juga untuk Fedora Indonesia, saya ingin segera kembali ramai seperti dulunya. Ini akan mendongkrak SDM Linux kita serta juga mendongkrak SDM teknologi Indonesia secara umum.
  8. Jujur saya mimpi pengguna Windows dan guru SMA/SMK masuk ke kanal untuk belajar Linux.

Cara Bergabung

Terlampir dalam kutipan di atas.

Log Kuliah Semalam

Karena yang hadir adalah warga Ubuntu dari komunitas fesbuk, bisa jadi pembaca belum menikmati kuliah kemarin. Tenang, ada rekamannya. Insya Allah rekaman kuliah akan senantiasa saya posting di http://forum.pos-id.org/ atau Fesbuk Ubuntu Indonesia. Semoga semua ini bermanfaat.

http://pastebin.com/jAw6v5Gv

________

Tulisan ini juga dimuat di Forum Ubuntu Indonesia pada laman http://ubuntu-indonesia.com/forums/ubbthreads.php/topics/141443/Bangkitnya_Chatroom_Kita#Post141443

Membuat Peta Situs (Sitemap) di WordPress.com


Bismillahirrahmanirrahim.

Sangat mudah. Ketik saja archives (diapit tanda kurung siku) di dalam HTML mode pada suatu halaman. Buktinya adalah peta situs blog ini.

petasitus1

Saya melihat banyak SERP berbahasa Indonesia tetapi kurang informatif judul-judulnya. Akhirnya saya putuskan langsung buat sendiri dengan tambahan .com karena saya cuma butuh peta situs untuk blog WordPress.com saya. Semoga bermanfaat.

Sumber inspirasihttp://myzandi.wordpress.com/2010/08/17/membuat-sitemap-di-wordpress-membuat-daftar-isi-otomatis/

Pemrograman Qt 8 – QVBoxLayout, QHBoxLayout, QGridLayout dan Sifat-Sifatnya


Bismillahirrahmanirrahim.

qt-creator-logoKelebihan pemrograman visual adalah adanya layout yang secara otomatis akan mengatur penataan apa pun objek yang kita tuliskan di jendela. Pendek kata, kita tidak perlu lagi mengatur ukuran matematis (X,Y) dari setiap objek GUI satu per satu karena sudah diotomatisasi oleh layout. Di Java SWING, saya menemukan FreeLayout, GridLayout, BoxLayout, AbsoluteLayout, dan lain-lain. Di Qt Framework ini, saya menemukan QVBoxLayout, QHBoxLayout, QGridLayout, QFormLayout, dan lain-lain pula. Saya akan membahas 3 layout Qt yang sudah saya gunakan dalam latihan-latihan saya kemarin dan ini bisa Anda pakai dalam program apa pun. Penting, bisa diletakkan lebih dari 1 jenis layout dalam 1 jendela. Semoga bermanfaat untuk Anda.

Manfaat Nyata Layout

Misalkan Anda ingin membuat program dengan empat tombol berjajar ke samping seperti gambar ini:

ngite-kedelapan

maka tidak perlulah Anda menulis kode peletakan x sekian y sekian untuk masing-masing tombol dan sampai berjam-jam memosisikan ukurannya biar simetris seperti gambar. Tidak perlu. Cukup buat objek layout horizontal lalu masukkan kode tombol-tombol ke dalam layout itu. Otomatis si layout horizontal akan mengatur tombol-tombol Anda berjajar ke samping. Setiap Anda masukkan satu tombol ke dalam layout, ia akan diletakkan persis di sebelah kanan tombol sebelumnya. Otomatis. Begitu pula dengan kebutuhan penataan tombol yang vertikal, atau kebutuhan penataan yang seperti keramik-keramik lantai (grid), atau malah ingin bebas menentukan ukuran secara manual semuanya, juga bisa. Gambar ini contoh program yang memakai layout vertikal:

ngite-kedelapan1

Nah, sangat praktis, bukan? Layout di Qt (maupun di framework lain) itu berguna sekali. Dan apakah hanya untuk tombol? Tentu tidak. Seluruh objek GUI (QWidget) seperti QComboBox akan diperlakukan sama seperti tombol. Maka jadi makin praktislah memrogram GUI dengan layout di Qt. Pasti lebih praktis.

Ke Mana Arah Tulisan Ini?

Kita akan latihan saja kali ini. Pokoknya kita akan:

  1. memilih dan membuat layout
  2. memasang tombol ke dalam layout
  3. melihat hasilnya secara normal dan maximized
  4. memodifikasi ukuran-ukuran yang tersedia pada layout
  5. menggabung 3 jenis layout dalam 1 jendela

Satu :: Menggunakan Layout Horizontal

Ini dilakukan dengan kelas QHBoxLayout. Kita akan membuat program seperti gambar pertama di atas.

mainwindow.cpp

#include "mainwindow.h"
#include "ui_mainwindow.h"

Dialog::Dialog()
{
    QHBoxLayout *layoututama       =       new     QHBoxLayout;
    QPushButton *tombolsatu        =       new     QPushButton("SATU");
    QPushButton *tomboldua         =       new     QPushButton("DUA");
    QPushButton *tomboltiga        =       new     QPushButton("TIGA");
    QPushButton *tombolempat       =       new     QPushButton("EMPAT");

    tombolsatu->setFixedSize(55,55);
    tomboldua->setFixedSize(55,55);
    tomboltiga->setFixedSize(55,55);
    tombolempat->setFixedSize(55,55);

    layoututama->addWidget(tombolsatu);
    layoututama->addWidget(tomboldua);
    layoututama->addWidget(tomboltiga);
    layoututama->addWidget(tombolempat);

    setLayout(layoututama);

}

mainwindow.h

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include

class Dialog : public QDialog
{
    Q_OBJECT

public:
    Dialog();

private:

};

#endif // MAINWINDOW_H

Qt Creator dalam Kode

ngite-kedelapan3

Hasil Layout Horizontal

ngite-kedelapan

Maximized

ngite-kedelapan4

Perhatikan, tombol-tombol itu jadi renggang dan otomatis centered ketika jendela maximized. Ini sifat QHBoxLayout yang pertama.

Dua :: Menggunakan Layout Vertikal

Ini dilakukan dengan kelas QVBoxLayout. Kita akan membuat program seperti gambar dua.

mainwindow.cpp

#include "mainwindow.h"
#include "ui_mainwindow.h"

Dialog::Dialog()
{
    QVBoxLayout *layoututama       =       new     QVBoxLayout;
    QPushButton *tombolsatu        =       new     QPushButton("SATU");
    QPushButton *tomboldua         =       new     QPushButton("DUA");
    QPushButton *tomboltiga        =       new     QPushButton("TIGA");
    QPushButton *tombolempat       =       new     QPushButton("EMPAT");

    tombolsatu->setFixedSize(55,55);
    tomboldua->setFixedSize(55,55);
    tomboltiga->setFixedSize(55,55);
    tombolempat->setFixedSize(55,55);

    layoututama->addWidget(tombolsatu);
    layoututama->addWidget(tomboldua);
    layoututama->addWidget(tomboltiga);
    layoututama->addWidget(tombolempat);

    setLayout(layoututama);

}

mainwindow.h

Sama dengan yang horizontal.

Qt Creator dalam Kode

Sama saja dengan yang horizontal, bedanya cuma pemakaian QVBoxLayout di sini.

Hasil Layout Vertikal

ngite-kedelapan1

Maximized

ngite-kedelapan5

Perhatikan, tombol-tombol itu jadi renggang, centered on Y axis, dan align left ketika jendela maximized. Align left ini ciri dari QVBoxLayout yang default.

Tiga :: Menggunakan Grid Layout

Grid Layout di Qt Framework adalah jalan kebebasan yang sangat praktis untuk membangun GUI yang semau gue. Ini jenis layout paling fleksibel yang dapat Anda pergunakan untuk aplikasi yang kompleks. Ini dilakukan dengan menggunakan kelas QGridLayout. Kita akan buat seperti gambar ini:

ngite-kedelapan2

mainwindow.cpp

Sama saja dengan di atas, hanya ganti QVBoxLayout dengan QGridLayout.

mainwindow.h

Sama juga dengan header sebelumnya.

Hasil Grid Layout

ngite-kedelapan2

Sekilas mirip QVBoxLayout karena default sudah vertikal. Ini belum kelihatan manfaat aslinya  QGridLayout.

Maximize

ngite-kedelapan6

Perhatikan, sekilas memang mirip QVBoxLayout walau sudah maximized. Bedanya, ia di center in Y dan center in X. Sedangkan QVBoxLayout default-nya cuma center in X.

Modifikasi Terhadap QHBoxLayout, QVBoxLayout, dan QGridLayout

Sampai saatnya bagian terpenting yakni modifikasi. Ini tujuannya untuk mengetahui sifat-sifat dari kelas layout yang bersangkutan. Jika tidak dimodifikasi, kita tahunya hanya begitu doang QHBoxLayout, QVBoxLayout, dan QGridLayout. Padahal ada seabreg kemampuan dari layout tersebut yang bisa jadi sangat kita perlukan tapi kita tidak tahu.

QHBoxLayout

ngite-kedelapan3

Sifatnya memanjang ke samping secara simetris kalau di-maximize, tidak memanjang ke atas

//mainwindow.cpp
#include "mainwindow.h"
#include "ui_mainwindow.h"

Dialog::Dialog()
{
    QHBoxLayout *layoututama       =       new     QHBoxLayout;
    QPushButton *tombolsatu        =       new     QPushButton("SATU");
    QPushButton *tomboldua         =       new     QPushButton("DUA");
    QPushButton *tomboltiga        =       new     QPushButton("TIGA");
    QPushButton *tombolempat       =       new     QPushButton("EMPAT");

    tombolsatu->setMinimumSize(55,55);
    tomboldua->setMinimumSize(55,55);
    tomboltiga->setMinimumSize(55,55);
    tombolempat->setMinimumSize(55,55);

    layoututama->addWidget(tombolsatu);
    layoututama->addWidget(tomboldua);
    layoututama->addWidget(tomboltiga);
    layoututama->addWidget(tombolempat);

    setLayout(layoututama);
}
ngite-kedelapan4

Sifatnya memanjang ke samping dan ke atas simetris kalau di-maximize, mirip bagian modem di Otodidak

//mainwindow.cpp
#include "mainwindow.h"
#include "ui_mainwindow.h"

Dialog::Dialog()
{
    QHBoxLayout *layoututama       =       new     QHBoxLayout;
    QPushButton *tombolsatu        =       new     QPushButton("SATU");
    QPushButton *tomboldua         =       new     QPushButton("DUA");
    QPushButton *tomboltiga        =       new     QPushButton("TIGA");
    QPushButton *tombolempat       =       new     QPushButton("EMPAT");

    tombolsatu->setMinimumSize(55,55);
    tomboldua->setMinimumSize(55,55);
    tomboltiga->setMinimumSize(55,55);
    tombolempat->setMinimumSize(55,55);

    tombolsatu->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    tomboldua->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    tomboltiga->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    tombolempat->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

    layoututama->addWidget(tombolsatu);
    layoututama->addWidget(tomboldua);
    layoututama->addWidget(tomboltiga);
    layoututama->addWidget(tombolempat);

    setLayout(layoututama);
}

Penjelasan Kode QHBoxLayout

  1. Saya ganti fungsi setFixedSize dengan setMinimumSize sehingga ketika jendela di-maximize, si tombol ikut membesar mengikuti ukuran jendela.
  2. Saya tambahkan fungsi setSizePolicy pada masing-masing tombol sehingga bisa expanding ke atas juga mengikuti besarnya ukuran jendela.

QVBoxLayout

ngite-kedelapan5

ngite-kedelapan7

Memanjang ke samping tetapi tidak ke atas sekaligus ketika di-maximize

 

//mainwindow.cpp
#include "mainwindow.h"
#include "ui_mainwindow.h"

Dialog::Dialog()
{
    QVBoxLayout *layoututama       =       new     QVBoxLayout;
    QPushButton *tombolsatu        =       new     QPushButton("SATU");
    QPushButton *tomboldua         =       new     QPushButton("DUA");
    QPushButton *tomboltiga        =       new     QPushButton("TIGA");
    QPushButton *tombolempat       =       new     QPushButton("EMPAT");

    tombolsatu->setMinimumSize(55,55);
    tomboldua->setMinimumSize(55,55);
    tomboltiga->setMinimumSize(55,55);
    tombolempat->setMinimumSize(55,55);

    layoututama->addWidget(tombolsatu);
    layoututama->addWidget(tomboldua);
    layoututama->addWidget(tomboltiga);
    layoututama->addWidget(tombolempat);

    setLayout(layoututama);
}

ngite-kedelapan8

ngite-kedelapan9

//mainwindow.cpp
#include "mainwindow.h"
#include "ui_mainwindow.h"

Dialog::Dialog()
{
    QVBoxLayout *layoututama       =       new     QVBoxLayout;
    QPushButton *tombolsatu        =       new     QPushButton("SATU");
    QPushButton *tomboldua         =       new     QPushButton("DUA");
    QPushButton *tomboltiga        =       new     QPushButton("TIGA");
    QPushButton *tombolempat       =       new     QPushButton("EMPAT");

    tombolsatu->setMinimumSize(55,55);
    tomboldua->setMinimumSize(55,55);
    tomboltiga->setMinimumSize(55,55);
    tombolempat->setMinimumSize(55,55);

    tombolsatu->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    tomboldua->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    tomboltiga->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    tombolempat->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

    layoututama->addWidget(tombolsatu);
    layoututama->addWidget(tomboldua);
    layoututama->addWidget(tomboltiga);
    layoututama->addWidget(tombolempat);

    setLayout(layoututama);
}

Penjelasan QVBoxLayout

  1. Saya ganti fungsi setFixedSize dengan setMinimumSize sehingga ketika jendela di-maximize, si tombol ikut membesar mengikuti ukuran jendela.
  2. Saya tambahkan fungsi setSizePolicy pada masing-masing tombol sehingga bisa expanding ke atas juga mengikuti besarnya ukuran jendela.

QGridLayout

ngite-kedelapan6

Maximize

ngite-kedelapan7Perhatikan, inilah sisi kekuatan QGridLayout. Kita bisa mengatur tombol-tombol sehingga membentuk kolom dan baris. Perhatikan juga sifatnya kalau di-maximize.

Kode QGridLayout

</pre>
#include "mainwindow.h"
#include "ui_mainwindow.h"

Dialog::Dialog()
{
 QGridLayout *layoututama = new QGridLayout;
 QPushButton *tombolsatu = new QPushButton("SATU");
 QPushButton *tomboldua = new QPushButton("DUA");
 QPushButton *tomboltiga = new QPushButton("TIGA");
 QPushButton *tombolempat = new QPushButton("EMPAT");
 QPushButton *tombollima = new QPushButton("LIMA");
 QPushButton *tombolenam = new QPushButton("ENAM");
 QPushButton *tomboltujuh = new QPushButton("TUJUH");
 QPushButton *tomboldelapan = new QPushButton("DELAPAN");

//ukuran tombol

tombolsatu->setFixedSize(55,55);
 tomboldua->setFixedSize(55,55);
 tomboltiga->setFixedSize(55,55);
 tombolempat->setFixedSize(55,55);

tombollima->setFixedSize(55,55);
 tombolenam->setFixedSize(55,55);
 tomboltujuh->setFixedSize(55,55);
 tomboldelapan->setFixedSize(55,55);

//mengatur peletakan di grid

layoututama->addWidget(tombolsatu);
 layoututama->addWidget(tomboldua);
 layoututama->addWidget(tomboltiga);
 layoututama->addWidget(tombolempat);

layoututama->addWidget(tombollima, 0, 1);
 layoututama->addWidget(tombolenam, 1, 1);
 layoututama->addWidget(tomboltujuh, 2, 1);
 layoututama->addWidget(tomboldelapan, 3, 1);

//pengaturan untuk penataan

layoututama->setAlignment(tombolsatu, Qt::AlignLeft);
 layoututama->setAlignment(tomboldua, Qt::AlignLeft);
 layoututama->setAlignment(tomboltiga, Qt::AlignLeft);
 layoututama->setAlignment(tombolempat, Qt::AlignLeft);

layoututama->setAlignment(tombollima, Qt::AlignLeft);
 layoututama->setAlignment(tombolenam, Qt::AlignLeft);
 layoututama->setAlignment(tomboltujuh, Qt::AlignLeft);
 layoututama->setAlignment(tomboldelapan, Qt::AlignLeft);

setLayout(layoututama);

}

Kode paling pentingnya: 


//mengatur peletakan di grid

layoututama->addWidget(tombolsatu);
 layoututama->addWidget(tomboldua);
 layoututama->addWidget(tomboltiga);
 layoututama->addWidget(tombolempat);

layoututama->addWidget(tombollima, 0, 1);
 layoututama->addWidget(tombolenam, 1, 1);
 layoututama->addWidget(tomboltujuh, 2, 1);
 layoututama->addWidget(tomboldelapan, 3, 1);

Qt Creator dalam Kode

ngite-kedelapan8

Penjelasan Kode

Yang perlu diperhatikan, QGridLayout itu punya fungsi addWidget yang berbeda bentuk dari addWidget pada kelas-kelas yang lain. Mengapa bisa berbeda? Ya karena sifat QGridLayout itu sendiri yang membuat penataan tombol kita (nantinya tidak cuma tombol) bisa membentuk kolom-kolom dan baris-baris. Seperti ini bentuk khususnya:

ngite-kedelapan11

Jadi, dengan QGridLayout, kita mengatur objek-objek GUI kita (tombol) berdasarkan kolom dan baris. Bisa dikata, posisi x dan y. Oleh karena itu, kode saya di atas yang berbunyi:

    layoututama->addWidget(tombollima, 0, 1);
    layoututama->addWidget(tombolenam, 1, 1);
    layoututama->addWidget(tomboltujuh, 2, 1);
    layoututama->addWidget(tomboldelapan, 3, 1);

maksudnya:

  1. letakkanlah objek tombollima pada baris ke-0 kolom ke-1
  2. letakkan objek tombolenam, pada baris ke-1 kolom ke-1, dan seterusnya.

Rangkuman

  1. QGridLayout adalah layout paling fleksibel yang bisa kita gunakan untuk membuat antarmuka sebebas mungkin.
  2. Untuk membuat tombol bisa membesar mengikuti ukuran jendela, bisa digunakan setSizePolicy dengan parameter QSizePolicy::Expanding pada kedua tempatnya.

Belajar Menggunakan KDE Edisi 1


Bismillahirrahmanirrahim.

Tulisan ini tersedia dalam PDF.

kde-full-search-screen-03

Sebenarnya saya ingin mempromosikan KDE. Saya ingin membuat post di JS berjudul “Mari Menggunakan KDE” tentu dengan isi tautan ke posting yang membahas KDE. Pembahasan yang saya inginkan adalah yang khusus pemula. Ya, agar para pemula memulai Linux dengan antarmuka KDE terlebih dahulu sebelum mengenal yang lain. Semoga posting ini menjadi pengantar Anda dalam belajar Linux khususnya mempermudah Anda bekerja dengan tampilan yang paling enak, mudah, dan fungsional di Linux. Semoga posting ini berguna untuk Anda dan menjadi sebab saya memperoleh pahala.

Perkenalan

  1. Apa itu KDE?
  2. Mengapa saya mempromosikan KDE?
  3. Apa hubungan KDE dengan Linux?
  4. Ke mana arah tulisan ini?

Apa Itu KDE?

Lihat gambar-gambar ini:

kde-destop-asli.resized

kde-menu.resized

kde-widget-folderview-pratayang-gambar.resized

Itulah KDE. Nikmati gambarnya dulu. Penjelasan menyusul.

Mengapa Saya Mempromosikan KDE?

Karena sangat sedikit tutorial bahkan sekadar catatan saja mengenai KDE yang berbahasa Indonesia. Ini kesempatan bagi saya untuk menyikatnya. Saya ingin pengguna Linux yang bermigrasi dari Windows mengenal Linux dengan KDE. Agar mudah adaptasi terhadap Linux-nya. Itu saja. Semoga niat saya memudahkan Anda ini diberkahi oleh Allah.

Logo KDE

Logo KDE

Saya memilih KDE untuk ditulis adalah selain saya sendiri pengguna KDE, saya berpendapat KDE-lah antarmuka tampilan Linux yang paling mirip Windows sehingga pasti paling mudah bagi pemula. Saya melihat setiap pengguna Linux di Indonesia pasti sebelumnya pengguna Windows, sehingga sangat layak jika diajari dengan cara yang mirip Windows. Serta, saya berpendapat pengguna seharusnya cukup dipilihkan salah satu antarmuka dari sekian banyak pilihan di Linux supaya fokus dan mudah belajarnya. Oleh karena itu saya memilihkan KDE untuk Anda.

Apa Hubungan KDE dengan Linux?

KDE adalah satu dari sekian banyak tampilan di Linux. jadi, Linux yang asli itu asalnya seperti ini:

tty_shell

Hitam putih. Tidak ada mouse sama sekali. Ini sangat berbeda dengan Windows Anda yang sudah begini sejak awal:

minixp-desktop

Aslinya, jika Anda menggunakan Linux, maka Anda harus menggunakan tampilan yang hitam putih seperti di atas. Segala-galanya dilakukan dengan perintah (menghafal perintah dan mengetikkannya). Namun beberapa distro populer macam Ubuntu, Fedora, openSUSE, dan Mint memasukkan tampilan ke dalam Linux sehingga Anda melihat Linux yang sekarang jadinya seperti ini:

Di sini saya ingin menunjukkan dahulu kepada Anda bahwa apa yang Anda pakai itu ada “wajah aslinya”. Aslinya yaa hitam putih teks semua tanpa kursor di atas. Tampilan hitam putih macam itu dinamakan CLI (command line interface) atau sering pula disebut shell atau baris perintah. Itulah aslinya Linux dan aslinya Windows juga. Ingat, Windows juga aslinya seperti itu. Bedanya dengan Linux, apa?

Windows menyatukan sejak awal antarmuka tampilan dengan sistem sedangkan Linux tidak. Linux memisahkan antara tampilan dengan sistem. Itu bedanya. Windows memiliki antarmuka tampilan tunggal (menjadi satu dengan sistem), tidak bisa diganti. Ya apa yang Anda lihat kala menyalakan Windows itulah antarmuka tampilan Windows. Sedangkan Linux memiliki banyak antarmuka tampilan. Semuanya bisa dipasang ke dalam Linux sekaligus dan bisa juga dipilih. Bahkan Linux ada yang seperti Windows, sejak Anda instal sudah termasuk antarmuka tampilan (ini yang Anda temukan di Ubuntu, Mint, Fedora, dan lain-lain). Inilah yang ingin saya tekankan kepada Anda. Perhatikan, Linux memiliki banyak antarmuka tampilan. Apa saja?

  1. KDE (yang akan saya bahas)
  2. GNOME
  3. XFCE
  4. LXDE
  5. MATE
  6. Cinnamon
  7. Razor-Qt
  8. DDE
  9. Enlightenment
  10. Openbox
  11. Awesome
  12. Xmonad
resized_test_by_rizal12345-d69h9tt

Openbox

Sengaja saya sebut beberapa saja biar tidak bingung. Jadi, apa sebetulnya hubungan KDE dengan Linux?

Sama dengan antarmuka Windows dan Windows itu sendiri. Yakni KDE menjadi penerjemah antara Anda dengan sistem. Ya, sehingga Anda jadi bisa klik, bisa drag, bisa klik kanan, bisa gerakkan mouse, dan seterusnya untuk mengerjakan kerjaan sehari-hari. Point and click sekaligus click and run. Anda akan melakukan segalanya dalam GUI (graphical user interface) dan tidak lagi menggunakan CLI (command line interface) sehingga Anda akan sangat dimudahkan dalam menggunakan komputer. Itulah tujuan diciptakannya KDE dan tujuan saya pula mempromosikannya kepada Anda. Dan sebagai antarmuka yang memudahkan itulah hubungan KDE dengan Linux. Saya harap bisa dimengerti.

Ke Mana Arah Tulisan Ini?

Memudahkan migrasi dan belajar Linux Anda dengan KDE. Nanti saya harap dengan tulisan ini, Anda tidak akan bingung lagi dengan antarmuka KDE yang sekilas rumit dan Anda mendapatkan bekal yang cukup untuk menggunakan antarmuka lainnya semacam GNOME. Juga, yang paling saya harapkan adalah Anda punya bekal supaya sesedikit mungkin meminta bantuan orang lain di Linux. Saya ingin Anda bisa Linux. Itu saja. Dan saya ingin tulisan ini banyak gambarnya sejak awal supaya tidak terlalu teknis dan menjadi tulisan yang santai ditulis serta santai dibaca.

kde-icons

Ikon-ikon khas KDE yang selalu kinclong

Saya akan memberikan pengarahan insya Allah mulai edisi-edisi berikutnya seputar:

  1. Istilah-istilah/penamaan-penamaan di KDE dan di Linux secara umum.
  2. Menginstal KDE ke dalam sistem yang belum punya KDE.
  3. Mengatur ini dan itu di KDE.
  4. Memperkenalkan penggunaan komponen-komponen KDE.
  5. Memberi contoh nyata penggunaan KDE untuk kerjaan sehari-hari.
  6. Mengembangkan KDE.

Sekian dulu. Semoga ini bermanfaat.

Bersambung…

[PDF] Unduh Tutorial Pemrograman GUI dengan Qt C++ Edisi 1-7


Bismillahirrahmanirrahim.

Unduh Satu Per Satu

Berikut ini kumpulan tutorial pemrograman GUI Qt yang mencapai edisi 7 sampai sekarang. Ini semua PDF yang direct link. Semoga bermanfaat.

Pemrograman Qt 1 – Membuat Dialog, GroupBox, Layout, dan Tombol dengan Menulis Kode (Bukan Designer)

Pemrograman Qt 2 – Mendayagunakan QGroupBox dan QHBoxLayout untuk Membentuk Kolom dalam QDialog

Pemrograman Qt 3 – Mendayagunakan QFrame dan QVBoxLayout untuk Membentuk Kolom Lebih Banyak dalam QDialog

Pemrograman Qt 4 – QStackedLayout dan QComboBox untuk Window Layering

Pemrograman Qt 5 – QStackedLayout dan QPushButton untuk Layering (setCurrentIndex)

Pemrograman Qt 6 – Membuat Program GUI Sederhana Menggunakan Sebanyak Mungkin Kelas (QStackedLayout, QPushButton, QLabel, QComboBox, dan Lainnya)

Pemrograman Qt 7 – Menjalankan Perintah Linux dari GUI C++ dengan Mudah Menggunakan system()

Unduh Sekaligus Satu Paket PDF

Tautan: http://www.mediafire.com/download/f76q15p246qgh6q/Tutorial_Pemrograman_GUI_Qt_C%2B_Edisi_1-7.tar.gz
Ukuran: 1.6 MB

Unduh Sekaligus Satu Paket Saved Web Pages (HTML)

Tautan: http://www.mediafire.com/download/mm6dn0l5xhmmycm/Pemrograman_Qt_1-7_Laman_Web_(Non-PDF).zip
Ukuran: 6 MB