Mengenal layout lebih dekat :)


Untuk postingan kali ini saya bakal bahas tentang Layout pada Java GUI. Dulu, pas dapet kuliah yang membahas ini masih sedikit ada ketidakpuasan saya tentang layout yang disediain di Java (Border Layout, Gridbag, Card Layout, dan yang lainnya). Saya menginginkan layout yang dapat menumpuk panel layaknya CardLayout namun panel yang lainnya juga dapat terlihat, karena dalam project yang saya buat sekarang, saya telah membuat Animated Panel sebagai background dan panel lain yang berisi komponen-komponen.Ā  Kalau hanya menampilkan 2 panel sekaligus mungkin ngga masalah, cukup buat CardLayout,Panel 1 sebagai gradian panel, kemudian buat panel transparan sehingga panel yang dibawahnya menjadi backgroundnya, namun bagaimana jika kita melibatkan lebih dari 2 panel dan ditampilkan secara bersamaan dalam 1 panel. Maka yang dapat kita lakukan, yaitu dengan cara membuat Class baru yang mengimplementasikan Class LayoutManager2, yang juga merupakan extend dari LayoutManager (bisa dilihat di Java Doc-nya)
Class yang akan kita buat sebut saja namanya StackLayout, yang nanti akan implement terhadap LayoutManager2

public class StackLayout implements LayoutManager2{ public static final String BOTTOM = "bottom"; public static final String TOP = "top";
private List components = new LinkedList();
@Override public void addLayoutComponent(Component comp, Object constraints) { synchronized (comp.getTreeLock()) { if (BOTTOM.equals(constraints)) { components.add(0, comp); } else if (TOP.equals(constraints)) { components.add(comp); } else { components.add(comp); } }
}
@Override public Dimension maximumLayoutSize(Container target) { return new Dimension(Integer.MAX_VALUE, Integer.MAX_VALUE); }
@Override public float getLayoutAlignmentX(Container target) { return 0.5f; }
@Override public float getLayoutAlignmentY(Container target) { return 0.5f; }
@Override public void invalidateLayout(Container target) {}
@Override public void addLayoutComponent(String name, Component comp) { addLayoutComponent(comp, TOP); }
@Override public void removeLayoutComponent(Component comp) { synchronized (comp.getTreeLock()) { components.remove(comp); } }
@Override public Dimension preferredLayoutSize(Container parent) { synchronized (parent.getTreeLock()) { int width = 0; int height = 0;
for (Component comp: components) { Dimension size = comp.getPreferredSize(); width = Math.max(size.width, width); height = Math.max(size.height, height); }
Insets insets = parent.getInsets(); width += insets.left + insets.right; height += insets.top + insets.bottom;
return new Dimension(width, height); } }
@Override public Dimension minimumLayoutSize(Container parent) { synchronized (parent.getTreeLock()) { int width = 0; int height = 0;
for (Component comp: components) { Dimension size = comp.getMinimumSize(); width = Math.max(size.width, width); height = Math.max(size.height, height); }
Insets insets = parent.getInsets(); width += insets.left + insets.right; height += insets.top + insets.bottom;
return new Dimension(width, height); } }
@Override public void layoutContainer(Container parent) { synchronized (parent.getTreeLock()) { int width = parent.getWidth(); int height = parent.getHeight();
Rectangle bounds = new Rectangle(0, 0, width, height);
int componentsCount = components.size();
for (int i = 0; i < componentsCount; i++) { Component comp = components.get(i); comp.setBounds(bounds); parent.setComponentZOrder(comp, componentsCount - i - 1); } } }

Nah, method yang penting untuk dilakukan override yaitu method

addLayoutComponent(Component comp, Object constraints)

dan

layoutContainer(Container parent)

Lalu bagaimana cara menggunakannya, cukup mudah. Misalkan kita punya 3 punya JPanel yg akan ditampilkan, kita buat suatu method yang nanti akan diletakkan dalam constuctor JFrame, misalnya seperti ini..

private void buildContentPane() { JPanel pane = new JPanel(); pane.setLayout(new StackLayout());
GradientPanel gradient = new GradientPanel(); chooser = new AvatarChooser(); curves = new CurvesPanel();
pane.add(gradient, StackLayout.TOP); pane.add(chooser, StackLayout.TOP); pane.add(curves, StackLayout.TOP);
add(pane); }

Kemudian panggil method buildContentPane() tersebut pada constructornya.. šŸ™‚
Namun yang perlu diingat, hal yang paling penting adalah letak

StackLayout.TOP atau StackLayout.BOTTOM

yang digunakan harus sesuai dan pastikan constraint yang dibuat sesuai. Happy coding.. šŸ™‚

Leave a Reply

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 )

Connecting to %s