quarta-feira, 9 de abril de 2008

Interfaces com Swing - Estilo MAC

A algum tempo comprei um Macbook e, acho que como a maioria dos Mac's users, a interface do sistema é simplesmente perfeita. Estou trabalhando em um projeto pequeno e estou brincando um pouco para conseguir algo parecido. A tela esta ficando assim:



Essa é a cara do iPhoto:



Você deve ter percebido que tirei esse screenshot no windows, ou seja, em qualquer plataforma ele vai parecer o mesmo. Tive que fazer alguns truques para conseguir essa cara, o principal dele foi a utilização de ButtonUI e PanelUI.

A arquitetura do Swing é algo muito interessante que pretendo falar mais no futuro. Basicamente o que temos que fazer para alterar a "cara" de um botão é desenvolvermos novos BottonUI ou implementar um novo JButton com a cara que você deseja.

O trecho de código abaixo é para a criação do botão metalizado.


public class BotaoAcaoTela extends JButton {

private static final long serialVersionUID = 1L;
private static final cor1 =
new Color(254, 254, 254);
private static final cor2 =
new Color(204, 204, 204);

public BotaoAcaoTela(Action acao) {
super(acao);
}

@Override
public void paint(Graphics g) {

Graphics2D g2 = (Graphics2D) g;

g2.setColor(new Color(235, 235, 235));
g2.drawRoundRect(0, 0, getWidth() - 1,
getHeight() - 1, 5, 5);

Paint p = g2.getPaint();
GradientPaint rgPaint =
new GradientPaint(0, 0,
cor1, 0, getHeight(), cor1);
g2.setColor(Color.WHITE);
g2.setPaint(rgPaint);
g2.fillRoundRect(0, 0, getWidth() - 1,
getHeight() - 2, 5, 5);
g2.setPaint(p);

g2.setColor(new Color(115, 115, 115));
g2.drawRoundRect(0, 0, getWidth() - 1,
getHeight() - 2, 5, 5);

String nome = getText();
Rectangle2D rec = g2.getFontMetrics().
getStringBounds(nome, g2);
float x = (float)
(getWidth() - rec.getWidth()) / 2f;
float y = (float) (getHeight() /2) + 5 ;

g2.setColor(Color.BLACK);
g2.drawString(nome, x, y);

//Verificando se o botão esta pressionado para
if (getModel().isArmed()
&& getModel().isPressed()){
AlphaComposite alpha = AlphaComposite.
getInstance(AlphaComposite.SRC_OVER, 0.4f);
g2.setComposite(alpha);
g2.setColor(Color.BLACK);
g2.fillRoundRect(0, 0, getWidth() - 1,
getHeight() - 2, 5, 5);
}

}


}



Logo logo eu publico aqui o macete para o fundo da barra dos botões e o botão lateral.

Um comentário: