Selasa, 14 April 2009

Let's Start to Rock Your Swing


yup seperti janji kemaren, postingan ini bercerita tentang extreem swing make over. inti dari swing make over ini adalah perubahan tampilan se extreem mungkin. yang memang jika seelumnya ada temen temen yang menggunakan bahasa pemograman lain spt delphi atau VB, sulit untuk mengobrak abrik tampilan, karena memang tidak sefleksible swing.
konsep ini sudah lama adanya, tp saya baru berani posting sekarang, soalnya baru ketemu rahasianya akhir akhir ini. jadi yang setelah sedikit tau, gak ada salahnya di share. (hehe kayak yang jago aja)
Yang harus di perhatikan dalam merubah tampilan dari Swing kita akan meng-override method paint(), atau painComponent(). karena kedua method inilah yang digunakan swing untuk membentuk tampilan.

Ok kita mulai.

pada postingan ini saya akan membuat gradienPanel, itu lho panel yang warna warni (he kayak pelangi aja).
pertama siapkan editor temen-temen. (kalau saya pake netbeans biar lebih asik soalnya lebih mudah digunakan nantinya).
Ok Copy pastekan aja Code ini:
__________________________________________________________________________
/*
* DILARANG MENGHAPUS ATAU MENGEDIT COPYRIGHT INI.
*
* Copyright 2009 Fiqri Tech
* All rights reserved.
*
* Semua isi dalam file ini adalah hak milik dari blackonta@gmail.com
* Anda tak diperkenankan untuk menggunakan file atau mengubah file ini
*
*/

package ovq.fiqri.lib.swing.plaf;

import java.awt.Color;
import java.awt.GradientPaint;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.LayoutManager;
import java.awt.event.ComponentEvent;
import java.awt.event.ComponentListener;
import java.awt.geom.Rectangle2D;
import java.awt.image.BufferedImage;
import javax.swing.JPanel;

/**
*
* @author Opik
*/
public class QGradienPanel extends JPanel{
private static final long serialVersionUID = -1;
private BufferedImage gradientImage;
private Color warnaAtas = new Color(204, 249, 124);
private Color warnaBawah = new Color(174, 222, 94);

public QGradienPanel(){
super();
this.setBorder(javax.swing.BorderFactory.createEmptyBorder(3,3,3,3));
}

public QGradienPanel(LayoutManager layout) {
super(layout);
addComponentListener(new GradientCacheManager());
}

public Color getWarnaAtas() {
return warnaAtas;
}

public void setWarnaAtas(Color warnaAtas) {
this.warnaAtas = warnaAtas;
}

public Color getWarnaBawah() {
return warnaBawah;
}

public void setWarnaBawah(Color warnaBawah) {
this.warnaBawah = warnaBawah;
}

@Override
protected void paintComponent(Graphics g) {
createImageCache();
if (gradientImage != null) {
g.drawImage(gradientImage, 0, 0, getWidth(), getHeight(), null);
}
}

protected void createImageCache() {
int width = 2;
int height = getHeight();

if (width == 0 || height == 0) {
return;
}

if (gradientImage == null ||
width != gradientImage.getWidth() ||
height != gradientImage.getHeight()) {

gradientImage = new BufferedImage(width, height,
BufferedImage.TYPE_INT_RGB);

Graphics2D g2 = gradientImage.createGraphics();
GradientPaint painter = new GradientPaint(0, 0, warnaBawah,
0, height / 2, warnaAtas);
g2.setPaint(painter);

Rectangle2D rect = new Rectangle2D.Double(0, 0, width, height / 2.0);
g2.fill(rect);

painter = new GradientPaint(0, height / 2, warnaAtas,
0, height, warnaBawah);
g2.setPaint(painter);

rect = new Rectangle2D.Double(0, (height / 2.0) - 1.0, width, height);
g2.fill(rect);

g2.dispose();
}
}

private void disposeImageCache() {
synchronized (gradientImage) {
gradientImage.flush();
gradientImage = null;
}
}

private class GradientCacheManager implements ComponentListener {
public void componentResized(ComponentEvent e) {
}

public void componentMoved(ComponentEvent e) {
}

public void componentShown(ComponentEvent e) {
}

public void componentHidden(ComponentEvent e) {
disposeImageCache();
}
}
}
__________________________________________________________________________

nah perhatikan kode pada method paintComponent() diatas, Abaikan saja kode ini
if (gradientImage != null) {
g.drawImage(gradientImage, 0, 0, getWidth(), getHeight(), null);
}
}
soalnya itu dibuat kalau nantu temen temen ingin menggunakan gambar sebagai backgroundnya.
jadi backgroundnya akan dibuat menggunakan warna gradien antara warnaatas, dan warnaBawah.

Jadi ya hasilnya kurang lebih seperti ini:


nah kalau temen-temen pake netbeans, untuk penggunaannya tinggal drag class diaas ke JPanel, Jframe atau ke JDialog.


nah perhatikan pada propertiesnya maka akan ditambahkan dua properties sebagai berikut.



jadi kayak gini deh:

jadi tinggal dirubah saja warnanya sesuai dengan keinginan. ok moga bermanfaan n keep creative. Koment ya......
Digg Google Bookmarks reddit Mixx StumbleUpon Technorati Yahoo! Buzz DesignFloat Delicious BlinkList Furl

19 komentar: on "Let's Start to Rock Your Swing"

Mr. SKHAI mengatakan...

wah,.. mas bagus tutorialnya,.. pa lgi skarang lgi rame2nya bicarain tntang swing make over,... tutorialnya bermanfaat nih mas,.. tpi jgn smpe sini z tutornya mas,.. posting lagi yang baru,.. he.he.. hidup java....

Mr. SKHAI mengatakan...

mas mo nanya,.. bisa ga' klo di java, kita manggil table yang ada di frame lain, trus kita doubleklik di table frame tadi, trus data yang ada dlm frame lain tadi masuk ke jtextfield frame yang sedang kita jalankan... mis: frame A trdapat jtextfield(kd_mhs), kita mau ngambil kd_mhs ini dari table yang terdapat pada frame B, kita klik dua kali pada data Kd_mhs yang ada pada table frame B itu, dan data Kd_mhs itu masuk ke jTextfield yang ada pada frame A tadi. tulung posting tutorialnya y mas... thank..

Black Onta mengatakan...

2mrSKHI
Bisa bisa aja, pertama buat dulu method setter public di frame A (Di Frame yang ada Texte field, mis:

public void setKodeMhs(String kd){
jTestField1.setText(kd);
}

nah dari frame yang kedua(Frame yang ada Table) buat method untuk mengambil data dari table, mis:
public String getDataTable(){
return _ISI_TABLE;
}

langkah terakhir, set data yang di dapat dari method getDataTable()ke method public pada frame yang pertama.
mis:

private void setFrameAField(){
FrameA.setKodeMhs( getDataTable() );
}

mudah kan? Keep Trying Brow

Mr. SKHAI mengatakan...

sblmnya mkasih y mas utk jwabannya,.. tp bleh nanya lagi kan, soalnya blm begitu ngerti,.. maklum udah tua jd agak susah nangkepnya. he.he.he.. pas saya coba tes, terjadi error pada pembuatan method utk jTable di framebnya,:

public String getDataTable(){
return no_bp;
}

katanya : cannot find symbol variable no_bp. trus sya rubah methodnya jadi :

public String getDataTable(String no_bp){
return no_bp;
}

errornya hilang. tp,.. pas pemanggilan method terakhir, terjadi error lagi. katanya :

private void setNilaiFKGField(String NilaiFKG){
NilaiFKG.setno_bp(getDataTable);
}

cannot find symbol no_bp dan symbol getDataTable. bsa dijelasin lebih detail ga' mas caranya, atau mungkin ada contoh programnya yang pernah mas posting.

o y mas pertanyaan kmarin ada yg klupaan. pada frameA yg ada textfield1-nya ada tombol buttonnya,.. jadi pas pertama running programnya, tombol buttonnya di tekan. setelah ditekan, akan keluar jTable frameB berserta isinya, selanjutnya di klik isinya, isi table frameB tersebut baru masuk ke textField frameA. maaf y mas kepanjangan pertanyaanya,.. makasih..

Black Onta mengatakan...

Mr. SKHAI Pertanyaanya dah di bahas tuh di http://onta-programing.blogspot.com/2009/04/komunikasi-data-antar-class-di-java.html moga bermanfaat ya, klo dah berhasil Commentya

Mr. SKHAI mengatakan...

o y brow,.. lupa buat koment grafik 2D javanya,... makasih y brow, skarang frame javaku, udh lumayan bagus,.. ada dua warna,..he.he.he... tp brow, klo utk tmpilan bingkainya bisa ga' di modifikasi??,.. kyk make nimbuslookinfeel,.pkoknya ga' tau lah nma aslinya.wkwkwkwk...^_^

Black Onta mengatakan...

Bisa bisa aja, intinya kan sama aja, Modifikasi ^_^, OK keep trying

Anonim mengatakan...

katanya gak boleh di modifikasi COPYRIGTH ,jadi ngapain di posting kecewa saya :(

Anonim mengatakan...

salam,,,
mau nanya nih, knp setelah sy tambahin dframe, trus diatas panel saya add button, texfield ko tampilan nya gak sesuai sih?
(button gak ada tulisan, label gak keliatan, textfield ukuran kecil)
apakah ada setting lain klo mau dipake bwt nampung komponent lain?
mohon penjelasannya ?
,,,

Black Onta mengatakan...

Buat Yang kecewanih ceritanya hehehe, source code yang dibuat adalah hanya sebagai panduan brow jadi dengan di-tidak bolehkannya dirubah saya harap temen temen bisaa membuat class, component, or aplikasi baru yang lebih kreatif ya gak :). so enjoy ajaa.

nah buat brow yanag satu lagi nih yang gak mau ngasih tau namanya, panel pada postingan yang satu ini bisa buat nampung komponen koq. dan hasilnya fine-fine aja koq. perlu bukti? coba lihat Gambar Ini Swing Makeover Demo By Ovq. idi dibuat dengan kode diatas, coba deh periksa lagi. Moga bermanfaat....

Pramudya Ilham mengatakan...

hallo mas,aku baru belajar soal java.
salam, aku udah coba swing make over ini, bagaimana cara untuk nambahin image ke framenya ?, kenapa juga bordernya tetep tebal ya padahal sudah saya rubah ke 1, terima kasih sebelumnya
salam

dShaka mengatakan...

keren keren keren,
nice tutor Om,,, oya, itu kan bentuknya panel ya? kalo dibuat desktopPane gimana?

wise_sunshine mengatakan...

Bingung gimana cara membuat kelas ini di drag ke JPanel, JFrame dkk? Mohon jawabannya ke ayip.eiger@gmail.com

Anonim mengatakan...

mas bingung cara ngedragkn nya ke Jpanel, jframe, dll..? di pos di sini ja mas..hehe :D

Anonim mengatakan...

wise_sunshine tinggal di drag aja kedalam jframe ato jpanel yg telh kita create.. tapi sblumnya di clean n build dahulu

loekman mengatakan...

mas itu memang nggak ada method mainx ya.., trus cra makainya gimana..?? maaf bru blajar java nich.... trma kasih.

andries mengatakan...

mas, aku baru mulai belajar program, gimana cara membuat tulisan di samping logo java pada jframe?? aku dah coba tapi gk pernah bisa. thx