July 15, 2010
by Andre Siagian
Seperti artikel yang terdahulu Saya akan membuat artikel selanjutnya dengan judul “Konsep-Konsep dasar Pembuatan UI(User Interface) menggunakan RIM Blackberry Apps API”. Bagi para developer yang telah terbiasa dengan bahasa pemograman Java mungkin tidak sulit lagi untuk memahami konsep ini yang merupakan konsep-konsep dasar yang menyerupai konsep standar Java UI Toolkit seperti SWING dan AWT, namun hal ini jangan terlalu dipandang cukup mudah karena kita diwajibkan mengacu kepada RIM Blackberry Apps API dimana konsep-konsep penanganan UI(User Interface) harus menggunakan API, karena kesemua Aplikasi nanti nya akan berjalan pada Device atau Perangkat Mobile dari Blackberry itu sendiri.
Sekarang kita akan melangkah ke pembuatan beberapa contoh dasar dengan menggunakan komponen UI(User Interface) dari RIM Blackberry Apps API, sebelum melangkah lebih jauh sebaiknya anda bisa mempelajari komponen UI API yang cukup lengkap disini.
Berikut ini Saya akan memberikan beberapa contoh Aplikasi yang menggunakan Komponen UI dari RIM.
Komponen UI (LabelField), komponen UI ini berfungsi untuk menampilkan sebuah label pada Aplikasi Anda, yang mana label ini bisa kita atur dengan berbagai posisi sesuai kebutuhan dengan FOCUSABLE, FIELD_RIGHT dan FIELD_HCENTER, berikut contoh code nya :
add(new LabelField("Label"));
add(new LabelField("Label 2", 0, -1, Field.FIELD_RIGHT));
LabelField label = new LabelField("Label 3", 0, -1, Field.FIELD_HCENTER);
Font aturHuruf = this.getFont().derive(Font.BOLD | Font.ITALIC);
label.setFont(aturHuruf);
add(label);
Komponen UI (EditField), komponen UI ini berfungsi membuat sebuah textbox yang mana kita bisa mengubah atau bisa di input sesuai dengan apa yang kita inginkan, berikut contoh code nya :
EditField editbox = new EditField("Username: ", "");
add(editbox);
Komponen UI (PasswordEditField), komponen UI sama hal nya dengan EditField, yang mana komponen ini mempunyai filter untuk setiap karakter yang diinputkan akan berubah menjadi asterix yang menyembunyikan karekter tersebut secara otomatis.
PasswordEditField passwordbox = new PasswordEditField("Password: ", "");
add(passwordbox);
Komponen UI (BitmapField), komponen UI ini berfungsi untuk menambahkan gambar pada aplikasi Anda, selain kita bisa mengatur tata letak dengan cara mengatur FormUI.FIELD_RIGHT atau FormUI.FIELD_HCENTER dan komponen ini juga mendukung beberapa format gambar seperti .PNG, .GIF, .JPEG, berikut contoh code nya:
Bitmap gambar = Bitmap.getBitmapResource("paket/contoh/gambar/robot.png");
BitmapField tampgbr = new BitmapField(gambar, BitmapField.FOCUSABLE);
add(tampgbr);
Komponen UI (ButtonField), komponen UI ini berfungsi untuk membuat tombol, berikut contoh code nya:
ButtonField tombol = new ButtonField("Tombol");
ButtonField tombol2 = new ButtonField("Tombol 2");
add(tombol);
add(tombol2);
Berikut Source Code diatas yang akan berjalan di Simulator dan bisa juga berjalan di Device Blackberry itu sendiri.
Berikut petikan source code program diatas:
import net.rim.device.api.ui.*;
import net.rim.device.api.ui.component.*;
import net.rim.device.api.ui.container.*;
import net.rim.device.api.system.*;
public class contohUI extends UiApplication {
public static void main(String[] args) {
contohUI tempUI = new contohUI();
tempUI.enterEventDispatcher();
}
public contohUI() {
pushScreen(new contohUIScreen());
}
}
final class contohUIScreen extends MainScreen {
public contohUIScreen() {
super();
// Pemberian judul Aplikasi di MainScreen
LabelField judul = new LabelField("CONTOH UI", LabelField.ELLIPSIS | LabelField.USE_ALL_WIDTH);
setTitle(judul);
// Komponen UI untuk Contoh Pembuatan Label
add(new LabelField("Label"));
add(new LabelField("Label 2", 0, -1, Field.FIELD_RIGHT));
LabelField label = new LabelField("Label 3", 0, -1, Field.FIELD_HCENTER);
Font aturHuruf = this.getFont().derive(Font.BOLD | Font.ITALIC);
label.setFont(aturHuruf);
add(label);
add(new SeparatorField()); // pembatas
// Komponen UI untuk Contoh Pembuatan EditField
EditField editbox = new EditField("Username: ", "");
add(editbox);
// Komponen UI untuk Contoh Pembuatan PasswordEditField
PasswordEditField passwordbox = new PasswordEditField("Password: ", "");
add(passwordbox);
add(new SeparatorField()); // pembatas
// Komponen UI untuk Contoh Pembuatan BitmapField
Bitmap gambar = Bitmap.getBitmapResource("contohUI/com/res/1278536638_robot.png");
BitmapField tampgbr = new BitmapField(gambar, BitmapField.FOCUSABLE);
add(tampgbr);
add(new SeparatorField()); // pembatas
// Komponen UI untuk Contoh Pembuatan ButtonField
ButtonField tombol = new ButtonField("Tombol");
ButtonField tombol2 = new ButtonField("Tombol 2");
add(tombol);
add(tombol2);
public boolean onClose() {
Dialog.alert("Salam Hangat!");
System.exit(0);
return true;
}
}
Diatas adalah sebagian contoh-contoh penggunaan komponen UI, untuk lebih lanjut Anda bisa mengembangkannya lebih dalam lagi dengan mempelajari komponen UI secara lebih terperinci disini.
Terima kasih telah meluangkan waktu untuk membaca Artikel Saya.
Salam Hangat
Andre Siagian
iBNuX
Muhammad Hakim A
khalifahkelima
Blackberrydeveloper's Blog 
Komentar