Tuesday, January 13, 2009

Swing Layout in Action



Rehat dulu ah dari bahas games engineering, capek... refreshing dulu..., kemaren lagi iseng2 main2 layout swing sambil nginget2 sama mau optimasi dengan layout2 yang ada di java, enaknya sih emang klo kita pake visual swing desainer kayak punyanya netbeans tiggal drag n drop (what you see is what you get) tapi ga papalah buat iseng2 main2 layout biar ngerti konsep layout. sebenarnya java awt punya beberapa layout sebagai berikut:
  • CardLayout ---> Merupakan model seperti stack kartu yang dapat ditampilkan secara berurutan biasanya diaplikasikan pada waktu kita ingin membuat model interface seperti wizard2 atau model interface seperti kalo kita menginstall applikasi dengan next/previous.
  • BorderLayout ---> Akan membagi area menjadi 5 wilayah yaitu North, West, East, South, dan Center.
  • FlowLayout ---> FlowLayout merupakan default layout yang digunakan oleh swing, layout ini akan menampilkan komponen secara berurutan dari kiri ke kanan.
  • GridLayout ---> GridLayout merupakan layout yang akan membagi sebuah frama/panel kedalam baris dan kolom dengan ukuran yang sama. Misalnya ketika kita ingin membuat tombol2 kalkulator dengan ukuran tombol yang sama.
  • GridBagLayout ---> Layout yang sangat fleksibel yang akan membagi area menjadi grid2 sehingga komponen dapat ditempatkan secara fleksibel, dalam tulisan ini kita akan memanfaatkan layout ini.
  • GroupLayout ---> Layout yang fleksibel yang dipakai oleh netbeans dan dikembangkan oleh third party yaitu apache.

Oke dalam tulisan ini akan dibatasi untuk membahas GridbagLayout, karena layout ini cukup menarik untuk dibahas sedangkan untuk layout2 yang lain bisa tutorialnya di situs resminya java atau resource2 yang lain.

Untuk membuat layout ini cukup simple kita bisa mengkonstruksi dengan :
GridBagLayout gbl = new GridBagLayout();
kemudian dari situ kita bisa melakukan set layout pada JFrame/JPanel yang akan kita gunakan cukup menambahkan object gbl pada parameter, misalnya:
JFrame frame = new JFrame(); // jika layout diimplementasikan pada JFrame
frame.serLayout(gbl);
JPanel panel = new JPanel(); // jika layout diimplementasikan pada JPanel
panel.setLayout(gbl);
Untuk mengatur tataletak komponen tadi pada frame/panel kita memanfaatkan GridBagConstraints, class ini mempunyai properti2 yang penting untuk mengatur tataletak sebagai berikut :
*Note: properti dibawah ini diassignkan dengan nilai defaultnya
  • fill = GridBagConstrains.NONE; ----> properti ini digunakan untuk setting arah resize dari komponen, Nilainya bisa GridBagConstrains.NONE, GridBagConstrains.HORIZONTAL, dan GridBagConstrains.VERTICAL
  • gridx = GridBagConstrains.CENTER; ----> untuk meletakkan komponen pada grid tertentu terhadap posisi x
  • gridy = GridBagConstrains.RELATIVE; ----> untuk meletakkan komponen pada grid tertentu pada posisi y
  • gridheight = 1; ----> untuk menentukan span yang digunakan oleh komponen, misalkan kita isi dengan nilai 2 berarti komponen akan menempati area sebesar 2 grid searah sumbu y
  • gridwidth = 1; ----> sama seperti gridheight hanya saja span gridnya searah sumbu x
  • insets = new Insets(0, 0, 0, 0); ----> digunakan untuk menentukan jarak antar komponen Insets(top, left, bottom, right)
  • ipadx = 0; ----> digunakan untuk menentukan padding dari dalam komponen searah sumbu x
  • ipady = 0; ----> digunakan untuk menentukan padding dari dalam komponen searah sumbu y
  • weightx = 0; ----> digunakan untuk menentukan ukuran maksimum resize dari komponen searah sumbu x
  • weighty = 0; ----> digunakan untuk menentukan ukuran maksimum resize dari komponen searah sumbu x
  • anchor = GridBagConstrains.CENTER; digunakan untuk menentukan perataan letak komponen, bisa CENTER, EAST, WEST, SOUTH, NORTH ...
Untuk memyederhanakan dalam pembuatan GridBagConstrains yang digunakan, saya membuat class GBCHelper.java yang merupakan subclass dari GridBagCondtrains sehingga kita cukup menggunaka sekali konstruksi object GridBagConstrains untuk semua komponen, listing programnya sebagai berikut:
package brain.left.swingtest;

import java.awt.GridBagConstraints;
import java.awt.Insets;

/**
* This class for simplifies using GridbagConstrains copyleft by amru rosyada,
* you can redistribute with any change to this code license GPLV3
*
* @version = 1.00 12 Jan 2009
* @author amru rosyada, amrurosyada.blogspot.com, taka86[AT]gmail.com
*/

public class GBCHelper extends GridBagConstraints {
private static final long serialVersionUID = 582260222458228387L;

public GBCHelper() {

}

/**
* Set GridbagConstrains to default value
*/
public GBCHelper clear() {
this.fill = GBCHelper.NONE;
this.gridx = GBCHelper.CENTER;
this.gridy = GBCHelper.RELATIVE;
this.gridheight = 1;
this.gridwidth = 1;
this.insets = new Insets(0, 0, 0, 0);
this.ipadx = 0;
this.ipady = 0;
this.weightx = 0;
this.weighty = 0;
this.anchor = GBCHelper.CENTER;
return this;
}

/**
* set gridy gridx position
*
* @param gridx
* set gridx position
* @param gridy
* set gridy position
*/
public GBCHelper setGrid(int gridx, int gridy) {
this.gridx = gridx;
this.gridy = gridy;
return this;
}

/**
* Sets the fill direction.
*
* @param fill
* the fill direction
* @return this object for further modification
*/
public GBCHelper setFill(int fill) {
this.fill = fill;
return this;
}

/**
* set value for gridx, gridy, gridwidth, gridheight
*
* @param gridx
* the gridx position
* @param gridy
* the gridy position
* @param gridwidth
* the cell span in x-direction
* @param gridheight
* the cell span in y-direction
*/
public GBCHelper setGrid(int gridx, int gridy, int gridwidth, int gridheight) {
this.gridx = gridx;
this.gridy = gridy;
this.gridwidth = gridwidth;
this.gridheight = gridheight;
return this;
}

/**
* Sets the insets of this cell.
*
* @param distance
* the spacing to use in all directions
* @return this object for further modification
*/
public GBCHelper setInsets(int distance) {
this.insets = new Insets(distance, distance, distance, distance);
return this;
}

/**
* Sets the insets of this cell.
*
* @param top
* the spacing to use on top
* @param left
* the spacing to use to the left
* @param bottom
* the spacing to use on the bottom
* @param right
* the spacing to use to the right
* @return this object for further modification
*/
public GBCHelper setInsets(int top, int left, int bottom, int right) {
this.insets = new Insets(top, left, bottom, right);
return this;
}

/**
* Sets the internal padding
*
* @param ipadx
* the internal padding in x-direction
* @param ipady
* the internal padding in y-direction
* @return this object for further modification
*/
public GBCHelper setIpad(int ipadx, int ipady) {
this.ipadx = ipadx;
this.ipady = ipady;
return this;
}

/**
* Sets the anchor.
*
* @param anchor
* the anchor value
* @return this object for further modification
*/
public GBCHelper setAnchor(int anchor) {
this.anchor = anchor;
return this;
}

/**
* Sets the cell weights.
*
* @param weightx
* the cell weight in x-direction
* @param weighty
* the cell weight in y-direction
* @return this object for further modification
*/
public GBCHelper setWeight(double weightx, double weighty) {
this.weightx = weightx;
this.weighty = weighty;
return this;
}
}

Pada listing GBCHelper diatas telah terdokumentasikan setiap methodnya, perlu dicatat untuk setiap kali kita akan menggunakan kembali object ini harus memanggil terlebih dahulu method clear() sebelum method yang lain, sekarang kita akan buat class GridBagTester.java untuk melakukan tes menggunakan class GBCHelper. Listing programnya sebagai berikut :
package brain.left.swingtest;

import java.awt.EventQueue;
import java.awt.GridBagLayout;

import javax.swing.BorderFactory;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JScrollPane;
import javax.swing.JTextArea;
import javax.swing.JTextField;
import javax.swing.border.Border;
import javax.swing.border.SoftBevelBorder;

public class GridbagTester extends JFrame {
/**
*
*/
private static final long serialVersionUID = -2094745569627207471L;
private JPanel panel = new JPanel();
private JLabel label1 = new JLabel("Label 1");
private JTextField jtext1 = new JTextField(20);
private JLabel label2 = new JLabel("Label 2");
private JTextField jtext2 = new JTextField(20);
private JButton button1 = new JButton("Tombol 1");
private GBCHelper GBCH = new GBCHelper();
private JTextArea jta = new JTextArea();
JScrollPane pane = new JScrollPane(jta);

public GridbagTester() {
jta.setRows(5);
Border br = BorderFactory.createBevelBorder(SoftBevelBorder.LOWERED);
panel.setBorder(br);
panel.setLayout(new GridBagLayout());
//menambahkan komponen pada layout
//jangan lupa untuk memanggil method clear sebelum method2 yang lain
panel.add(label1, GBCH.clear().setGrid(0, 0).setAnchor(GBCHelper.EAST));
panel.add(jtext1, GBCH.clear().setGrid(1, 0).setFill(
GBCHelper.HORIZONTAL).setInsets(1, 5, 2, 1));
panel.add(label2, GBCH.clear().setGrid(0, 1).setAnchor(GBCHelper.EAST));
panel.add(jtext2, GBCH.clear().setGrid(1, 1).setFill(
GBCHelper.HORIZONTAL).setInsets(1, 5, 2, 1));
panel.add(pane, GBCH.clear().setGrid(0, 3, 4, 1).setAnchor(
GBCHelper.WEST).setFill(GBCHelper.BOTH));
panel.add(button1, GBCH.clear().setGrid(1, 4).setAnchor(GBCHelper.EAST)
.setInsets(10, 1, 5, 2));
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
add(panel);
pack();
setVisible(true);
}

public static void main(String[] args) {
EventQueue.invokeLater(new Runnable() {

@Override
public void run() {
new GridbagTester();
}

});
}
}


screenshoot hasil running programmnya sebagai berikut :



oke done!

6 comments:

  1. urip pisan kok gur digae mumet ae

    ReplyDelete
  2. wow,
    bagaimana cara menjadikan program yang telah dibuat di visualbasic hingga menjadi program yang stand alone, alias tinggal klik kemudian instal.
    terima kasih

    ReplyDelete
  3. @tantos
    yo mergo mung pisan kui digawe angel.... halah

    ReplyDelete
  4. @pengendara
    mas pengendara kalo di vb6.0, saya dapet dari milis2 kita bisa buat dengan cara sebagai berikut, karena saya juga tidak pernah memakai visualbasic :D :

    follow the following steps to create the installer for ur project. but before trying this make sure that u have created the executable(.exe) for ur project. hope u know how to create that.

    1.close ms vb6.0 ide

    2.click start>-programs->microsoft visual studio 6.0->microsoft visual studio 6.0 tools->package and deployment wizard

    3.click browse to locate ur project file(.vbp)

    4.click package

    5.click yes to start the recompilation process

    6.in package type select standard setup package and click next

    7.select the destination where u want to create the package folder for ur project.this folder will contain all the supported and main application files required to install ur apps in some other client machine.

    8.click yes to create the folder if it doesn't exist and click next
    9.the next list that will come will display all necessary files to build the setup.click add to insert some other files from ur project to the said list.if u any access database file,click this button,locate ur db file and click open to add the file to the list.this list will also help u to remove any unnecessary files that u donot wish to install in the target machine with apps.u can also add help files(if any) for project from this option.but do not ever try to remove the .dll,.ocx,.lib or .exe files.click next

    10.if u want ur setup becomes a standalone package select single cab otherwise if u want part installer then select multiple cab.if u select the 2nd option u have mention the size of the floppy disks.then the wizard will ask u insert the floppies one after another.i will recommend u not to use this option.click next
    (if u see any shared files box or dependency information box just skip that)

    11.insert a title for the installer and click next

    12.in the next screen adjust the menu apperance the setup will create for u.this will become the startmenu shortcuts for ur apps.

    13.click next->click next

    14.in the script name box u do not require to enter anything but do not erase the default text.

    15.click finish to build the installer.

    16.click close->click close

    *mungkin itu bisa membantu, terimakasih

    ReplyDelete
  5. Ntu pakek netbean apa notepad sing jadi editornya...netbean ternyata berat sangat...mendingan pake visual studio (salah pembanding yow)

    ReplyDelete
  6. @adi
    ini pake vim eclipse pakde...
    hahaha disini dilarang sebut merek.... halah....

    ReplyDelete