swing中JList控件使用:每一项以 图片+文字(文字在图片的下面) 的形式显示并且在水平方向排列

时间:2023-01-27 23:20:56

最近研究了一下java swing中jlist控件的使用方式。要达到的效果如标题,要实现这个功能,重点在一下几个方面:

  • 需要改变JList的cellRender来支持对图片的显示,默认的cellRender只会显示文本字符串
  • 设置Jlist的每一项的显示方向为horizon
  • 设置每一项选中后的背景

接下来是代码实现:

  1. 创建一个ImageListModel,继承AbstractListModel,设置为JList的列表模型
package com.swing.jlist;

import java.io.File;
import java.util.ArrayList;
import java.util.List;

import javax.swing.AbstractListModel;

public class ImageListModel extends AbstractListModel<File> {

	private static final long serialVersionUID = 1L;
	
	private List<File> imageFile = new ArrayList<File>();

	public void addElement(File file){
		this.imageFile.add(file);
	}
	
	public int getSize() {
		return imageFile.size();
	}

	public File getElementAt(int index) {
		return imageFile.get(index);
	}

}
这里ImageListModel 每一个元素都是一个File,这个file为png格式的图片文件。
2.  创建ImageCellRender,更改Jlist每一项的显示样式
package com.swing.jlist;

import java.awt.Component;
import java.io.File;

import javax.swing.DefaultListCellRenderer;
import javax.swing.ImageIcon;
import javax.swing.JList;
import javax.swing.SwingConstants;

public class ImageCellRender extends DefaultListCellRenderer {

	private static final long serialVersionUID = 1L;

	public Component getListCellRendererComponent(JList<? extends Object> list,
			Object value, int index, boolean isSelected, boolean cellHasFocus) {
		super.getListCellRendererComponent(list, value, index, isSelected, cellHasFocus);
		
		if (value instanceof File) {
			File imageFile = (File) value;
			try {
				ImageIcon icon = new ImageIcon(imageFile.toURI().toURL());
				setIcon(icon);
				setText(imageFile.getName());
				<span style="color:#ff0000;">setVerticalTextPosition(SwingConstants.BOTTOM);
				setHorizontalTextPosition(SwingConstants.CENTER);</span>
				
			} catch (Exception e) {
				e.printStackTrace();
			}

		}

		return this;
	}
}
这里ImageCellRender继承DefaultListCellRender,DefaultListCellRender继承于JLabel,所以只要将图片赋给Jlabel就可以更改显示样式,而要达到文字在图片的下面显示的效果就需要设置JLabel的TextPosition。

3.  Demo
package com.swing.jlist;

import java.awt.BorderLayout;
import java.io.File;
import java.io.FileFilter;

import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JList;
import javax.swing.JScrollPane;

public class JListDemo extends JFrame {

	private static final long serialVersionUID = 1L;
	
	public JListDemo(){
		JList<File> list = new JList<File>();
		ImageListModel listModel = new ImageListModel();
		File[] files = new File("pic").listFiles(new FileFilter() {
			
			public boolean accept(File file) {
				return file.getName().endsWith("png");
			}
		});
		for(File file: files){
			listModel.addElement(file);
		}
		list.setModel(listModel);
		list.setCellRenderer(new ImageCellRender());
		list.setLayoutOrientation(JList.HORIZONTAL_WRAP);
		list.setVisibleRowCount(1);
		
		JScrollPane scrollPane = new JScrollPane(list);
		
		getContentPane().add(scrollPane,BorderLayout.CENTER);
		getContentPane().add(new JLabel("带图片的Jlist"),BorderLayout.NORTH);
		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		setLocationRelativeTo(null);
		pack();
		setVisible(true);
	}
	
	public static void main(String[] args) {
		new JListDemo();
	}

}

4.  最后运行的效果
swing中JList控件使用:每一项以 图片+文字(文字在图片的下面) 的形式显示并且在水平方向排列