java 伸缩面板实现_Swing UI - 可收起与开展内容面板实现演示

基于JAVA Swing实现的自定义组件可折叠的JPanel组件

基本思想：

可折叠面板，分为两个部分-头部面板与内容面板

头部面板– 显示标题，以及对应的icon图标，监听鼠标事件决定内容面板隐藏或者显示

内容面板– 普通的JPanel组件。

实现：

头部面板：

package com.gloomyfish.ui.demo;

import java.awt.BorderLayout;

import java.awt.Color;

import java.awt.Dimension;

import java.awt.Font;

import java.awt.GradientPaint;

import java.awt.Graphics;

import java.awt.Graphics2D;

import java.awt.RenderingHints;

import java.awt.image.BufferedImage;

import java.io.IOException;

import javax.imageio.ImageIO;

import javax.swing.JFrame;

import javax.swing.JPanel;

public class HeaderPanel extends JPanel {

/**

*

*/

private static final long serialVersionUID = 1L;

private int height = 50;

private Color bgColor;

private boolean isShow;

private String title;

public void setShow(boolean isShow) {

this.isShow = isShow;

}

public void setTitle(String title)

{

this.title = title;

}

@Override

protected void paintComponent(Graphics g) {

Graphics2D g2d = (Graphics2D) g.create();

g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING,

RenderingHints.VALUE_ANTIALIAS_ON);

BufferedImage panelImage = createPanelImage();

g2d.drawImage(panelImage, null, 0, 0);

}

private BufferedImage createPanelImage() {

BufferedImage panelImage = new BufferedImage(getWidth(), height, BufferedImage.TYPE_INT_ARGB);

Graphics2D g2d = panelImage.createGraphics();

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

g2d.setRenderingHint(java.awt.RenderingHints.KEY_TEXT_ANTIALIASING,java.awt.RenderingHints.VALUE_TEXT_ANTIALIAS_ON);

int width = getWidth();

g2d.setPaint(bgColor);

g2d.fillRect(0, 0, width, height);

GradientPaint gradientPaint = new GradientPaint(0, height/2, Color.LIGHT_GRAY, 0, height, Color.DARK_GRAY);

g2d.setPaint(gradientPaint);

g2d.fillRect(0, height/2, width, height/2);

java.net.URL imageURL = null;

if(this.isShow)

{

imageURL = this.getClass().getResource("arrow-up-icon.png");

}

else

{

imageURL = this.getClass().getResource("arrow-down-icon.png");

}

java.net.URL titleIconURL = this.getClass().getResource("user.png"); //gallery_5.png

g2d.setFont(new Font("Serif", Font.BOLD, 24));

g2d.setPaint(Color.WHITE);

g2d.drawString(this.title, width/2-40, height-5);

try {

g2d.fillArc(width - 42, this.height/2, this.height/2, this.height/2, 0, 360);

g2d.drawImage(ImageIO.read(imageURL), null, width - 42, this.height/2+2);

g2d.drawImage(ImageIO.read(titleIconURL), null, 20, 5);

} catch (IOException e) {

System.err.println("An error occured when loading the image icon...");

}

return panelImage;

}

public void setHeight(int height) {

this.height = height;

}

public void setBgColor(Color bgColor) {

this.bgColor = bgColor;

}

@Override

public Dimension getPreferredSize() {

return new Dimension(this.getWidth(), height);

}

@Override

public Dimension getSize() {

return new Dimension(this.getWidth(), height);

}

public HeaderPanel(Color bgColor) {

this.bgColor = bgColor;

this.isShow = true;

}

public HeaderPanel(Color bgColor, String title) {

this(bgColor);

this.title = title;

}

public static void main(String[] args)

{

JFrame mainFrame = new JFrame("UI Demo - Gloomyfish");

mainFrame.getContentPane().setLayout(new BorderLayout());

mainFrame.getContentPane().add(new HeaderPanel(Color.BLACK), BorderLayout.CENTER);

mainFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

mainFrame.pack();

mainFrame.setVisible(true);

}

}

内容面板：

package com.gloomyfish.ui.demo;

import java.awt.BorderLayout;

import java.awt.Color;

import java.awt.FlowLayout;

import java.awt.GridLayout;

import javax.swing.BorderFactory;

import javax.swing.JButton;

import javax.swing.JLabel;

import javax.swing.JPanel;

import javax.swing.JTextField;

public class ContentPanel extends JPanel {

/**

*

*/

private static final long serialVersionUID = 1L;

public ContentPanel(Color theme)

{

this.setBorder(BorderFactory.createLineBorder(theme, 5));

}

public void createContent()

{

JPanel userPanel = new JPanel(new GridLayout(2,2));

userPanel.setBorder(BorderFactory.createEmptyBorder(5, 5, 5, 5));

userPanel.add(new JLabel("用户名："));

JTextField txtField = new JTextField("", 10);

userPanel.add(txtField);

userPanel.add(new JLabel("密码："));

JTextField pwdField = new JTextField("", 10);

userPanel.add(pwdField);

JButton okeBtn = new JButton("OK");

JButton cancelBtn = new JButton("Cancel");

JPanel btnPanel = new JPanel();

btnPanel.setLayout(new FlowLayout(FlowLayout.RIGHT));

btnPanel.add(okeBtn);

btnPanel.add(cancelBtn);

this.setLayout(new BorderLayout());

this.add(userPanel, BorderLayout.CENTER);

this.add(btnPanel, BorderLayout.SOUTH);

}

}

可折叠面板：

package com.gloomyfish.ui.demo;

import java.awt.BorderLayout;

import java.awt.Color;

import java.awt.GridBagConstraints;

import java.awt.GridBagLayout;

import java.awt.Insets;

import java.awt.event.MouseAdapter;

import java.awt.event.MouseEvent;

import javax.swing.JFrame;

import javax.swing.JPanel;

public class JExpandablePanel extends JPanel{

/**

*

*/

private static final long serialVersionUID = 1L;

private HeaderPanel headerPanel;

private ContentPanel contentPanel;

public JExpandablePanel()

{

super();

initComponents();

}

private void initComponents() {

this.setLayout(new BorderLayout());

Color theme = Color.BLACK;

headerPanel = new HeaderPanel(theme, "欢迎登录");

headerPanel.addMouseListener(new PanelAction());

contentPanel = new ContentPanel(theme);

contentPanel.createContent();

this.add(headerPanel, BorderLayout.NORTH);

this.add(contentPanel, BorderLayout.CENTER);

setOpaque(false);

}

class PanelAction extends MouseAdapter

{

public void mousePressed(MouseEvent e)

{

HeaderPanel hp = (HeaderPanel)e.getSource();

if(contentPanel.isShowing())

{

contentPanel.setVisible(false);

hp.setShow(false);

}

else

{

contentPanel.setVisible(true);

hp.setShow(true);

}

hp.getParent().validate();

hp.getParent().repaint();

}

}

public static void main(String[] args)

{

JFrame mainFrame = new JFrame("UI Demo - Gloomyfish");

mainFrame.getContentPane().setLayout(new BorderLayout());

JPanel myPanel = new JPanel();

myPanel.setLayout(new GridBagLayout());

GridBagConstraints gbc = new GridBagConstraints();

JPanel[] panels = new JPanel[4]; //

gbc.insets = new Insets(1,3,0,3);

gbc.weightx = 1.0;

gbc.fill = GridBagConstraints.HORIZONTAL;

gbc.gridwidth = GridBagConstraints.REMAINDER;

for(int j = 0; j < panels.length; j++)

{

panels[j] = new JExpandablePanel();

myPanel.add(panels[j], gbc);

}

mainFrame.getContentPane().add(myPanel, BorderLayout.NORTH);

mainFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

mainFrame.pack();

mainFrame.setVisible(true);

}

}

效果图：

顶级技巧：

为了保证内容面板展开与收起时候，UI自动pack与刷新。尽量不要

设置UI的固定大小。使用JExpandablePanel时候，推荐使用GridBagLayout