Membuat efek tulisan pada komponen TextField (Placeholder) di Java

Untuk menambah daya tarik pada aplikasi java yang kita buat, perlu di tambahkan komponen-komponen lain. salah satunya adalah penambahan detail pada komponen java yang kita pakai. memang saat ini sudah banyak library yang menyediakan class yang kita butuhkan untuk mempercantik tampilan kita (contohnya SwingX). Tapi tidak ada salahnya jika kita membuat sendiri elemen-elemen tersebut agar bisa di modifikasi dan disesuaikan dengan kebutuhan kita.

Salah satunya dalah Place holder (entah nama ini benar atau tidak hehe) kalau salah silahkan diingatkan. placeholder yang saya maksud adalah tulisan pada bagian tengan komponen TextField. berikut contohnya:

Nah bagai mana cara membuat efek tulisan tersebut di komponen TextField java?. idenya sih sederhana kita bisa meng-overide method paint() kemudian menggunakan method drawString().
Oke ini dia kodenya:

Font font = getFont().deriveFont(Font.BOLD).deriveFont(Font.ITALIC);
Graphics2D g2d = (Graphics2D) g;
FontMetrics fontMetrics = g2d.getFontMetrics(font);
g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
RenderingHints.VALUE_ANTIALIAS_ON);
g2d.setColor(Color.GRAY);
g2d.setFont(font);
java.awt.geom.Rectangle2D rect = fontMetrics.getStringBounds("TEXT YANG DIINGINKAN", g2d);
int textHeight = (int) rect.getHeight();
g2d.drawString("TEXT YANG DIINGINKAN", 5, textHeight + 3);

Tapi kalo di perhatikan, ketika kita mengetikan sesuatu maka efek tulisan itu harus hilang, karena jika tetap muncul maka akan mengganggu tampilan teks yang ada maka di dalam fungsi paint tesebut kita perlu menambahkan sebuah kondidi. jadi kodenya di ubah menjadi sebagai berikut:

if ((new String(getPassword())).trim().equals("")) {
Font font = getFont().deriveFont(Font.BOLD).deriveFont(Font.ITALIC);
Graphics2D g2d = (Graphics2D) g;
FontMetrics fontMetrics = g2d.getFontMetrics(font);
g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
RenderingHints.VALUE_ANTIALIAS_ON);
g2d.setColor(Color.GRAY);  
g2d.setFont(font);         
java.awt.geom.Rectangle2D rect = fontMetrics.getStringBounds("TEXT YANG
DIINGINKAN", g2d);
int textHeight = (int) rect.getHeight();
g2d.drawString("TEXT YANG DIINGINKAN", 5, textHeight + 3);
}

Bingung?, oke berikut kode lengkapnya supaya tidak bingung.

/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
package javadanphp.swing;

import java.awt.Color;
import java.awt.Font;
import java.awt.FontMetrics;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.RenderingHints;
import java.awt.event.KeyAdapter;
import java.awt.event.KeyEvent;
import javax.swing.JTextField;
import javax.swing.text.Document;



/**
 *
 * @author Taopik Ridwan
 */

public class CustomTextField extends JTextField {

private String placeholder = "Masukan Teks";

    public CustomTextField() {

       
initListener();

    }



    public CustomTextField(String text) {

       
super(text);

       
initListener();

    }



    public CustomTextField(int columns) {

       
super(columns);

       
initListener();

    }



    public CustomTextField(String text, int
columns) {

       
super(text, columns);

       
initListener();

    }
    

public CustomTextField(Document doc,
String text, int columns) {

       
super(doc, text, columns);

       
initListener();

    }



    private void initListener() {

       
addKeyListener(new KeyAdapter() {

           
@Override

           
public void keyPressed(KeyEvent e) {

               
super.keyPressed(e);

               
repaint();

           
}

       
});

    }



    public String getPlaceholder() {

       
return placeholder;

    }



    public void setPlaceholder(String
placeholder) {

       
this.placeholder = placeholder;

        repaint();

    }



    @Override

    protected void paintComponent(Graphics
g) {

       
super.paintComponent(g);

       

       
if (getText().trim().equals("")) {
Font font = getFont().deriveFont(Font.BOLD).deriveFont(Font.ITALIC);



           
Graphics2D g2d = (Graphics2D) g;

 
FontMetrics fontMetrics = g2d.getFontMetrics(font);

g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
RenderingHints.VALUE_ANTIALIAS_ON);

g2d.setColor(Color.GRAY);

g2d.setFont(font);



java.awt.geom.Rectangle2D rect =
fontMetrics.getStringBounds(placeholder, g2d);

int textHeight = (int) rect.getHeight();

g2d.drawString(placeholder, 5, textHeight + 3);

}

}

}

Ini dia Hasilnya:

Jika agan-agan sekalian menggunakan Netbeans, maka jika akan menggunakan komponen tadi, kita tinggal Drag and drop saja.

Selain itu untuk merubah tulisannya kita tinggal melakukannnya di panel Properties

Silahkan Di Download Kode Sumbernya (Dibuat menggunakan Netbeans 7.2)