天天看點
傳回

用Java swing寫的一個音樂播放器的個性化界面實作作業（隻有界面！）

這個是我們使用者界面設計的作業。

要求是，可以換膚，個性化，皮膚半透明。

話不多說，先上圖吧。第一個界面做得精緻一些，第二個，沒來得及好好改。但是原理就這樣了。

用Java swing寫的一個音樂播放器的個性化界面實作作業（隻有界面！）
用Java swing寫的一個音樂播放器的個性化界面實作作業（隻有界面！）

接下來貼代碼

這個是主界面

package guoyang;

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.EventQueue;
import java.awt.Frame;
import java.awt.Graphics;
import java.awt.Image;

import javax.imageio.ImageIO;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JButton;
import javax.swing.SwingConstants;

import java.awt.FlowLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.FocusEvent;
import java.awt.event.FocusListener;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;
import java.awt.event.MouseMotionListener;
import java.io.File;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

import javax.swing.JScrollPane;
import javax.swing.JSplitPane;
import javax.swing.ImageIcon;
import javax.swing.BoxLayout;
import javax.swing.JLabel;
import javax.swing.JTextField;
import javax.swing.ListModel;
import javax.swing.border.EmptyBorder;
import javax.swing.JProgressBar;

import java.awt.Dimension;
import java.awt.SystemColor;
import java.awt.Font;

import javax.swing.JTable;
import javax.swing.JList;
import javax.swing.JTextArea;

public class Main2 {

	private JFrame frame;
	private JTextField textField;
	private JTable table;
	JPanel backImage;

	/**
	 * Launch the application.
	 */
	public static void main(String[] args) {
		EventQueue.invokeLater(new Runnable() {
			public void run() {
				try {
					Main2 window = new Main2();
					window.frame.setVisible(true);
				} catch (Exception e) {
					e.printStackTrace();
				}
			}
		});
	}

	/**
	 * Create the application.
	 */
	public Main2() {
		initialize();
	}

	/**
	 * Initialize the contents of the frame.
	 */
	private void initialize() {
		
		
		frame = new JFrame();
		frame.setUndecorated(true);
		frame.setOpacity((float) 0.90);
		
		FrameListener moveListener = new FrameListener(frame);
        
        frame.addMouseListener(moveListener);
        frame.addMouseMotionListener(moveListener);

		frame.setBounds(100, 100, 640, 400);
		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		
		 backImage = new JPanel()
		{
			protected void paintComponent(Graphics g)
			{
				try
				{
					Image bg = ImageIO.read(new File("img//1.jpg"));
					// 繪制一張圖檔作為背景
					g.drawImage(bg , 0 , 0 , getWidth() , getHeight() ,  null);
				}
				catch (IOException ex)
				{
					ex.printStackTrace();
				}
			}
		};
		
		backImage.setLayout(new BorderLayout(0, 0));
		frame.getContentPane().add(backImage);
		
		JPanel panel_1 = new JPanel();
		backImage.add(panel_1, BorderLayout.NORTH);
		//panel_1.setOpaque(false);
		//panel_1.setOpaque((float) 0.90);
		panel_1.setBackground(Color.LIGHT_GRAY);
		panel_1.setLayout(new BoxLayout(panel_1, BoxLayout.X_AXIS));
		
		JPanel panel_2 = new JPanel();
		//panel_2.setOpaque(false);
		panel_2.setBackground(Color.GRAY);
		FlowLayout flowLayout_1 = (FlowLayout) panel_2.getLayout();
		flowLayout_1.setAlignment(FlowLayout.LEFT);
		panel_1.add(panel_2);
		
		JLabel label = new JLabel("");
		label.setIcon(new ImageIcon("img\\Logo-96-32.png"));
		//label.setBackground(new Color(1,1,0,0f));
		panel_2.add(label);
		
		textField = new JTextFieldUser("img\\sousuo.png");
		panel_2.add(textField);
		textField.setColumns(10);
		textField.setText("搜尋歌曲");
		textField.setBackground(new Color(1,1,1,1f));
		textField.setBorder(new EmptyBorder(0,0, 0, 0));
		
		textField.addMouseListener(new MouseListener(){

			@Override
			public void mouseClicked(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}

			@Override
			public void mousePressed(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}

			@Override
			public void mouseReleased(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}

			@Override
			public void mouseEntered(MouseEvent e) {
				textField.setText("");
				
			}

			@Override
			public void mouseExited(MouseEvent e) {
				textField.setText("搜尋歌曲");
				
			}
			
		});
		
		
		JPanel panel = new JPanel();
		FlowLayout flowLayout = (FlowLayout) panel.getLayout();
		flowLayout.setAlignment(FlowLayout.RIGHT);
		panel.setBackground(Color.GRAY);
		panel_1.add(panel);
		
		JLabel pifu = new JLabel("         ");
		
		panel.add(pifu);
		pifu.setIcon(new ImageIcon("img\\pifu.png"));
		
		JLabel minbtn = new JLabel("");
		panel.add(minbtn);
		
		JLabel maxbtn = new JLabel("");
		
		//maxbtn.setBackground(new Color(1,1,1,0f));
		panel.add(maxbtn);
		
		JLabel closebtn = new JLabel("");
		//closebtn.setBackground(new Color(1,1,1,0f));
		panel.add(closebtn);
		
		
		maxbtn.setIcon(new ImageIcon("img\\maxhui.png"));
		closebtn.setIcon(new ImageIcon("img\\closehui.png"));
		minbtn.setIcon(new ImageIcon("img\\minhui.png"));
		
		
		JPanel panel_3 = new JPanel();
		panel_3.setBackground(SystemColor.menu);
		backImage.add(panel_3, BorderLayout.SOUTH);
		
		JLabel last = new JLabel("");
		last.setIcon(new ImageIcon("img\\shangyishou_gray.png"));
		panel_3.add(last);
		
		JLabel run = new JLabel("");
		run.setIcon(new ImageIcon("img\\bofang-Gray.png"));
		panel_3.add(run);
		
		JLabel next = new JLabel("");
		next.setIcon(new ImageIcon("img\\xiayishou_gray.png"));
		panel_3.add(next);
		
		JLabel lblNewLabel_3 = new JLabel("00:20");
		panel_3.add(lblNewLabel_3);
		
		JProgressBar progressBar = new JProgressBar();
		progressBar.setForeground(Color.GRAY);
		progressBar.setValue(40);
		//progressBar.setBackground(Color.GRAY);
		progressBar.setPreferredSize(new Dimension(300, 8));
		panel_3.add(progressBar);
		
		JLabel lblNewLabel_4 = new JLabel("04:20");
		panel_3.add(lblNewLabel_4);
		
		JLabel volum = new JLabel("");
		volum.setIcon(new ImageIcon("img\\13.png"));
		panel_3.add(volum);
		
		JProgressBar progress = new JProgressBar();
		progress.setForeground(Color.GRAY);
		progress.setValue(40);
		progress.setPreferredSize(new Dimension(70, 12));
		panel_3.add(progress);
		
		
		JLabel shunxu = new JLabel("");
		shunxu.setIcon(new ImageIcon("img\\10.png"));
		panel_3.add(shunxu);
		
		JLabel label_2 = new JLabel("詞");
		panel_3.add(label_2);
		
		JPanel panel_4 = new JPanel();
		panel_4.setBackground(new Color(1,1,1,0.2f));
		backImage.add(panel_4, BorderLayout.WEST);
		panel_4.setLayout(new BoxLayout(panel_4, BoxLayout.Y_AXIS));
		
		
		
		JPanel panel_6 = new JPanel();
		panel_6.setBackground(new Color(1,1,1,0.2f));
		panel_4.add(panel_6);
		panel_6.setLayout(new BoxLayout(panel_6, BoxLayout.Y_AXIS));
		
		JLabel label_3 = new JLabel(" ");
		panel_6.add(label_3);
		
		JLabel lbln = new JLabel("\u6211\u7684\u97F3\u4E50\r\n\r\n");
		lbln.setFont(new Font("微軟雅黑", Font.BOLD, 18));
		panel_6.add(lbln);
		
		JLabel lblNewLabel = new JLabel(" ");
		panel_6.add(lblNewLabel);
		
		JLabel label_1 = new JLabel("\u6211\u4E0B\u8F7D\u7684");
		label_1.setFont(new Font("微軟雅黑", Font.BOLD, 18));
		panel_6.add(label_1);
		
		JLabel lblNewLabel_1 = new JLabel(" ");
		panel_6.add(lblNewLabel_1);
		
		JLabel label_4 = new JLabel("\u6211\u6536\u85CF\u7684");
		label_4.setFont(new Font("微軟雅黑", Font.BOLD, 18));
		panel_6.add(label_4);
		
		JLabel label_5 = new JLabel(" ");
		label_5.setFont(new Font("微軟雅黑", Font.BOLD, 18));
		panel_6.add(label_5);
		
		JLabel lblmv = new JLabel("\u5386\u53F2\u8BB0\u5F55");
		lblmv.setFont(new Font("微軟雅黑", Font.BOLD, 18));
		panel_6.add(lblmv);
		
		JPanel panel_5 = new JPanel();
		//panel_5.setForeground(new Color(1,1,1,0.2f));
		panel_5.setOpaque(false);
		backImage.add(panel_5, BorderLayout.CENTER);
		
		JTextArea textArea = new JTextArea();
		//textArea.setEnabled(false);
		//textArea.setEditable(false);
		textArea.setForeground(Color.DARK_GRAY);
		textArea.setFont(new Font("楷體", Font.PLAIN, 20));
		textArea.setBackground(new Color(1,1,1,0f));
		textArea.setText("想再回到舊生活\n"
				+ " 怎樣都找不到出口 \n"
				+ "遲早會斷了念頭\n "
				+ "什麼是對或錯\n "
				+ "判斷能力可能減弱 \n"
				+ "誰現在會來幫我\n "
				+ "你說是我找借口\n "
				+ "其實并沒想逃脫\n"
				+ " 總覺得情緒壓迫\n"
				+ " 也不是我的錯\n "
				+ "this is my free\n "
				+ "oh this is my free\n");
		//JScrollPane scr=new JScrollPane();
		//scr.setOpaque(false);
		panel_5.add(textArea);
		
		
		
		
		
		
		Object[] resultTitle = {"序号","音樂标題" , "歌手" , "時長"};
		Object[][] data = {{"單詞" , "種别碼" , "類别","行号"}};
		table = new JTable(data,resultTitle);
		table.setOpaque(false);
		//JScrollPane scr=new JScrollPane(table);
		//scr.setOpaque(false);
		table.setBackground(new Color(1,1,1,0.2f));
		//panel_5.add(scr);
		
		
		
		
		
		maxbtn.addMouseListener(new MouseListener(){

			@Override
			public void mouseClicked(MouseEvent e) {
				if(frame.getExtendedState()==Frame.MAXIMIZED_BOTH){
					frame.setExtendedState(Frame.NORMAL);
				}else{
					frame.setExtendedState(Frame.MAXIMIZED_BOTH);
				}
				
			}

			@Override
			public void mousePressed(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}

			@Override
			public void mouseReleased(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}

			@Override
			public void mouseEntered(MouseEvent e) {
				
				maxbtn.setIcon(new ImageIcon("img\\maxbai.png"));
			}

			@Override
			public void mouseExited(MouseEvent e) {
				maxbtn.setIcon(new ImageIcon("img\\maxhui.png"));
				
			}

			
			
		});
		minbtn.addMouseListener(new MouseListener(){

			@Override
			public void mouseClicked(MouseEvent e) {
				
				frame.setExtendedState(Frame.ICONIFIED);
				
				
			}

			@Override
			public void mousePressed(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}

			@Override
			public void mouseReleased(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}

			@Override
			public void mouseEntered(MouseEvent e) {
				minbtn.setIcon(new ImageIcon("img\\minbai.png"));
				
			}

			@Override
			public void mouseExited(MouseEvent e) {
				minbtn.setIcon(new ImageIcon("img\\minhui.png"));
				
			}

			
			
		});
		closebtn.addMouseListener(new MouseListener(){

			@Override
			public void mouseClicked(MouseEvent e) {
				frame.dispose();
			}

			@Override
			public void mousePressed(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}

			@Override
			public void mouseReleased(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}

			@Override
			public void mouseEntered(MouseEvent e) {
				closebtn.setIcon(new ImageIcon("img\\closebai.png"));
			}
			@Override
			public void mouseExited(MouseEvent e) {
				closebtn.setIcon(new ImageIcon("img\\closehui.png"));
			}
			
		});
		
		pifu.addMouseListener(new MouseListener(){

			@Override
			public void mouseClicked(MouseEvent e) {
				frame.getContentPane().remove(backImage);
				last.setIcon(new ImageIcon("img1\\shangyishou_blue.png"));
				next.setIcon(new ImageIcon("img1\\xiayishou_blue.png"));
				run.setIcon(new ImageIcon("img1\\bofang_blue.png"));
				panel_1.setBackground(new Color(0,0,1,0.2f));
				panel_2.setBackground(new Color(0,0,1,0.2f));
				panel.setBackground(new Color(0,0,1,0.2f));
				panel_3.setBackground(new Color(0,0,1,0.2f));
				
				backImage = new JPanel()
				{
					protected void paintComponent(Graphics g)
					{
						try
						{
							Image bg = ImageIO.read(new File("img1//timg.jpg"));
							// 繪制一張圖檔作為背景
							g.drawImage(bg , 0 , 0 , getWidth() , getHeight() ,  null);
						}
						catch (IOException ex)
						{
							ex.printStackTrace();
						}
					}
				};
				backImage.setLayout(new BorderLayout());
				backImage.add(panel_1, BorderLayout.NORTH);
				backImage.add(panel_3, BorderLayout.SOUTH);
				backImage.add(panel_4, BorderLayout.WEST);
				backImage.add(panel_5, BorderLayout.CENTER);
				frame.getContentPane().add(backImage);
				frame.revalidate();
			}

			@Override
			public void mousePressed(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}

			@Override
			public void mouseReleased(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}

			@Override
			public void mouseEntered(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}

			@Override
			public void mouseExited(MouseEvent e) {
				// TODO Auto-generated method stub
				
			}
			
		});
		
	
	}

}

這個是一個小控件，帶上了圖示的textField。

就是圖上的搜尋那個框框

package guoyang;

import java.awt.Graphics;  
import java.awt.Insets;  
import javax.swing.ImageIcon;  
import javax.swing.JTextField;  
  
/** 
 * 
 * @author WZH 
 */  
public class JTextFieldUser extends JTextField {  
    private ImageIcon icon;  
  
    public JTextFieldUser(String str) {  
        //擷取目前路徑下的圖檔  
        icon = new ImageIcon(str);  
        Insets insets = new Insets(0, 20, 0, 0);  
        //設定文本輸入距左邊20  
        this.setMargin(insets);  
    }  
      
    @Override  
    public void paintComponent(Graphics g) {  
        Insets insets = getInsets();  
        super.paintComponent(g);  
        int iconWidth = icon.getIconWidth();  
        int iconHeight = icon.getIconHeight();  
        int Height = this.getHeight();  
        //在文本框中畫上之前圖檔  
        icon.paintIcon(this, g,  this.getWidth()- iconWidth, (Height - iconHeight) / 2);  
    }  
}

這個是一個監聽器，主界面的jframe得注冊這個監聽器才能移動。

package guoyang;

import java.awt.Point;
import java.awt.Rectangle;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;

import javax.swing.JFrame;

public class FrameListener extends MouseAdapter {
	private Point lastPoint = null;
	private JFrame window = null;
	
	public FrameListener(JFrame window){
		this.window = window;
	}
	
	@Override
	public void mousePressed(MouseEvent e){
		lastPoint = e.getLocationOnScreen();
		//System.out.println(lastPoint);
	}
	
	@Override
	public void mouseDragged(MouseEvent e){
		//System.out.println(e);
		Point point = e.getLocationOnScreen();
		int offsetX = point.x - lastPoint.x;
		int offsetY = point.y - lastPoint.y;
		
		Rectangle bounds = window.getBounds();
		bounds.x += offsetX;
		bounds.y += offsetY;
		window.setBounds(bounds);
		lastPoint = point;
	}
}

還有兩個圖檔的檔案夾。

我試試把工程傳到github上。

有需要的同學可以自行下載下傳。

代碼寫的很匆忙。有些亂，沒來得及好好的雕琢。

https://github.com/guoyang1996/music.git

學習問題 使用者界面設計
上一篇: 海康SDK配置以及 windows/linux下python接口的封裝（swig）1.4_海康SDK
下一篇: linux伺服器檢視IO - agang_19

繼續閱讀